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;\">📢 Les messages vocaux sont disponibles via la boîte vocale premium. Un paiement est requis pour l’activer et y accéder.</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.     
  1883.     // Fonction pour obtenir le nombre actuel de favoris
  1884.     function getCurrentFavoriteCount() {
  1885.         const likeCountLabel = document.getElementById(\"likeCount\");
  1886.         return parseInt(likeCountLabel?.textContent.trim(), 10) || 0;
  1887.     }
  1888.     // Fonction pour mettre à jour le contenu de l'alerte
  1889.     function updatePurchaseAlert(current) {
  1890.   let remainingForAlbum = Math.max(0, 20 - current);
  1891.   let remainingForPochette = Math.max(0, 12 - current);
  1892.   let remainingForPack = Math.max(0, 12 - current);
  1893.   const progressBar = (count, total, color) => `
  1894.   <div style=\"margin: 5px 0;\">
  1895.     <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  1896.       <div style=\"width: \${
  1897.         (count / total) * 100
  1898.       }%; background-color: \${color}; height: 100%;\"></div>
  1899.     </div>
  1900.     <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  1901.   </div>
  1902. `;
  1903.   // Use Twig paths here:
  1904.   const products = [
  1905.       {
  1906.       name: \"Pochette photo (12 photos)\",
  1907.       required: 12,
  1908.       remaining: remainingForPochette,
  1909.       image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  1910.       color: \"#2196f3\",
  1911.       link: \"";
  1912.         // line 1446
  1913.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  1914.         yield "\",
  1915.     },
  1916.        {
  1917.       name: \"Pack numérique (20 photos)\",
  1918.       required: 20,
  1919.       remaining: remainingForAlbum,
  1920.       image: \"/images/produit/photoNumerique.jpg\",
  1921.       color: \"#4caf50\",
  1922.       link: \"";
  1923.         // line 1454
  1924.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 20]);
  1925.         yield "\",
  1926.     }
  1927.   
  1928.   
  1929.     
  1930.   ].sort((a, b) => a.remaining - b.remaining);
  1931.   const productList = products
  1932.     .map((product) => {
  1933.       const count = current;
  1934.       const total = product.required;
  1935.       const remaining = product.remaining;
  1936.       return `
  1937.     <li style=\"margin-bottom: 15px;\">
  1938.       <div style=\"display: flex; align-items: center; gap: 10px;\">
  1939.         <img
  1940.           src=\"\${product.image}\"
  1941.           alt=\"\${product.name}\"
  1942.           style=\"width: 65px; height: 65px; border-radius: 5px; margin-top:-19px\"
  1943.         />
  1944.         <div style=\"flex: 1;\">
  1945.           <strong style=\"font-size: 14px;\">\${product.name}</strong>
  1946.           \${progressBar(count, total, product.color)}
  1947.           \${
  1948.             remaining > 0
  1949.               ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  1950.                    Encore \${remaining} photos ❤️ pour compléter \${product.name.toLowerCase()}
  1951.                  </small>`
  1952.               : `<button
  1953.                   style=\"
  1954.                     margin-top: 5px;
  1955.                     padding: 5px 8px;
  1956.                     background-color: \${product.color};
  1957.                     color: white;
  1958.                     border: none;
  1959.                     border-radius: 5px;
  1960.                     font-size: 12px;
  1961.                     cursor: pointer;
  1962.                   \"
  1963.                   onclick=\"window.location.href='\${product.link}'\"
  1964.                 >
  1965.                   Commander
  1966.                 </button>`
  1967.           }
  1968.         </div>
  1969.       </div>
  1970.     </li>
  1971.   `;
  1972.     })
  1973.     .join(\"\");
  1974.   const plusButton = `
  1975.     <li style=\"margin-bottom: 15px; text-align: center;\">
  1976.       <button
  1977.         style=\"
  1978.           padding: 5px 8px;
  1979.           background-color: #F56040;
  1980.           color: white;
  1981.           border: none;
  1982.           border-radius: 5px;
  1983.           font-size: 14px;
  1984.           line-height: 1;
  1985.           width: 150px;
  1986.           height: 40px;
  1987.           cursor: pointer;
  1988.         \"
  1989.         onclick=\"window.location.href='";
  1990.         // line 1521
  1991.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("boutique5sur5");
  1992.         yield "'\"
  1993.       >
  1994.         Aller à la boutique
  1995.       </button>
  1996.     </li>
  1997.   `;
  1998.   if (current === 0) {
  1999.     alertContent.innerHTML = `
  2000.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  2001.       Vous n'avez pas encore de photos favorites !
  2002.     </p>
  2003.     <p style=\"margin-bottom: 20px; color: #555;\">
  2004.       Commencez à ajouter vos moments préférés pour profiter de nos offres.
  2005.     </p>
  2006.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  2007.   `;
  2008.   } else {
  2009.     alertContent.innerHTML = `
  2010.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  2011.       Vous avez atteint \${current} photos favorites !
  2012.     </p>
  2013.     <p style=\"margin-bottom: 20px; color: #555;\">
  2014.       Profitez de nos offres spéciales :
  2015.     </p>
  2016.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  2017.   `;
  2018.   }
  2019.   purchaseAlert.classList.remove(\"hidden\");
  2020.   clearTimeout(purchaseAlertTimeout);
  2021.   purchaseAlertTimeout = setTimeout(() => {
  2022.     if (!purchaseAlert.matches(\":hover\")) {
  2023.       closePurchaseAlert();
  2024.     }
  2025.   }, 5000);
  2026. }
  2027.     // Fonction pour fermer l'alerte
  2028.     function closePurchaseAlert() {
  2029.       purchaseAlert.classList.add(\"hidden\");
  2030.     }
  2031.     // Événement pour mettre à jour le contenu et afficher la popover dynamiquement au hover
  2032.     document.querySelector(\".fav-button\").addEventListener(\"mouseover\", () => {
  2033.       const currentCount = getCurrentFavoriteCount();
  2034.       updatePurchaseAlert(currentCount);
  2035.       purchaseAlert.classList.remove(\"cachee\"); // Réaffiche la popover
  2036.     });
  2037.     function showSelection() {
  2038.       document.getElementById(\"purchase-alert\").style.display = \"block\";
  2039.     }
  2040.     function hideSelection() {
  2041.       document.getElementById(\"selectionPopover\").style.display = \"none\";
  2042.     }
  2043.     document.addEventListener(\"DOMContentLoaded\", function () {
  2044.       const container = document.querySelector(\".date-container\");
  2045.       // Vérifie si le conteneur existe pour éviter les erreurs
  2046.       if (container) {
  2047.         container.scrollTo({
  2048.           left: container.scrollWidth, // Scroll directement à la position maximale
  2049.           behavior: \"smooth\", // Défilement fluide
  2050.         });
  2051.       }
  2052.     });
  2053.     document.addEventListener(\"DOMContentLoaded\", function () {
  2054.       const container = document.querySelector(\".date-container\");
  2055.       const leftArrow = document.querySelector(\".scroll-btn.left\");
  2056.       const rightArrow = document.querySelector(\".scroll-btn.right\");
  2057.       // Fonction pour vérifier le débordement et activer/désactiver les flèches
  2058.       function updateArrowsVisibility() {
  2059.         const isOverflowing = container.scrollWidth > container.clientWidth; // Vérifie si débordement
  2060.         leftArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  2061.         rightArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  2062.       }
  2063.       // Fonction pour défiler
  2064.       function scrollContainer(direction) {
  2065.         container.scrollBy({
  2066.           left: direction === \"left\" ? -200 : 200, // Défiler à gauche ou à droite
  2067.           behavior: \"smooth\",
  2068.         });
  2069.       }
  2070.       // Ajout des événements de clic pour les flèches
  2071.       leftArrow.addEventListener(\"click\", () => scrollContainer(\"left\"));
  2072.       rightArrow.addEventListener(\"click\", () => scrollContainer(\"right\"));
  2073.       // Vérification initiale et sur redimensionnement de la fenêtre
  2074.       updateArrowsVisibility();
  2075.       window.addEventListener(\"resize\", updateArrowsVisibility);
  2076.     });
  2077.     document.addEventListener(\"DOMContentLoaded\", function () {
  2078.       const container = document.querySelector(\".date-container\");
  2079.       const leftBtn = document.querySelector(\".scroll-btn.left\");
  2080.       const rightBtn = document.querySelector(\".scroll-btn.right\");
  2081.       leftBtn.addEventListener(\"click\", () => {
  2082.         container.scrollBy({
  2083.           left: -200, // Défile vers la gauche
  2084.           behavior: \"smooth\",
  2085.         });
  2086.       });
  2087.       rightBtn.addEventListener(\"click\", () => {
  2088.         container.scrollBy({
  2089.           left: 200, // Défile vers la droite
  2090.           behavior: \"smooth\",
  2091.         });
  2092.       });
  2093.     });
  2094.  document.addEventListener(\"DOMContentLoaded\", function () {
  2095.     // Sélectionnez tous les badges de filtre
  2096.     const filterBadges = document.querySelectorAll(\".filter-badge\");
  2097.     // Sélectionnez tous les éléments de la galerie
  2098.     const galleryItems = document.querySelectorAll(\".column\");
  2099.     // Sélectionnez tous les jours
  2100.     const days = document.querySelectorAll(\".collapse\");
  2101.     // Fonction pour réinitialiser les filtres
  2102.     function resetFilters() {
  2103.         // Réinitialisez tous les éléments de la galerie
  2104.         galleryItems.forEach((item) => {
  2105.             item.style.display = \"block\";
  2106.         });
  2107.         // Réinitialisez les états des badges
  2108.         filterBadges.forEach((badge) => badge.classList.remove(\"active\"));
  2109.     }
  2110.     // Ajoutez un gestionnaire d'événements pour chaque badge
  2111.     filterBadges.forEach((badge) => {
  2112.         badge.addEventListener(\"click\", function () {
  2113.             const filter = this.getAttribute(\"data-filter\");
  2114.             // Réinitialisez l'état actif pour tous les badges
  2115.             filterBadges.forEach((btn) => btn.classList.remove(\"active\"));
  2116.             // Ajoutez l'état actif au badge cliqué
  2117.             this.classList.add(\"active\");
  2118.             // Affichez ou masquez les éléments de la galerie
  2119.             galleryItems.forEach((item) => {
  2120.                 if (filter === \"all\") {
  2121.                     item.style.display = \"block\";
  2122.                 } else if (filter === \"photo\" && item.querySelector(\"img\")) {
  2123.                     item.style.display = \"block\";
  2124.                 } else if (filter === \"video\" && item.querySelector(\"video\")) {
  2125.                     item.style.display = \"block\";
  2126.                 } else if (filter === \"audio\" && item.classList.contains(\"audio-message-item\")) {
  2127.                     item.style.display = \"block\";
  2128.                 } else {
  2129.                     item.style.display = \"none\";
  2130.                 }
  2131.             });
  2132.         });
  2133.     });
  2134.     // Réinitialiser les filtres lors du changement de jour
  2135.     days.forEach((day) => {
  2136.         day.addEventListener(\"show.bs.collapse\", function () {
  2137.             resetFilters();
  2138.         });
  2139.     });
  2140. });
  2141.     \$(document).ready(function () {
  2142.       let zoomCounter = 0; // Initialize zoom counter
  2143.       let currentImageSrc = \"\"; // Track current image source
  2144.       let lastClickPosition = { x: 50, y: 50 }; // Default to center of image
  2145.       \$(\".container--gallery\").magnificPopup({
  2146.         delegate: \"a\",
  2147.         type: \"image\",
  2148.         mainClass: \"mfp-with-zoom mfp-img-mobile\",
  2149.         image: {
  2150.           verticalFit: true,
  2151.         },
  2152.         gallery: {
  2153.           enabled: true,
  2154.           tPrev: \"Previous (Left arrow key)\", // Alt text on left arrow
  2155.           tNext: \"Next (Right arrow key)\", // Alt text on right arrow
  2156.           tCounter: \"%curr% of %total%\", // Markup for \"1 of 7\" counter
  2157.         },
  2158.         zoom: {
  2159.           enabled: true,
  2160.           duration: 300,
  2161.           opener: function (element) {
  2162.             return element.find(\"img\");
  2163.           },
  2164.         },
  2165.         callbacks: {
  2166.           open: function () {
  2167.             // Get current image data from the link that was clicked
  2168.             const currentLink = this.currItem.el;
  2169.             const imageId =
  2170.               currentLink
  2171.                 .closest(\".photo-zoom\")
  2172.                 .find(\".heart-icon\")
  2173.                 .data(\"id\") || \"\";
  2174.             const sejourId =
  2175.               currentLink
  2176.                 .closest(\".photo-zoom\")
  2177.                 .find(\".heart-icon\")
  2178.                 .data(\"sejour-id\") || \"\";
  2179.             const imagePath =
  2180.               currentLink
  2181.                 .closest(\".photo-zoom\")
  2182.                 .find(\".heart-icon\")
  2183.                 .data(\"path\") || \"\";
  2184.             const imageDesc =
  2185.               currentLink
  2186.                 .closest(\".photo-zoom\")
  2187.                 .find(\".heart-icon\")
  2188.                 .data(\"description\") || \"\";
  2189.             const isFavorite = currentLink
  2190.               .closest(\".photo-zoom\")
  2191.               .find(\".heart-icon i\")
  2192.               .hasClass(\"bi-heart-fill\");
  2193.             const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  2194.             const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  2195.             const favoriteTooltip = isFavorite
  2196.               ? \"Retirer des favoris\"
  2197.               : \"Ajouter aux favoris\";
  2198.             const zoomControls = `
  2199.           <div class=\"mfp-zoom-controls\">
  2200.             <button class=\"zoom-btn zoom-out\" title=\"Zoom Out\"><i class=\"fa fa-search-minus\"></i></button>
  2201.             <button class=\"zoom-btn zoom-in\" title=\"Zoom In\"><i class=\"fa fa-search-plus\"></i></button>
  2202.           </div>
  2203.           <div class=\"mfp-favorite\">
  2204.             <button class=\"favorite-btn\" 
  2205.                     data-id=\"\${imageId}\" 
  2206.                     data-sejour-id=\"\${sejourId}\" 
  2207.                     data-path=\"\${imagePath}\" 
  2208.                     data-description=\"\${imageDesc}\"
  2209.                     title=\"\${favoriteTooltip}\">
  2210.               <i class=\"bi \${favoriteIconClass}\" style=\"color: \${favoriteIconColor}; text-shadow: 0px 0px 3px rgba(0,0,0,0.5);\"></i>
  2211.             </button>
  2212.           </div>
  2213.           <div class=\"mfp-counter\"></div>
  2214.         `;
  2215.             \$(\".mfp-content\").append(zoomControls);
  2216.             initializeZoomControls();
  2217.             initializeFavoriteButton();
  2218.             const intervalId = setInterval(() => {
  2219.               const newImageSrc = \$(\".mfp-img\").attr(\"src\");
  2220.               if (newImageSrc !== currentImageSrc) {
  2221.                 currentImageSrc = newImageSrc;
  2222.                 zoomCounter = 0;
  2223.                 lastClickPosition = { x: 50, y: 50 }; // Reset to center
  2224.                 attachZoomHandler(); // Reattach zoom handler to new image
  2225.                 \$(\".mfp-img\").css({
  2226.                   \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2227.                   transform: `scale(1)`,
  2228.                 });
  2229.                 // Update favorite button for the new image
  2230.                 updateFavoriteButton();
  2231.                 initializeZoomControls();
  2232.                 updateCounter();
  2233.               }
  2234.             }, 100);
  2235.             this.content.on(\"mfpClose\", function () {
  2236.               clearInterval(intervalId);
  2237.             });
  2238.             attachZoomHandler();
  2239.           },
  2240.           close: function () {
  2241.             \$(\".mfp-zoom-controls\").remove();
  2242.             \$(\".mfp-favorite\").remove();
  2243.             \$(\".mfp-counter\").remove();
  2244.             zoomCounter = 0;
  2245.           },
  2246.         },
  2247.       });
  2248.       function attachZoomHandler() {
  2249.         \$(\".mfp-img\")
  2250.           .off(\"click\")
  2251.           .on(\"click\", function (event) {
  2252.             event.stopPropagation(); // Prevent default navigation behavior
  2253.             // Calculate click coordinates relative to the image
  2254.             const imgOffset = \$(this).offset();
  2255.             const clickX = event.pageX - imgOffset.left;
  2256.             const clickY = event.pageY - imgOffset.top;
  2257.             const imgWidth = \$(this).width();
  2258.             const imgHeight = \$(this).height();
  2259.             // Calculate transform-origin based on click position
  2260.             lastClickPosition = {
  2261.               x: (clickX / imgWidth) * 100,
  2262.               y: (clickY / imgHeight) * 100,
  2263.             };
  2264.             // Cycle through zoom levels: 1x, 1.5x, 2x
  2265.             zoomCounter = (zoomCounter + 1) % 3;
  2266.             const zoomLevels = [1, 1.5, 2];
  2267.             const zoomLevel = zoomLevels[zoomCounter];
  2268.             \$(this).css({
  2269.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2270.               transform: `scale(\${zoomLevel})`,
  2271.             });
  2272.             updateZoomButtonState();
  2273.           });
  2274.       }
  2275.       function initializeZoomControls() {
  2276.         \$(\".mfp-zoom-controls .zoom-in\")
  2277.           .off(\"click\")
  2278.           .on(\"click\", function (event) {
  2279.             event.stopPropagation();
  2280.             zoomCounter = (zoomCounter + 1) % 3;
  2281.             const zoomLevels = [1, 1.5, 2];
  2282.             const zoomLevel = zoomLevels[zoomCounter];
  2283.             \$(\".mfp-img\").css({
  2284.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2285.               transform: `scale(\${zoomLevel})`,
  2286.             });
  2287.             updateZoomButtonState();
  2288.           });
  2289.         \$(\".mfp-zoom-controls .zoom-out\")
  2290.           .off(\"click\")
  2291.           .on(\"click\", function (event) {
  2292.             event.stopPropagation();
  2293.             if (zoomCounter > 0) {
  2294.               zoomCounter -= 1;
  2295.               const zoomLevels = [1, 1.5, 2];
  2296.               const zoomLevel = zoomLevels[zoomCounter];
  2297.               \$(\".mfp-img\").css({
  2298.                 \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  2299.                 transform: `scale(\${zoomLevel})`,
  2300.               });
  2301.               updateZoomButtonState();
  2302.             } else {
  2303.               \$.magnificPopup.close();
  2304.             }
  2305.           });
  2306.       }
  2307.       function initializeFavoriteButton() {
  2308.         \$(\".mfp-favorite .favorite-btn\")
  2309.           .off(\"click\")
  2310.           .on(\"click\", function (event) {
  2311.             event.stopPropagation();
  2312.             const \$this = \$(this);
  2313.             const imageId = \$this.data(\"id\");
  2314.             const sejourId = \$this.data(\"sejour-id\");
  2315.             // Toggle favorite status
  2316.             const isFavorite = \$this.find(\"i\").hasClass(\"bi-heart-fill\");
  2317.             // Update the button appearance
  2318.             if (isFavorite) {
  2319.               \$this
  2320.                 .find(\"i\")
  2321.                 .removeClass(\"bi-heart-fill\")
  2322.                 .addClass(\"bi-heart\")
  2323.                 .css(\"color\", \"white\");
  2324.               \$this.attr(\"title\", \"Ajouter aux favoris\");
  2325.             } else {
  2326.               \$this
  2327.                 .find(\"i\")
  2328.                 .removeClass(\"bi-heart\")
  2329.                 .addClass(\"bi-heart-fill\")
  2330.                 .css(\"color\", \"#f56040\");
  2331.               \$this.attr(\"title\", \"Retirer des favoris\");
  2332.             }
  2333.             // Update the original heart icon in the gallery
  2334.             const originalHeartIcon = \$(
  2335.               `.heart-icon[data-id=\"\${imageId}\"]`
  2336.             ).find(\"i\");
  2337.             if (isFavorite) {
  2338.               originalHeartIcon
  2339.                 .removeClass(\"bi-heart-fill\")
  2340.                 .addClass(\"bi-heart\")
  2341.                 .css(\"color\", \"\");
  2342.             } else {
  2343.               originalHeartIcon
  2344.                 .removeClass(\"bi-heart\")
  2345.                 .addClass(\"bi-heart-fill\")
  2346.                 .css(\"color\", \"#f56040\");
  2347.             }
  2348.             // Make AJAX call to update favorite status in the backend using Parent routes
  2349.             \$.ajax({
  2350.               url: isFavorite ? \"/Parent/aSupprimerFav\" : \"/Parent/ajouterFav\",
  2351.               type: \"POST\",
  2352.               data: {
  2353.                 id: imageId,
  2354.                 idSejour: sejourId,
  2355.               },
  2356.               success: function (response) {
  2357.                 // Optional: Show a success message or handle response
  2358.                 console.log(\"Favorite status updated\", response);
  2359.               },
  2360.               error: function (error) {
  2361.                 console.error(\"Error updating favorite status\", error);
  2362.                 // Revert the icon change on error
  2363.                 if (isFavorite) {
  2364.                   \$this
  2365.                     .find(\"i\")
  2366.                     .removeClass(\"bi-heart\")
  2367.                     .addClass(\"bi-heart-fill\")
  2368.                     .css(\"color\", \"#f56040\");
  2369.                   originalHeartIcon
  2370.                     .removeClass(\"bi-heart\")
  2371.                     .addClass(\"bi-heart-fill\")
  2372.                     .css(\"color\", \"#f56040\");
  2373.                 } else {
  2374.                   \$this
  2375.                     .find(\"i\")
  2376.                     .removeClass(\"bi-heart-fill\")
  2377.                     .addClass(\"bi-heart\")
  2378.                     .css(\"color\", \"white\");
  2379.                   originalHeartIcon
  2380.                     .removeClass(\"bi-heart-fill\")
  2381.                     .addClass(\"bi-heart\")
  2382.                     .css(\"color\", \"\");
  2383.                 }
  2384.               },
  2385.             });
  2386.           });
  2387.       }
  2388.       function updateFavoriteButton() {
  2389.         // Get current image data from the current slide
  2390.         const currentSlide = \$.magnificPopup.instance.currItem.el;
  2391.         const photoZoom = currentSlide.closest(\".photo-zoom\");
  2392.         if (photoZoom.length) {
  2393.           const heartIcon = photoZoom.find(\".heart-icon\");
  2394.           const imageId = heartIcon.data(\"id\") || \"\";
  2395.           const sejourId = heartIcon.data(\"sejour-id\") || \"\";
  2396.           const imagePath = heartIcon.data(\"path\") || \"\";
  2397.           const imageDesc = heartIcon.data(\"description\") || \"\";
  2398.           const isFavorite = heartIcon.find(\"i\").hasClass(\"bi-heart-fill\");
  2399.           const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  2400.           const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  2401.           const favoriteTooltip = isFavorite
  2402.             ? \"Retirer des favoris\"
  2403.             : \"Ajouter aux favoris\";
  2404.           // Update the favorite button
  2405.           const \$favoriteBtn = \$(\".mfp-favorite .favorite-btn\");
  2406.           \$favoriteBtn.data(\"id\", imageId);
  2407.           \$favoriteBtn.data(\"sejour-id\", sejourId);
  2408.           \$favoriteBtn.data(\"path\", imagePath);
  2409.           \$favoriteBtn.data(\"description\", imageDesc);
  2410.           \$favoriteBtn.attr(\"title\", favoriteTooltip);
  2411.           \$favoriteBtn
  2412.             .find(\"i\")
  2413.             .removeClass(\"bi-heart bi-heart-fill\")
  2414.             .addClass(favoriteIconClass)
  2415.             .css(\"color\", favoriteIconColor);
  2416.         }
  2417.       }
  2418.       function updateZoomButtonState() {
  2419.         const zoomLevels = [1, 1.5, 2];
  2420.         const currentZoom = zoomLevels[zoomCounter];
  2421.         \$(\".zoom-in\").prop(\"disabled\", currentZoom === 2);
  2422.         \$(\".zoom-out\").prop(\"disabled\", currentZoom === 1);
  2423.       }
  2424.       function updateCounter() {
  2425.         const counterText = \$(\".mfp-counter\")
  2426.           .closest(\".mfp-content\")
  2427.           .find(\".mfp-counter\")
  2428.           .text();
  2429.         const matches = counterText.match(/(\\d+) of (\\d+)/);
  2430.         if (matches) {
  2431.           const currentIndex = matches[1];
  2432.           const totalImages = matches[2];
  2433.           \$(\".mfp-counter\").text(`\${currentIndex} of \${totalImages}`);
  2434.         }
  2435.       }
  2436.       // Add CSS for the favorite button and rounded image corners
  2437.       \$(\"<style>\")
  2438.         .prop(\"type\", \"text/css\")
  2439.         .html(
  2440.           `
  2441.       .mfp-favorite {
  2442.         position: absolute;
  2443.         top: 15px;
  2444.         left: 15px;
  2445.         z-index: 1046;
  2446.       }
  2447.       .favorite-btn {
  2448.         background: transparent;
  2449.         border: none;
  2450.         font-size: 24px;
  2451.         padding: 5px;
  2452.         cursor: pointer;
  2453.         outline: none;
  2454.       }
  2455.       .favorite-btn i {
  2456.         transition: all 0.3s ease;
  2457.       }
  2458.       .favorite-btn:hover i {
  2459.         transform: scale(1.2);
  2460.       }
  2461.       /* Rounded corners for zoomed images */
  2462.       .mfp-img {
  2463.         border-radius: 8px;
  2464.       }
  2465.       /* Make sure the container doesn't clip the rounded corners */
  2466.       .mfp-figure:after {
  2467.         border-radius: 8px;
  2468.       }
  2469.     `
  2470.         )
  2471.         .appendTo(\"head\");
  2472.     });
  2473.   </script>
  2474. <script>
  2475. document.addEventListener('DOMContentLoaded', function () {
  2476.   const openBtn = document.getElementById('openFavoritesBtn');
  2477.   const closeBtn = document.getElementById('closeSidebarBtn');
  2478.   const sidebar = document.getElementById('favoritesSidebar');
  2479.   const tbody = document.querySelector('#favoritesTable tbody');
  2480.   openBtn.addEventListener('click', async () => {
  2481.     try {
  2482.       const response = await fetch('/Parent/mes-favoris', {
  2483.         headers: {
  2484.           'Accept': 'application/json'
  2485.         }
  2486.       });
  2487.       const result = await response.json();
  2488.       if (!result.success || !Array.isArray(result.data)) {
  2489.         alert('Erreur lors du chargement des favoris.');
  2490.         return;
  2491.       }
  2492.       tbody.innerHTML = '';
  2493.       result.data.forEach((fav, index) => {
  2494.         const row = document.createElement('tr');
  2495.         row.innerHTML = `
  2496.           <td>\${index + 1}</td>
  2497.           <td><img src=\"\${fav.path}\" alt=\"favori\"></td>
  2498.           <td>\${fav.descreption || '—'}</td>
  2499.           <td>\${fav.created_at}</td>
  2500.         `;
  2501.         tbody.appendChild(row);
  2502.       });
  2503.       sidebar.classList.add('active');
  2504.     } catch (e) {
  2505.       console.error('Erreur réseau:', e);
  2506.       alert('Impossible de charger les favoris.');
  2507.     }
  2508.   });
  2509.   closeBtn.addEventListener('click', () => {
  2510.     sidebar.classList.remove('active');
  2511.   });
  2512. });
  2513. </script>
  2514.   <script>
  2515.         // Fonction pour vérifier et afficher l'alerte
  2516.         function checkFavorites() {
  2517.             if (favoriteCount >= 10) {
  2518.                 purchaseAlert.style.display = 'block'; // Affiche l'alerte
  2519.             } else {
  2520.                 purchaseAlert.style.display = 'none'; // Cache l'alerte si le nombre est réduit
  2521.             }
  2522.         }
  2523.     
  2524.         
  2525.         document.addEventListener('DOMContentLoaded', () => {
  2526.     const favoriteCount = ";
  2527.         // line 2121
  2528.         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.'2121$this->source); })()), "html"nulltrue);
  2529.         yield ";
  2530.     updateCardContent(favoriteCount);
  2531. });
  2532. function updateCardContent(favoriteCount) {
  2533.     const card = document.getElementById('dynamic-card');
  2534.     const cardContent = document.getElementById('dynamic-card-content');
  2535.     let produits = [];
  2536.     if (favoriteCount >= 20) {
  2537.         produits.push({
  2538.             titre: \"Album débloqué !\",
  2539.             bouton: \"Commander\",
  2540.             image: \"/images/produit/Album5sur5-3.jpg\",
  2541.             lien: \"";
  2542.         // line 2136
  2543.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("EditionAlbum");
  2544.         yield "\"
  2545.         });
  2546.     }
  2547.     if (favoriteCount >= 12) {
  2548.         produits.push({
  2549.             titre: \"Pochette débloquée !\",
  2550.             bouton: \"Commander\",
  2551.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  2552.             lien: \"";
  2553.         // line 2144
  2554.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  2555.         yield "\"
  2556.         });
  2557.     }
  2558.     if (favoriteCount >= 5) {
  2559.         produits.push({
  2560.             titre: \"Pack numérique débloqué !\",
  2561.             bouton: \"Commander\",
  2562.             image: \"/images/produit/photoNumerique.jpg\",
  2563.             lien: \"";
  2564.         // line 2152
  2565.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 15]);
  2566.         yield "\"
  2567.         });
  2568.     }
  2569. if (produits.length === 0) {
  2570.   cardContent.innerHTML = `
  2571.     <div style=\"position: relative; width: 100%; height: 140px; border-radius: 15px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.1);\">
  2572.       <div style=\"background-image: url('/images/produit/CoffretCadeau5sur5-2.jpg'); background-size: cover; background-position: center; width: 100%; height: 100%;\">
  2573.         <div style=\"position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; padding: 10px;\">
  2574.           <div style=\"
  2575.     margin-top: 35px;
  2576.     color: white;
  2577.     font-size: 15px;
  2578.     font-weight: bold;
  2579.     text-align: center;
  2580.     line-height: 1;
  2581.     text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);\">
  2582.             Ajoutez des favoris ❤️<br><span style=\"font-size: 16px; font-weight: normal;\">pour débloquer un souvenir à offrir 🎁</span>
  2583.           </div>
  2584.         </div>
  2585.       </div>
  2586.     </div>
  2587.   `;
  2588.         return;
  2589.     }
  2590.     cardContent.innerHTML = `
  2591.     <div class=\"splide\" id=\"dynamicSplide\">
  2592.       <div class=\"splide__track\">
  2593.         <ul class=\"splide__list\">
  2594.           \${produits.map(produit => `
  2595.             <li class=\"splide__slide\" style=\"position: relative;\">
  2596.               <img src=\"\${produit.image}\" alt=\"\${produit.titre}\" style=\"width: 100%; height: 150px; object-fit: cover; border-radius: 8px;\">
  2597.               <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;\">
  2598.                 <div style=\"font-weight: bold; font-size: 14px;\">\${produit.titre}</div>
  2599.                 <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}'\">
  2600.                   \${produit.bouton}
  2601.                 </button>
  2602.               </div>
  2603.             </li>
  2604.           `).join('')}
  2605.         </ul>
  2606.       </div>
  2607.     </div>
  2608.     `;
  2609.     // Monte le carrousel
  2610.     new Splide('#dynamicSplide', {
  2611.         type: 'loop',
  2612.         arrows: true,
  2613.         pagination: false,
  2614.         autoplay: true,
  2615.         interval: 4000,
  2616.         speed: 800,
  2617.     }).mount();
  2618. }
  2619.         function supprimerFavoris(\$id, \$idSejour) {
  2620.             // Vider l'élément coeur pour ce favori
  2621.             const coeurElement = \$('#coeur' + \$id);
  2622.             coeurElement.empty();
  2623.             // Ajout d'une animation sur le bouton favori
  2624.             const favoriteButton = document.querySelector('.fav-button');
  2625.             if (favoriteButton) {
  2626.                 favoriteButton.classList.add('active');
  2627.                 // Retirer l'animation après qu'elle soit jouée
  2628.                 setTimeout(() => {
  2629.                     favoriteButton.classList.remove('active');
  2630.                 }, 600); // La durée doit correspondre à celle de l'animation
  2631.             }
  2632.             // Mise à jour de l'icône coeur
  2633.             const clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  2634.             coeurElement.html(
  2635.                 `<i class=\"bi bi-heart \${clas}\" ></i>`
  2636.             );
  2637.             // Mettre à jour le compteur des favoris
  2638.             const likeCountLabel = document.getElementById('likeCount');
  2639.             const likeMesFavLabel = document.getElementById('mesFavCount');
  2640.             
  2641.             let newCount = 0;
  2642.             
  2643.             if (likeCountLabel) {
  2644.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  2645.                 newCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  2646.                 likeCountLabel.textContent = newCount;
  2647.             
  2648.                 // Mettre à jour la valeur dans l'input hidden
  2649.                 const nbFavCurrentInput = \$('#nbFavCurrent');
  2650.                 if (nbFavCurrentInput.length) {
  2651.                     nbFavCurrentInput.val(newCount);
  2652.                 }
  2653.             }
  2654.             
  2655.             // Synchroniser mesFavCount avec likeCount
  2656.             if (likeMesFavLabel) {
  2657.                 if (likeCountLabel) {
  2658.                     // Utiliser la valeur de likeCount pour synchroniser
  2659.                     likeMesFavLabel.textContent = newCount;
  2660.                 } else {
  2661.                     // Si likeCount n'existe pas, décrémenter directement mesFavCount
  2662.                     let currentFavCount = parseInt(likeMesFavLabel.textContent.trim(), 10) || 0;
  2663.                     newCount = Math.max(0, currentFavCount - 1);
  2664.                                          likeMesFavLabel.textContent = newCount;
  2665.                  }
  2666.              }
  2667.              
  2668.              // Mettre à jour l'alerte immédiatement
  2669.              setTimeout(() => {
  2670.                  const finalCount = getCurrentFavoriteCount();
  2671.                  if (typeof updatePurchaseAlert === 'function') {
  2672.                      updatePurchaseAlert(finalCount);
  2673.                  }
  2674.              }, 50);
  2675.             // Préparation des données pour l'Ajax
  2676.             const \$_data = { 'id': \$id, 'idSejour': \$idSejour };
  2677.             // Appel Ajax pour supprimer le favori
  2678.             \$.ajax({
  2679.                 type: \"POST\",
  2680.                 url: \"";
  2681.         // line 2276
  2682.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("Supprimer_fav");
  2683.         yield "\",
  2684.                 data: \$_data,
  2685.                 success: function () {
  2686.                     // Réactiver les icônes après succès
  2687.                     \$('.IconDelete').each(function () {
  2688.                         \$(this).css('pointer-events', '');
  2689.                     });
  2690.                     
  2691.                     // Mettre à jour l'alerte avec le nouveau nombre
  2692.                     const finalCount = getCurrentFavoriteCount();
  2693.                     if (typeof updatePurchaseAlert === 'function') {
  2694.                         updatePurchaseAlert(finalCount);
  2695.                     }
  2696.                 },
  2697.                 error: function (xhr, status, error) {
  2698.                     console.error('Erreur lors de la suppression du favori :', error);
  2699.                 }
  2700.             });
  2701.         }
  2702.         function AddFavoris(\$id, \$idSejour, \$urlimg, \$description) {
  2703.             // Update heart icon
  2704.             \$('#coeur' + \$id).empty();
  2705.             var clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  2706.             \$('#coeur' + \$id).html(\"<i class=\\\"bi bi-heart-fill favSelect \" + clas + \"\\\" )\\\"></i>\");
  2707.             
  2708.             // Update counters UNIQUEMENT
  2709.             const likeCountLabel = document.getElementById('likeCount');
  2710.             const likeMesFavLabel = document.getElementById('mesFavCount');
  2711.             
  2712.             if (likeCountLabel) {
  2713.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  2714.                 currentCount++;
  2715.                 likeCountLabel.textContent = currentCount;
  2716.                 
  2717.                 // Mettre à jour le compteur des favoris dans le titre
  2718.                 if (likeMesFavLabel) {
  2719.                     likeMesFavLabel.textContent = currentCount;
  2720.                 }
  2721.                 
  2722.                 // Mettre à jour l'input hidden
  2723.                 const nbFavCurrentInput = document.getElementById('nbFavCurrent');
  2724.                 if (nbFavCurrentInput) {
  2725.                     nbFavCurrentInput.value = currentCount;
  2726.                 }
  2727.             }
  2728.             
  2729.             // Update other counters
  2730.             var \$total = parseInt(\$(\"#totalLike\").html()) + 1;
  2731.             \$(\"#totalLike\").html(\$total);
  2732.             \$(\"#totalLikeTitle\").html(\$total);
  2733.             \$(\"#totalLikeMobile\").html(\$total);
  2734.             
  2735.             // Add favorite button animation
  2736.             const favoriteButton = document.querySelector('.fav-button');
  2737.             if (favoriteButton) {
  2738.                 favoriteButton.classList.add('active');
  2739.                 setTimeout(() => {
  2740.                     favoriteButton.classList.remove('active');
  2741.                 }, 600);
  2742.             }
  2743.             var \$data = { 'id': \$id, 'idSejour': \$idSejour };
  2744.             \$.ajax({
  2745.                 type: \"POST\",
  2746.                 url: \"";
  2747.         // line 2342
  2748.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("Ajouter_fav");
  2749.         yield "\",
  2750.                 data: \$data,
  2751.                 success: function () {
  2752.                     \$('.IconDelete').each(function () {
  2753.                         \$(this).css('pointer-events', '');
  2754.                     });
  2755.                     if (\$description === undefined) {
  2756.                         \$description = ''; // Set it to an empty string
  2757.                     }
  2758.                     \$('.rowMaselection').append(
  2759.                         '<div class=\"column\" id=\"column-' + \$id + '\">'+
  2760.                         '<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>'+
  2761.                         '<a class=\"photo-zoom\">'+
  2762.                         '<img data-idAtach=\"'+\$id+'\" id=\"'+\$idSejour+'\" src=\"'+\$urlimg+'\"></a>'+
  2763.                         (\$description ? '<h4 id=\"commint\" class=\"titleHeadPhoto\">'+\$description+'</h4>' : '')+ // Only add the <h4> if \$description is not empty
  2764.                         '</div>'
  2765.                     );
  2766.                     // Directly update nbLikes count in the header
  2767.                     var currentNbLikes = parseInt(\$('#favoris-link-Accueilpayment .nbrpanier').text());
  2768.                     var newNbLikes = currentNbLikes + 1;
  2769.                     \$('#favoris-link-Accueilpayment .nbrpanier').text(newNbLikes);
  2770.                     
  2771.                     // Mettre à jour l'alerte avec le nouveau nombre
  2772.                     const finalCount = getCurrentFavoriteCount();
  2773.                     if (typeof updatePurchaseAlert === 'function') {
  2774.                         updatePurchaseAlert(finalCount);
  2775.                     }
  2776.                 },
  2777.                 error: function (xhr, status, error) {
  2778.                     console.error('Error:', error);
  2779.                 }
  2780.             });
  2781.         }
  2782.         \$(document).on('click', '.bi-heart, .bi-heart-fill', function () {
  2783.         const heartIcon       = \$(this);
  2784.         const heartContainer  = heartIcon.closest('.heart-icon');
  2785.         // Extract data attributes
  2786.         const attachmentId    = heartContainer.data('id');
  2787.         const sejourId        = heartContainer.data('sejour-id');
  2788.         const path            = heartContainer.data('path');
  2789.         const description     = heartContainer.data('description');
  2790.         const isFavorite      = heartIcon.hasClass('bi-heart-fill');
  2791.         if (isFavorite) {
  2792.             // Remove from favorites
  2793.             supprimerFavoris(attachmentId, sejourId);
  2794.         } else {
  2795.             // Add to favorites
  2796.             AddFavoris(attachmentId, sejourId, path, description);
  2797.         }
  2798.         // Update UI components after the action (sans double comptage)
  2799.         setTimeout(function() {
  2800.             const likeCountLabel = document.getElementById('likeCount');
  2801.             
  2802.             if (likeCountLabel) {
  2803.                 const currentCount = parseInt(likeCountLabel.textContent, 10) || 0;
  2804.                 
  2805.                 // Update UI components seulement
  2806.                 updateCardContent(currentCount);
  2807.                 updateFavoritesSidebar();
  2808.                 \$(\"#close-favorites-btn\").click();
  2809.             }
  2810.         }, 50);
  2811.     });
  2812.         // Ajoutez les événements sur les icônes de cœur
  2813.         document.querySelectorAll('.IconDelete').forEach((icon) => {
  2814.             icon.addEventListener('click', (event) => {
  2815.                 const isFavorite = icon.classList.contains('bi-heart-fill');
  2816.                 if (isFavorite) {
  2817.                     removeFavorite();
  2818.                     icon.classList.remove('bi-heart-fill');
  2819.                     icon.classList.add('bi-heart');
  2820.                 } else {
  2821.                     addFavorite();
  2822.                     icon.classList.remove('bi-heart');
  2823.                     icon.classList.add('bi-heart-fill');
  2824.                 }
  2825.             });
  2826.         });
  2827.         // Vérifie l'état initial
  2828.         checkFavorites();
  2829.         
  2830.         
  2831.         // Appeler la synchronisation au chargement de la page
  2832.         \$(document).ready(function() {
  2833.             setTimeout(syncFavoriteCounters, 500); // Petit délai pour s'assurer que le DOM est prêt
  2834.         });
  2835.   </script>
  2836.   <!-- Initialisation -->
  2837.   <script>
  2838.     AOS.init({
  2839.       duration: 800, // Duration of animations in milliseconds
  2840.       easing: \"ease-in-out\", // Animation timing function
  2841.     });
  2842.     document.addEventListener(\"DOMContentLoaded\", function () {
  2843.       const dateCards = document.querySelectorAll(\".date-card\");
  2844.       const sections = document.querySelectorAll(\".collapse\");
  2845.       dateCards.forEach((card) => {
  2846.         card.addEventListener(\"click\", function () {
  2847.           // Supprimer les classes actives des autres cartes et sections
  2848.           dateCards.forEach((c) => c.classList.remove(\"active\"));
  2849.           sections.forEach((s) => s.classList.remove(\"show\"));
  2850.           // Ajouter la classe active à la carte cliquée
  2851.           this.classList.add(\"active\");
  2852.           // Récupérer la cible et afficher la bonne section
  2853.           const targetId = this.getAttribute(\"data-bs-target\");
  2854.           const targetSection = document.querySelector(targetId);
  2855.           if (targetSection) {
  2856.             targetSection.classList.add(\"show\");
  2857.           }
  2858.         });
  2859.       });
  2860.     });
  2861.     document.addEventListener(\"DOMContentLoaded\", function () {
  2862.       // Initialisation du carrousel Splide
  2863.       var splide = new Splide(\"#imageSlider\", {
  2864.         type: \"loop\",
  2865.         perPage: 1,
  2866.         autoplay: true,
  2867.         interval: 6000,
  2868.         pauseOnHover: false,
  2869.         pauseOnFocus: false,
  2870.         pagination: false, // Désactive la pagination
  2871.         arrows: false,
  2872.       });
  2873.       splide.mount();
  2874.       // Fonction pour faire défiler automatiquement vers la section suivante avec un ajustement personnalisé de la hauteur
  2875.       function scrollToNextSection() {
  2876.         const targetSection = document.getElementById(\"scrollTarget\");
  2877.         if (targetSection) {
  2878.           const targetPosition =
  2879.             targetSection.getBoundingClientRect().top + window.scrollY; // Position de la section
  2880.           const adjustedPosition = targetPosition - 50; // Réduit la hauteur du scroll de 150px (ajustez selon vos besoins)
  2881.           // Scroll vers la position ajustée
  2882.           window.scrollTo({
  2883.             top: adjustedPosition,
  2884.             behavior: \"smooth\",
  2885.           });
  2886.         }
  2887.       }
  2888.       // Démarrer le timer pour le scroll automatique après 10 secondes
  2889.       setTimeout(scrollToNextSection, 5000); // 10 secondes
  2890.     });
  2891.   </script>
  2892.   <script>
  2893.         document.addEventListener('DOMContentLoaded', function () {
  2894.             var myModal = new bootstrap.Modal(document.getElementById('PubProd'));
  2895.             myModal.show();
  2896.         });
  2897.         // Function to close the modal
  2898.     function closeModal() {
  2899.         var myModal = bootstrap.Modal.getInstance(document.getElementById('PubProd'));
  2900.         if (myModal) {
  2901.             myModal.hide();
  2902.         }
  2903.     }
  2904.     const favoriteButton = document.querySelector('.fav-button');
  2905.     favoriteButton.addEventListener('click', () => {
  2906.         // Ajouter la classe 'active' pour déclencher l'éclat
  2907.         favoriteButton.classList.add('active');
  2908.         // Retirer l'animation après qu'elle soit jouée
  2909.         setTimeout(() => {
  2910.             favoriteButton.classList.remove('active');
  2911.         }, 600); // La durée doit correspondre à celle de l'animation
  2912.     });
  2913.     
  2914.     //const HeartAddButton = document.querySelector('.IconDelete');
  2915.     \$(\".IconDelete\").on('click', () => {
  2916.         // Ajouter la classe 'active' pour déclencher l'éclat
  2917.         favoriteButton.classList.add('active');
  2918.         // Retirer l'animation après qu'elle soit jouée
  2919.         setTimeout(() => {
  2920.             favoriteButton.classList.remove('active');
  2921.         }, 600); // La durée doit correspondre à celle de l'animation
  2922.     });
  2923.     \$(document).ready(function() {
  2924.         // Attach click event to collapse triggers
  2925.         const lastCard = \$('.date-card.modern-card.active');
  2926.         const lastTargetId = lastCard.attr('data-bs-target');
  2927.         if (lastTargetId) {
  2928.             \$(lastTargetId).collapse('show'); // Expand the last collapse section
  2929.             LoadImagesCloud(\$(lastTargetId)); // Load images for the last day
  2930.         }
  2931.         \$('[data-bs-toggle=\"collapse\"]').on('click', function() {
  2932.             var targetId = \$(this).attr('data-bs-target'); // Get the target ID
  2933.             \$('.date-card.modern-card').removeClass('active'); // Remove 'active' class from all cards
  2934.             \$(this).addClass('active'); // Add 'active' class to the clicked card
  2935.             LoadImagesCloud(\$(targetId)); // Ensure this function works as expected
  2936.                // Hide all other collapses except the one clicked
  2937.                \$('[data-bs-target]').each(function() {
  2938.                 var currentTargetId = \$(this).attr('data-bs-target');
  2939.                 // If the current collapse is not the one clicked, hide it
  2940.                 if (currentTargetId !== targetId) {
  2941.                     \$(currentTargetId).collapse('hide');
  2942.                     //\$('[data-bs-toggle=\"collapse\"]').removeClass('active'); // Remove active class from all cards
  2943.                     //Modifier leurs style en non active aussi
  2944.                 }
  2945.             });
  2946.         });
  2947.     });
  2948.     function rotateIcone(iconId) {
  2949.         // Use the icon ID to target the specific element
  2950.         var icon = \$('#' + iconId);
  2951.         // Toggle the rotate-right class to apply rotation
  2952.         if (icon.hasClass('rotate-right')) {
  2953.             icon.removeClass('rotate-right'); // Remove rotation class
  2954.         } else {
  2955.             icon.addClass('rotate-right'); // Add rotation class
  2956.         }
  2957.     }
  2958.             \$(document).ready(function () {
  2959.                 \$total1 = parseInt(\$(\"#esphoto\").find('strong').html().replace('(', '').replace(')', ''));
  2960.                 \$('[data-bs-toggle=\"tooltip\"]').tooltip();
  2961.                 ";
  2962.         // line 2601
  2963.         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.'2601$this->source); })()), "session", [], "any"falsefalsefalse2601), "get", ["paymentmoniteco"], "method"falsefalsefalse2601)) && $tmp instanceof Markup ? (string) $tmp $tmp)) {
  2964.             // line 2602
  2965.             yield "                ";
  2966.             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.'2602$this->source); })()), "session", [], "any"falsefalsefalse2602), "get", ["paymentmoniteco"], "method"falsefalsefalse2602) == "succses")) {
  2967.                 // line 2603
  2968.                 yield "
  2969.                 Swal.fire({
  2970.                     icon: 'success',
  2971.                     title: ' succès ',
  2972.                     text: 'votre commande est validée'
  2973.                 });
  2974.                 ";
  2975.             }
  2976.             // line 2613
  2977.             yield "                ";
  2978.         }
  2979.         // line 2614
  2980.         yield "
  2981.                 if (\$total1 > 0) {
  2982.                     \$('.iconeFleche').first().click();
  2983.                     //  \$([document.documentElement, document.body]).animate({
  2984.                     //  scrollTop: \$('.iconeFleche').last().offset().top
  2985.                     //  }, );
  2986.                 }
  2987.                 else {
  2988.                     \$(window).scrollTop(0);
  2989.                 }
  2990.                 var slider = \$('.responsive').slick({
  2991.                     infinite: true,
  2992.                     slidesToShow: 1,
  2993.                     slidesToScroll: 1,
  2994.                     autoplay: true,
  2995.                     autoplaySpeed: 4000,
  2996.                     pauseOnFocus: false,
  2997.                     pauseOnHover: false,
  2998.                     draggable: false,
  2999.                     fade: true
  3000.                 });
  3001.                 \$('.responsive').css('display', 'block');
  3002.                 \$('.namePRD').css('display', 'block');
  3003.                 var currSlide = 0;
  3004.                 var nextSlide = 0;
  3005.                 slider.on('afterChange', function (event, slick, currentSlide) {
  3006.                     console.log(typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\");
  3007.                     if (typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\") {
  3008.                         setTimeout(function () {
  3009.                             \$('.slick-active .imgproduit1').removeClass('animated fadeIn');
  3010.                             \$('.slick-active .imgproduit1').addClass('animated fadeOut');
  3011.                             \$('.slick-active .imgproduit1').css('display', 'none');
  3012.                             \$('.slick-active .imgproduit2').css('display', 'block');
  3013.                             \$('.slick-active .imgproduit2').removeClass('animated fadeOut');
  3014.                             \$('.slick-active .imgproduit2').addClass('animated fadeIn');
  3015.                         }, 2000);
  3016.                     }
  3017.                 });
  3018.                 slider.on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  3019.                     currSlide = currentSlide;
  3020.                     \$('.imgproduit2').each(function () {
  3021.                         \$(this).removeClass('animated fadeIn');
  3022.                         \$(this).addClass('animated fadeOut');
  3023.                         \$(this).css('display', 'none');
  3024.                     });
  3025.                     \$('.imgproduit1').each(function () {
  3026.                         \$(this).css('display', 'block');
  3027.                         \$(this).removeClass('animated fadeOut');
  3028.                         \$(this).addClass('animated fadeIn');
  3029.                     });
  3030.                 });
  3031.                 \$('.columnPub').each(function () {
  3032.                     \$(this).slick({
  3033.                         infinite: true,
  3034.                         speed: 50,
  3035.                         fade: true,
  3036.                         slidesToShow: 1,
  3037.                         slidesToScroll: 1,
  3038.                         autoplay: true,
  3039.                         pauseOnFocus: false,
  3040.                         pauseOnHover: false,
  3041.                         draggable: false
  3042.                     });
  3043.                     \$(this).css('display', 'block');
  3044.                 });
  3045.                 \$(\"#offrePack\").click();
  3046.                 ";
  3047.         // line 2688
  3048.         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.'2688$this->source); })()), "user", [], "any"falsefalsefalse2688), "showpubprod", [], "any"falsefalsefalse2688) != "false")) {
  3049.             // line 2689
  3050.             yield "                \$('#btnPubProd').click();
  3051.                 \$('.modal-backdrop').css('background-color', 'rgba(0, 0, 0, 0.2)');
  3052.                 ";
  3053.         }
  3054.         // line 2692
  3055.         yield "            });
  3056.             \$(\"#closeImage\").click(function () {
  3057.                 \$('#myModalImage').css('display', \"none\");
  3058.             });
  3059.             \$.ajax({
  3060.                 type: \"POST\",
  3061.                 url: \"";
  3062.         // line 2698
  3063.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("delateSession_parent");
  3064.         yield "\",
  3065.                 success: function () { }
  3066.             });
  3067.             function afficheDiv(elem) {
  3068.                 \$('.nav-link').each(function () {
  3069.                     \$(this).removeClass('active');
  3070.                 });
  3071.                 elem.addClass('active');
  3072.                 if (elem.attr('id') === \"esphoto\" || elem.attr('id') === \"esphotoMobile\") {
  3073.                     \$(\"#espacphoto\").show();
  3074.                     \$(\"#espacemessage\").hide();
  3075.                     \$(\"#espaceMa_selection\").hide();
  3076.                     pageMenu = 'MonSejour'
  3077.                     \$(this).addClass('active');
  3078.                    \$('#imageActifphoto').css('display', 'block');
  3079.                      \$('#imagenoActifphoto').css('display', 'none');
  3080.                    \$('#VocalActivee').css('display', 'none');
  3081.                      \$('#noActifVocal').css('display', 'block');
  3082.                 }
  3083.                 if (elem.attr('id') === \"esmessage\" || elem.attr('id') === \"esmessageMobile\") {
  3084.                     \$(\"#espacphoto\").hide();
  3085.                     \$(\"#espaceMa_selection\").hide();
  3086.                     \$(\"#espacemessage\").show();
  3087.                     pageMenu = 'BoiteVocale'
  3088.                     \$(\"#espaceMa_selection\").hide();
  3089.                     \$(this).addClass('active');
  3090.                   \$('#imageActifphoto').css('display', 'none');
  3091.                      \$('#imagenoActifphoto').css('display', 'block');
  3092.                    \$('#VocalActivee').css('display', 'block');
  3093.                      \$('#noActifVocal').css('display', 'none');
  3094.                 }
  3095.                 if (elem.attr('id') === \"esselection\" || elem.attr('id') === \"esselectionMobile\") {
  3096.                     \$(\"#espacphoto\").hide();
  3097.                     \$(\"#espacemessage\").hide();
  3098.                     \$(\"#espaceMa_selection\").show();
  3099.                     \$(homeNavmob).removeClass('bi bi-house-door-fill');
  3100.                     \$(homeNavmob).addClass('bi bi-house-door');
  3101.                     \$(micromob).removeClass('bi bi-mic-fill');
  3102.                     \$(micromob).addClass('bi bi-mic');
  3103.                     \$(selecNavmob).removeClass('bi bi-heart');
  3104.                     \$(selecNavmob).addClass('bi bi-heart-fill');
  3105.                 }
  3106.             }
  3107.             function LoadImagesCloud(\$element) {
  3108.                 \$element.find('.photo-zoom img').each(function (\$this) {
  3109.                     if (\$(this).attr('data-src') != \$(this).attr('src')) {
  3110.                         \$(this).attr('src', \$(this).attr('data-src'));
  3111.                     }
  3112.                 });
  3113.             }
  3114.       function afficheDivFooterMobile(elem) {
  3115.              if(elem =='esphotoMobile') {
  3116.                    \$(\"#espacphoto\").show();
  3117.                     \$(\"#espacemessage\").hide();
  3118.                     \$(\"#espaceMa_selection\").hide();
  3119.                     \$(\"#storevide\").hide();
  3120.                     \$(\"#storefull\").show();
  3121.                     \$(\"#fullphoto\").show();
  3122.                     \$(\"#videphoto\").hide()
  3123.                     \$(\"#vocalfull\").hide();
  3124.                     \$(\"#vocalvide\").show();
  3125.                 }
  3126.                 if (elem === \"esmessageMobile\" ) {
  3127.                     \$(\"#espacphoto\").hide();
  3128.                     \$(\"#espacemessage\").show();
  3129.                     \$(\"#espaceMa_selection\").hide();
  3130.                     \$(\"#storefull\").hide();
  3131.                     \$(\"#storevide\").show();
  3132.                     \$(\"#fullphoto\").hide();
  3133.                     \$(\"#videphoto\").show()
  3134.                     \$(\"#vocalfull\").show();
  3135.                     \$(\"#vocalvide\").hide();
  3136.                 }
  3137.             }
  3138.             function permutation(elem) {
  3139.                 \$(\".IconImag\").each(function () {
  3140.                     \$(this).removeClass('active');
  3141.                 });
  3142.                 elem.addClass(\"active\");
  3143.             }
  3144.             function per(elem) {
  3145.                 \$(\".list-group-item \").each(function () {
  3146.                     \$(this).removeClass('show');
  3147.                 });
  3148.                 elem.addClass(\"active\");
  3149.                 \$(\"#iconeFleche\").addClass('active');
  3150.             }
  3151.            function setidattach(id) {
  3152.                 \$(\"#idattachipmut\").val(id)
  3153.             }
  3154.             var ParentAjouterALL_fav = \"";
  3155.         // line 2809
  3156.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentAjouterALL_fav");
  3157.         yield "\";
  3158.             function AllFavoris(\$idSejour) {
  3159.                 \$('#SelectALL').html('Désélectionner tout');
  3160.                 \$('#SelectALL').css('pointer-events', 'none');
  3161.                 \$('#SelectALL').css('opacity', '0.5');
  3162.                 \$('#SelectALL').css('cursor', 'no-drop');
  3163.                 \$('#SelectALL1').html('Désélectionner tout');
  3164.                 \$('#SelectALL1').css('pointer-events', 'none');
  3165.                 \$('#SelectALL1').css('opacity', '0.5');
  3166.                 \$('#SelectALL1').css('cursor', 'no-drop');
  3167.                 \$data = { 'idSejour': \$idSejour }
  3168.                 \$.ajax({
  3169.                     type: \"POST\",
  3170.                     url: \"";
  3171.         // line 2822
  3172.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentAjouterALL_fav");
  3173.         yield "\",
  3174.                     data: \$data,
  3175.                     success: function () {
  3176.                         location.reload();
  3177.                     }
  3178.                 });
  3179.             }
  3180.             function RemoveAllFavoris(\$idSejour) {
  3181.                 \$('#SelectALL').html('Sélectionner tout');
  3182.                 \$('#SelectALL').css('pointer-events', 'none');
  3183.                 \$('#SelectALL').css('opacity', '0.5');
  3184.                 \$('#SelectALL').css('cursor', 'no-drop');
  3185.                 \$('#SelectALL1').html('Sélectionner tout');
  3186.                 \$('#SelectALL1').css('pointer-events', 'none');
  3187.                 \$('#SelectALL1').css('opacity', '0.5');
  3188.                 \$('#SelectALL1').css('cursor', 'no-drop');
  3189.                 \$data = { 'idSejour': \$idSejour }
  3190.                 \$.ajax({
  3191.                     type: \"POST\",
  3192.                     url: \"";
  3193.         // line 2842
  3194.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("ParentSupprimer_ALLfav");
  3195.         yield "\",
  3196.                     data: \$data,
  3197.                     success: function () {
  3198.                         location.reload();
  3199.                     }
  3200.                 });
  3201.             }
  3202.             // Get the elements with class=\"column\"
  3203.             var elements = document.getElementsByClassName(\"column\");
  3204.             // Declare a \"loop\" variable
  3205.             var i;
  3206.             // Full-width images
  3207.             function Four() {
  3208.                 for (i = 0; i < elements.length; i++) {
  3209.                     elements[i].style.flex = \"0 0 25%\";
  3210.                 }
  3211.                 \$('.IconDelete').attr('class', 'IconDelete ');
  3212.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  3213.                 \$('.localistaion').css('visibility', 'visible');
  3214.                 \$('.localistaion').attr('class', 'localistaion');
  3215.                 \$('.legend').css('visibility', 'visible');
  3216.                 \$('.columnPub').each(function () {
  3217.                     \$(this).css('max-width', '25%');
  3218.                     \$(this).find('.slick-list').removeClass('miniature');
  3219.                     \$(this).find('.single_service').removeClass('miniature');
  3220.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  3221.                 });
  3222.             }
  3223.             // Two images side by side
  3224.             function six() {
  3225.                 for (i = 0; i < elements.length; i++) {
  3226.                     elements[i].style.flex = \"0 0 15%\";
  3227.                 }
  3228.                 \$('.column').css('padding', '0px 10px 0px 0px');
  3229.                 \$('.localistaion').attr('class', 'localistaion localistaionsix');
  3230.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletesix');
  3231.                 \$('.legend').css('visibility', 'visible');
  3232.                 \$('.photo-zoom ').attr('class', 'photo-zoom heightimg');
  3233.                 \$('.columnPub').each(function () {
  3234.                     \$(this).css('max-width', '15%');
  3235.                     \$(this).find('.slick-list').addClass('miniature');
  3236.                     \$(this).find('.single_service').addClass('miniature');
  3237.                     \$(this).find('.bottomdivpub').addClass('miniature');
  3238.                 });
  3239.             }
  3240.             // Four images side by side
  3241.             function two() {
  3242.                 for (i = 0; i < elements.length; i++) {
  3243.                     elements[i].style.flex = \"0 0 40%\";
  3244.                 }
  3245.                 \$('.column').css('padding', '14px 10px');
  3246.                 \$('.column').css('max-width', '40%');
  3247.                 \$('.localistaion').css('visibility', 'visible');
  3248.                 \$('.legend').css('visibility', 'visible');
  3249.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  3250.                 \$('.localistaion').attr('class', 'localistaion localistaiontwo');
  3251.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletetwo');
  3252.                 \$('.legend').attr('class', 'legend legendtwo');
  3253.                 \$('.columnPub').each(function () {
  3254.                     \$(this).css('max-width', '40%');
  3255.                     \$(this).find('.slick-list').removeClass('miniature');
  3256.                     \$(this).find('.single_service').removeClass('miniature');
  3257.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  3258.                 });
  3259.             }
  3260.             function hidePopPub() {
  3261.                 \$('.modal-backdrop').css('background-color', 'rgb(0, 0, 0)');
  3262.             }
  3263.             function changeHref(elem, newhref) {
  3264.                 \$(elem).parent().attr('href', newhref);
  3265.             }
  3266.             function VerifNbLikes(nblikes) {
  3267.                 \$('#allerAlaBoutique').click();
  3268.             }
  3269.     function handleMenuClick(menuId, pageMenu) {
  3270.         // Reset all icons
  3271.         document.getElementById('imagenoActifphoto').style.display = 'block';
  3272.         document.getElementById('imageActifphoto').style.display = 'none';
  3273.         document.getElementById('nofavorisVocal').style.display = 'block';
  3274.         document.getElementById('favorisActive').style.display = 'none';
  3275.         document.getElementById('noActifVocal').style.display = 'block';
  3276.         document.getElementById('VocalActivee').style.display = 'none';
  3277.         // Set selected icon
  3278.         if (menuId === 'photo') {
  3279.             document.getElementById('imagenoActifphoto').style.display = 'none';
  3280.             document.getElementById('imageActifphoto').style.display = 'block';
  3281.         } else if (menuId === 'selection') {
  3282.             document.getElementById('nofavorisVocal').style.display = 'none';
  3283.             document.getElementById('favorisActive').style.display = 'block';
  3284.         } else if (menuId === 'message') {
  3285.             document.getElementById('noActifVocal').style.display = 'none';
  3286.             document.getElementById('VocalActivee').style.display = 'block';
  3287.         }
  3288.         // Handle any other necessary logic
  3289.         \$('#list-tab-photo').removeClass('show');
  3290.         \$('#list-tab-message').removeClass('show');
  3291.         afficheDiv(\$(`#\${menuId}`));
  3292.     }
  3293.   </script>
  3294.   <script>
  3295.     \$(document).ready(function () {
  3296.       \$(\"#PubProd\").on(\"hidden.bs.modal\", function () {
  3297.         \$(document).trigger(\"modalClosed\");
  3298.       });
  3299.     });
  3300.   </script>
  3301.   <script>
  3302.     \$(document).ready(function () {
  3303.       \$(\"#noShow\").on(\"change\", function () {
  3304.         if (\$(this).is(\":checked\")) {
  3305.           \$.ajax({
  3306.             url: \"/Parent/showpub\",
  3307.             type: \"POST\",
  3308.             dataType: \"json\",
  3309.             success: function (response) {
  3310.               if (response.status === \"success\") {
  3311.                 console.log(\"User showpubprod updated successfully.\");
  3312.               } else {
  3313.                 console.log(\"Error:\", response.message);
  3314.               }
  3315.             },
  3316.             error: function (xhr, status, error) {
  3317.               console.log(\"AJAX Error:\", error);
  3318.             },
  3319.           });
  3320.         }
  3321.       });
  3322.     });
  3323.   </script>
  3324. </div>
  3325. <!-- Script pour la sidebar des favoris -->
  3326. <script>
  3327.   \$(document).ready(function() {
  3328.     // Ouvrir la sidebar
  3329.     \$(\"#openFavoritesSidebar\").click(function() {
  3330.       \$(\".favorites-sidebar\").addClass(\"open\");
  3331.       loadFavorites();
  3332.     });
  3333.     
  3334.     // Fermer la sidebar
  3335.     \$(\".favorites-close\").click(function() {
  3336.       \$(\".favorites-sidebar\").removeClass(\"open\");
  3337.     });
  3338.     
  3339.     // Charger les favoris
  3340.     function loadFavorites() {
  3341.       \$.ajax({
  3342.         url: \"/Parent/mes-favoris\",
  3343.         type: \"GET\",
  3344.         dataType: \"json\",
  3345.         beforeSend: function() {
  3346.           \$(\"#favorites-grid\").html(\"<div style='text-align:center'>Chargement...</div>\");
  3347.         },
  3348.         success: function(data) {
  3349.           \$(\"#favorites-grid\").empty();
  3350.           
  3351.           if (data.data && data.data.length > 0) {
  3352.             \$(\"#favorites-empty-state\").hide();
  3353.             
  3354.             \$.each(data.data, function(i, fav) {
  3355.               var item = \$(\"<div class='favorite-item'></div>\");
  3356.               var img = \$(\"<img>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  3357.               var overlay = \$(\"<div class='favorite-overlay'></div>\");
  3358.         
  3359.               
  3360.               btn.click(function(e) {
  3361.                 e.preventDefault();
  3362.                 e.stopPropagation();
  3363.                 removeFavorite(fav.id);
  3364.               });
  3365.               
  3366.               overlay.append(btn);
  3367.               item.append(img).append(overlay);
  3368.               \$(\"#favorites-grid\").append(item);
  3369.             });
  3370.             
  3371.             \$(\"#favorites-counter\").text(data.data.length);
  3372.             var percentage = (data.data.length / 10) * 100;
  3373.             \$(\"#favorites-progress\").css(\"width\", percentage + \"%\");
  3374.             
  3375.           } else {
  3376.             \$(\"#favorites-empty-state\").show();
  3377.             \$(\"#favorites-counter\").text(\"0\");
  3378.             \$(\"#favorites-progress\").css(\"width\", \"0%\");
  3379.           }
  3380.         },
  3381.         error: function() {
  3382.           \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center'>Erreur de chargement</div>\");
  3383.         }
  3384.       });
  3385.     }
  3386.     
  3387.     // Supprimer un favori
  3388.     function removeFavorite(id) {
  3389.       \$.ajax({
  3390.         url: \"/Parent/remove-favorite/\" + id,
  3391.         type: \"POST\",
  3392.         success: function() {
  3393.           loadFavorites();
  3394.           
  3395.           // Mettre à jour le compteur global
  3396.           var count = parseInt(\$(\"#likeCount\").text());
  3397.           if (!isNaN(count)) {
  3398.             \$(\"#likeCount\").text(count - 1);
  3399.           }
  3400.           
  3401.           var countFav = parseInt(\$(\"#mesFavCount\").text());
  3402.           if (!isNaN(countFav)) {
  3403.             \$(\"#mesFavCount\").text(countFav - 1);
  3404.           }
  3405.         },
  3406.         error: function() {
  3407.           alert(\"Erreur lors de la suppression du favori\");
  3408.         }
  3409.       });
  3410.     }
  3411.   });
  3412. </script>
  3413. <!-- Script pour la sidebar des favoris -->
  3414. <script>
  3415. \$(document).ready(function() {
  3416.     // Fonctions pour ouvrir/fermer la sidebar
  3417.     \$(\"#openFavoritesSidebar\").click(function() {
  3418.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  3419.         loadFavorites();
  3420.     });
  3421.     
  3422.     \$(\"#close-favorites-btn\").click(function() {
  3423.         \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  3424.     });
  3425.     
  3426.     // Fermer en cliquant en dehors
  3427.     \$(document).click(function(event) {
  3428.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  3429.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  3430.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  3431.             \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  3432.         }
  3433.     });
  3434.     
  3435.    // Variables globales
  3436. let selectedFavorites = [];
  3437. let allFavorites = [];
  3438. let coverPhotoId = null; // ID de la photo de couverture
  3439. // Fonction pour mettre à jour la sidebar
  3440. function loadFavorites() {
  3441.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  3442.     
  3443.     \$.ajax({
  3444.         url: \"/Parent/mes-favoris\",
  3445.         type: \"GET\",
  3446.         dataType: \"json\",
  3447.         success: function(data) {
  3448.             \$(\"#favorites-grid\").empty();
  3449.             allFavorites = data.data || [];
  3450.             
  3451.             if (allFavorites.length > 0) {
  3452.                 \$(\"#favorites-empty-state\").hide();
  3453.                 
  3454.                 // Ajouter l'option de photo de couverture au-dessus de la grille
  3455.                 if (!\$(\"#cover-photo-section\").length) {
  3456.                     const coverSection = \$(`
  3457.                         <div id=\"cover-photo-section\" style=\"margin-bottom:15px;\">
  3458.                             <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;\">
  3459.                                 <h4 style=\"margin:0;font-size:15px;color:#333;\">Photo de couverture</h4>
  3460.                                 <span style=\"font-size:12px;color:#777;\">Pour la personnalisation des produits</span>
  3461.                             </div>
  3462.                             <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;\">
  3463.                                 <div id=\"cover-photo-placeholder\" style=\"text-align:center;padding:15px;color:#777;\">
  3464.                                     <i class=\"bi bi-image\" style=\"font-size:24px;display:block;margin-bottom:8px;\"></i>
  3465.                                     <p style=\"margin:0;font-size:13px;\">Sélectionnez une photo comme couverture</p>
  3466.                                 </div>
  3467.                                 <div id=\"cover-photo-preview\" style=\"display:none;width:100%;height:100%;position:relative;\">
  3468.                                     <img src=\"\" style=\"width:100%;height:100%;object-fit:cover;\" />
  3469.                                     <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;\">
  3470.                                         <i class=\"bi bi-x\"></i>
  3471.                                     </button>
  3472.                                 </div>
  3473.                             </div>
  3474.                         </div>
  3475.                     `);
  3476.                     
  3477.                     \$(\"#photos-content\").prepend(coverSection);
  3478.                     
  3479.                     // Événement pour retirer la photo de couverture
  3480.                     \$(\"#remove-cover-photo\").click(function(e) {
  3481.                         e.stopPropagation();
  3482.                         setCoverPhoto(null);
  3483.                     });
  3484.                 }
  3485.                 
  3486.                 // Mettre à jour l'affichage de la photo de couverture
  3487.                 updateCoverPhotoDisplay();
  3488.                 
  3489.                 // Générer la grille de photos
  3490.                 \$.each(allFavorites, function(i, fav) {
  3491.                     var isSelected = selectedFavorites.includes(fav.id);
  3492.                     var isCoverPhoto = (coverPhotoId === fav.id);
  3493.                     
  3494.                     // Conteneur principal avec styles conditionnels
  3495.                     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>\");
  3496.                     
  3497.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  3498.                     
  3499.                     // Badge de sélection
  3500.                     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>\");
  3501.                     
  3502.                     // Badge de photo de couverture
  3503.                     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>\");
  3504.                     
  3505.                     // Overlay simple pour effet au survol
  3506.                     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>\");
  3507.                     
  3508.                     // Actions sur hover
  3509.                     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>\");
  3510.                     
  3511.                     // Bouton pour définir comme photo de couverture
  3512.                     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>\");
  3513.                     
  3514.                     setCoverBtn.click(function(e) {
  3515.                         e.stopPropagation();
  3516.                         if (isCoverPhoto) {
  3517.                             setCoverPhoto(null);
  3518.                         } else {
  3519.                             setCoverPhoto(fav.id);
  3520.                         }
  3521.                     });
  3522.                     
  3523.                     actionsOverlay.append(setCoverBtn);
  3524.                     
  3525.                     // Ajouter effet de survol
  3526.                     item.hover(
  3527.                         function() { 
  3528.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"1\");
  3529.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"1\");
  3530.                         },
  3531.                         function() { 
  3532.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"0\");
  3533.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"0\");
  3534.                         }
  3535.                     );
  3536.                     
  3537.                     // Gérer le clic pour la sélection
  3538.                     item.click(function(e) {
  3539.                         e.stopPropagation();
  3540.                         toggleSelection(\$(this).data('id'));
  3541.                     });
  3542.                     
  3543.                     item.append(img).append(hoverOverlay).append(selectionBadge).append(coverBadge).append(actionsOverlay);
  3544.                     
  3545.                     // Ajouter explicitement une classe pour le style
  3546.                     item.addClass(\"no-trash-button\");
  3547.                     
  3548.                     \$(\"#favorites-grid\").append(item);
  3549.                 });
  3550.                 
  3551.                 // Supprimer tout bouton de suppression qui pourrait être ajouté dynamiquement
  3552.                 setTimeout(function() {
  3553.                     \$(\".favorite-item .remove-favorite, .favorite-item button:has(.bi-trash), .favorite-overlay button\").remove();
  3554.                 }, 100);
  3555.                 
  3556.                 \$(\"#favorites-counter\").text(allFavorites.length);
  3557.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  3558.                 updateProductsView();
  3559.                 
  3560.             } else {
  3561.                 \$(\"#favorites-empty-state\").show();
  3562.                 \$(\"#favorites-counter\").text(\"0\");
  3563.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  3564.                 \$(\"#selection-count\").text(\"0\");
  3565.                 updateProductsView();
  3566.             }
  3567.         },
  3568.         error: function() {
  3569.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  3570.         }
  3571.     });
  3572. }
  3573. // Fonction pour définir la photo de couverture
  3574. function setCoverPhoto(id) {
  3575.     coverPhotoId = id;
  3576.     
  3577.     // Mettre à jour l'affichage
  3578.     updateCoverPhotoDisplay();
  3579.     
  3580.     // Mettre à jour le style des photos dans la grille
  3581.     \$(\".favorite-item\").each(function() {
  3582.         const itemId = \$(this).data('id');
  3583.         const isSelected = selectedFavorites.includes(itemId);
  3584.         const isCover = (itemId === coverPhotoId);
  3585.         
  3586.         // Mettre à jour la bordure
  3587.         \$(this).css(\"border\", \"3px solid \" + (isSelected ? \"#F56040\" : (isCover ? \"#4CAF50\" : \"transparent\")));
  3588.         
  3589.         // Mettre à jour le badge de couverture
  3590.         \$(this).find(\".cover-badge\").css(\"display\", isCover ? \"block\" : \"none\");
  3591.         
  3592.         // Mettre à jour le bouton de couverture
  3593.         const coverBtn = \$(this).find(\".actions-overlay button:first\");
  3594.         coverBtn.css({
  3595.             \"background\": isCover ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\",
  3596.             \"color\": isCover ? \"white\" : \"#333\"
  3597.         });
  3598.         coverBtn.find(\"i\").attr(\"class\", \"bi bi-star\" + (isCover ? \"-fill\" : \"\"));
  3599.     });
  3600.     
  3601.     // Enregistrer l'ID de la photo de couverture (si nécessaire pour le backend)
  3602.     if (id) {
  3603.         console.log(\"Photo de couverture définie avec l'ID:\", id);
  3604.         // Ici vous pouvez ajouter une requête AJAX pour enregistrer ce choix sur le serveur
  3605.         
  3606.         // Ajouter automatiquement la photo de couverture à la sélection si elle n'y est pas déjà
  3607.         if (!selectedFavorites.includes(id)) {
  3608.             toggleSelection(id);
  3609.         }
  3610.     } else {
  3611.         console.log(\"Photo de couverture supprimée\");
  3612.     }
  3613. }
  3614. // Mettre à jour l'affichage de la photo de couverture
  3615. function updateCoverPhotoDisplay() {
  3616.     if (coverPhotoId) {
  3617.         // Trouver la photo correspondante
  3618.         const coverPhoto = allFavorites.find(fav => fav.id === coverPhotoId);
  3619.         if (coverPhoto) {
  3620.             \$(\"#cover-photo-placeholder\").hide();
  3621.             \$(\"#cover-photo-preview\").show();
  3622.             \$(\"#cover-photo-preview img\").attr(\"src\", coverPhoto.path);
  3623.         } else {
  3624.             // Si l'ID ne correspond à aucune photo (cas rare)
  3625.             coverPhotoId = null;
  3626.             \$(\"#cover-photo-placeholder\").show();
  3627.             \$(\"#cover-photo-preview\").hide();
  3628.         }
  3629.     } else {
  3630.         \$(\"#cover-photo-placeholder\").show();
  3631.         \$(\"#cover-photo-preview\").hide();
  3632.     }
  3633. }
  3634. // Modifier la fonction updateProductsView pour tenir compte de la photo de couverture
  3635. function updateProductsView() {
  3636.     const current = selectedFavorites.length;
  3637.     const hasCoverPhoto = coverPhotoId !== null;
  3638.     
  3639.     \$(\"#product-photo-count\").text(current);
  3640.     
  3641.     let remainingForAlbum = Math.max(0, 20 - current);
  3642.     let remainingForPochette = Math.max(0, 12 - current);
  3643.     let remainingForPack = Math.max(0, 12 - current);
  3644.     const progressBar = (count, total, color) => `
  3645.         <div style=\"margin: 5px 0;\">
  3646.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  3647.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  3648.             </div>
  3649.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  3650.         </div>
  3651.     `;
  3652.     // Liste des produits
  3653.     const products = [
  3654.         {
  3655.             name: \"Pochette photo (12 photos)\",
  3656.             required: 12,
  3657.             remaining: Math.max(0, 12 - current),
  3658.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  3659.             color: \"#2196f3\",
  3660.             link: \"";
  3661.         // line 3327
  3662.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("AjoutPochettePhotos_Favoris", ["nbr" => 12]);
  3663.         yield "\",
  3664.             needsCover: true
  3665.         },
  3666.         {
  3667.             name: \"Pack numérique (20 photos)\",
  3668.             required: 20,
  3669.             remaining: Math.max(0, 20 - current),
  3670.             image: \"/images/produit/photoNumerique.jpg\",
  3671.             color: \"#4caf50\",
  3672.             link: \"";
  3673.         // line 3336
  3674.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("PackPhotosNumerique_Favoris", ["nbr" => 20]);
  3675.         yield "\",
  3676.             needsCover: false
  3677.         },
  3678.        
  3679.       
  3680.     ].sort((a, b) => a.remaining - b.remaining);
  3681.     const productList = products
  3682.         .map((product) => {
  3683.             const count = current;
  3684.             const total = product.required;
  3685.             const remaining = product.remaining;
  3686.             const coverRequired = product.needsCover && !hasCoverPhoto;
  3687.             return `
  3688.                 <li style=\"margin-bottom: 20px; position: relative;\">
  3689.                     \${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;\">
  3690.                         <i class=\"bi bi-exclamation-triangle\"></i> Photo de couverture requise
  3691.                     </div>` : ''}
  3692.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  3693.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  3694.                         <div style=\"flex: 1;\">
  3695.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  3696.                             \${progressBar(count, total, product.color)}
  3697.                             \${
  3698.                                 remaining > 0
  3699.                                 ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  3700.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  3701.                                 </small>`
  3702.                                 : coverRequired
  3703.                                 ? `<button
  3704.                                     style=\"
  3705.                                         margin-top: 5px;
  3706.                                         padding: 6px 12px;
  3707.                                         background-color: #FFC107;
  3708.                                         color: #333;
  3709.                                         border: none;
  3710.                                         border-radius: 5px;
  3711.                                         font-size: 13px;
  3712.                                         cursor: pointer;
  3713.                                     \"
  3714.                                     onclick=\"\$('#tab-photos').click(); /* Rediriger vers l'onglet photos */\"
  3715.                                 >
  3716.                                     Choisir une couverture
  3717.                                 </button>`
  3718.                                 : `<button
  3719.                                     style=\"
  3720.                                         margin-top: 5px;
  3721.                                         padding: 6px 12px;
  3722.                                         background-color: \${product.color};
  3723.                                         color: white;
  3724.                                         border: none;
  3725.                                         border-radius: 5px;
  3726.                                         font-size: 13px;
  3727.                                         cursor: pointer;
  3728.                                     \"
  3729.                                     onclick=\"window.location.href='\${product.link}'\"
  3730.                                 >
  3731.                                     Commander
  3732.                                 </button>`
  3733.                             }
  3734.                         </div>
  3735.                     </div>
  3736.                 </li>
  3737.             `;
  3738.         })
  3739.         .join(\"\");
  3740.     const boutiqueButton = `
  3741.         <li style=\"margin-top: 25px; text-align: center;\">
  3742.             <button
  3743.                 style=\"
  3744.                     padding: 8px 15px;
  3745.                     background-color: #F56040;
  3746.                     color: white;
  3747.                     border: none;
  3748.                     border-radius: 5px;
  3749.                     font-size: 14px;
  3750.                     width: 170px;
  3751.                     height: 40px;
  3752.                     cursor: pointer;
  3753.                 \"
  3754.                 onclick=\"window.location.href='";
  3755.         // line 3418
  3756.         yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("boutique5sur5");
  3757.         yield "'\"
  3758.             >
  3759.                 Voir toute la boutique
  3760.             </button>
  3761.         </li>
  3762.     `;
  3763.     \$(\"#product-list\").html(productList + boutiqueButton);
  3764. }
  3765. });
  3766. </script>
  3767. ";
  3768.         
  3769.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  3770.         
  3771.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  3772.         yield from [];
  3773.     }
  3774.     /**
  3775.      * @codeCoverageIgnore
  3776.      */
  3777.     public function getTemplateName(): string
  3778.     {
  3779.         return "Parent/DetailsSejour.html.twig";
  3780.     }
  3781.     /**
  3782.      * @codeCoverageIgnore
  3783.      */
  3784.     public function isTraitable(): bool
  3785.     {
  3786.         return false;
  3787.     }
  3788.     /**
  3789.      * @codeCoverageIgnore
  3790.      */
  3791.     public function getDebugInfo(): array
  3792.     {
  3793.         return array (  4056 => 3418,  3971 => 3336,  3959 => 3327,  3471 => 2842,  3448 => 2822,  3432 => 2809,  3318 => 2698,  3310 => 2692,  3305 => 2689,  3303 => 2688,  3227 => 2614,  3224 => 2613,  3212 => 2603,  3209 => 2602,  3207 => 2601,  2945 => 2342,  2876 => 2276,  2749 => 2152,  2738 => 2144,  2727 => 2136,  2709 => 2121,  2106 => 1521,  2036 => 1454,  2025 => 1446,  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,);
  3794.     }
  3795.     public function getSourceContext(): Source
  3796.     {
  3797.         return new Source("{% extends \"Parent/LayoutParent.html.twig\" %} {% block LinksCss %}
  3798. {{ parent() }}
  3799. <script src=\"https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.js\"></script>
  3800. <link rel=\"stylesheet\" href=\"{{ '/css/Parent/css/premiercnx.css' }}\" />
  3801. <link href=\"{{ asset('css/Parent/css/detailsejour.css') }}\" type=\"text/css\" rel=\"stylesheet\" />
  3802. <link rel=\"stylesheet\" href=\"{{ '/css/Accompagnateur/imgzoom.css' }}\" />
  3803. <link rel=\"stylesheet\" href=\"{{ asset('Plugins/css/dropzone.css') }}\" />
  3804. <link rel=\"stylesheet\" href=\"{{ asset('css/splide.min.css') }}\" />
  3805. <link rel=\"stylesheet\" href=\"{{ asset('css/favorites-sidebar.css') }}\" />
  3806. {% set destination = \"detailsejour\" %}
  3807. <style>
  3808. .btn-cmdFav {
  3809.   background-color: #F56040;
  3810.   color: white;
  3811.   padding: 10px 20px;
  3812.   border-radius: 6px;
  3813.   font-size: 1rem;
  3814.   box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  3815.   transition: all 0.3s ease;
  3816. }
  3817. .btn-cmdFav:hover {
  3818.   background-color: #e64a30;
  3819.   transform: scale(1.05);
  3820.   box-shadow: 0 6px 12px rgba(0,0,0,0.2);
  3821. }
  3822. .filter-badge {
  3823.   background-color: #ccc;
  3824.   color: white;
  3825.   font-size: 12px;
  3826.   padding: 2px 10px;
  3827.   border-radius: 20px;
  3828.   display: flex;
  3829.   align-items: center;
  3830.   cursor: pointer;
  3831.   transition: all 0.3s ease;
  3832. }
  3833. .filter-badge:hover {
  3834.   background-color: #aaa;
  3835. }
  3836. /* Quand le filtre est actif */
  3837. .filter-badge.active {
  3838.   background-color: #3BA39B; /* Vert plus vif */
  3839.   box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  3840.   font-weight: bold;
  3841.   color: white;
  3842. }
  3843.   .close-btn-purchase {
  3844.     position: absolute;
  3845.     padding: 2px;
  3846.     top: 10px;
  3847.     right: 10px;
  3848.     background: none;
  3849.     border: none;
  3850.     font-size: 35px;
  3851.     cursor: pointer;
  3852.   }
  3853.   .close-btn-purchase :hover {
  3854.     color: red;
  3855.   }
  3856.   .rowimag.no-margin {
  3857.     display: grid;
  3858.     grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  3859.     /* auto-fill + minmax ensures they fill the row and wrap automatically */
  3860.     gap: 8px; /* spacing between items, optional */
  3861.     margin: 0; /* override default margin if you want */
  3862.     padding: 0;
  3863.   }
  3864.   /* Each cell is 200px tall (or pick your own dimension). */
  3865.   .photo-item {
  3866.     width: 100%;
  3867.     height: 250px; /* fixed height: 200px */
  3868.     position: relative;
  3869.     overflow: hidden; /* hide any overflow if the image is bigger */
  3870.     border-radius: 4px; /* optional rounding corners */
  3871.     background: #f0f0f0; /* fallback background color while image loads */
  3872.     margin-bottom: 20px;
  3873.   }
  3874.   /* For images, we want them to fill the box and maintain a cover aspect. */
  3875.   .photo-item img,
  3876.   .photo-item video {
  3877.     width: 100%;
  3878.     height: 100%;
  3879.     object-fit: cover; /* ensures image or video is cropped rather than distorted */
  3880.     display: block;
  3881.   }
  3882.   .fav-button {
  3883.     pointer-events: none; /* Makes the entire button unclickable */
  3884.   }
  3885.   
  3886.   /* Enable hover effects only */
  3887.   .fav-button * {
  3888.     pointer-events: auto; /* Re-enable events for children */
  3889.     pointer-events: hover; /* Only allow hover events, not clicks */
  3890.   }
  3891.   
  3892.   /* Add this class to the purchase alert to ensure it remains interactive */
  3893.   #purchase-alert {
  3894.     pointer-events: auto;
  3895.   
  3896.   }
  3897.   /* Réduit l'espace autour du header */
  3898.   .header {
  3899.     padding: 15px 15px 5px 15px;
  3900.     background: #f9f9f9;
  3901.   }
  3902.   /* Réduit l'espace sous le titre et le sous-titre */
  3903.   .titreDetailSej {
  3904.     margin-bottom: 8px;
  3905.   }
  3906.   .media-counts {
  3907.     margin-bottom: 8px;
  3908.   }
  3909.   /* Centre la navigation des dates */
  3910.   .date-navigation {
  3911.     display: flex;
  3912.     align-items: center;
  3913.     justify-content: center;
  3914.     gap: 8px;
  3915.     width: 100%;
  3916.     margin-top: 0;
  3917.   }
  3918.   /* Centre le conteneur des cartes */
  3919.   .date-container {
  3920.     display: flex;
  3921.     justify-content: center;
  3922.     width: 100%;
  3923.   }
  3924.   .media-list-horizontal {
  3925.     gap: 4px;
  3926.     font-size: 11px;
  3927.     margin-top: 2px;
  3928.     display: flex;
  3929.     justify-content: center;
  3930.     list-style: none;
  3931.     margin-bottom: 0;
  3932.     padding-left: 0;
  3933.   }
  3934.   .sejour-title h1 {
  3935.     font-size: 1.5rem;
  3936.     font-weight: bold;
  3937.     color: #3BA39B;
  3938.     display: flex;
  3939.     align-items: center;
  3940.     gap: 10px;
  3941.   }
  3942.   .sejour-dates {
  3943.     font-size: 14px;
  3944.     color: #777;
  3945.     margin-top: 5px;
  3946.   }
  3947.   .sejour-medias {
  3948.     display: flex;
  3949.     gap: 20px;
  3950.     align-items: center;
  3951.     font-size: 14px;
  3952.     color: #555;
  3953.   }
  3954.   .media-info {
  3955.     display: flex;
  3956.     align-items: center;
  3957.     gap: 5px;
  3958.   }
  3959.   /* Responsive Mobile */
  3960.   @media (max-width: 768px) {
  3961.     .sejour-header {
  3962.       flex-direction: column;
  3963.       align-items: center;
  3964.       text-align: center;
  3965.     }
  3966.     .sejour-medias {
  3967.       margin-top: 10px;
  3968.       gap: 10px;
  3969.     }
  3970.   }
  3971. </style>
  3972. {% endblock %} {% set pageMenu = app.session.get('pageMenu') %} {% block Content
  3973. %}
  3974. <!-- Alerte pour inciter à acheter -->
  3975. <div id=\"purchase-alert\" class=\"purchase-alert hidden\" style=\"display: none;\">
  3976.   <button class=\"close-btn\" onclick=\"closePurchaseAlert()\">&times;</button>
  3977.   <div id=\"purchase-alert-content\">
  3978.     <!-- Le contenu de l'alerte sera mis à jour dynamiquement en fonction du nombre de favoris -->
  3979.   </div>
  3980. </div>
  3981. <div
  3982.   id=\"verifImg\"
  3983.   class=\"modal fade\"
  3984.   role=\"dialog\"
  3985.   style=\"background-color: rgba(112, 112, 112, 0.56); z-index: 1000000\"
  3986. >
  3987.   <div class=\"modal-dialog dialogUploadImg\">
  3988.     <div class=\"row modal-content no-margin contentdialogNoImg\">
  3989.       <div class=\"headerdialogUploadImg\">
  3990.         <h1 class=\"titledialogUploadImg\"></h1>
  3991.         <img
  3992.           src=\"{{ '/images/Accompagnateur/CroixFermeture.svg' }}\"
  3993.           class=\"closeNOUploadImg\"
  3994.           data-dismiss=\"modal\"
  3995.         />
  3996.       </div>
  3997.       <div class=\"ContenudetailsSejour\">
  3998.         <div class=\"row no-margin detailsSejour\">
  3999.           <div class=\"ContentUpload\">
  4000.             <h1 class=\"titleTelechargement\">
  4001.               Oulala, patience, avant tout sélectionnez vos photos préférées à
  4002.               l'aide de ce bouton
  4003.               <i
  4004.                 class=\"bi bi-heart\"
  4005.                 style=\"font-size: 1.3rem\"
  4006.                 title=\"Ajouter à  ma sélection\"
  4007.               ></i>
  4008.               sous les photos  <br /><br /><a style=\"color: #f09e7a\"
  4009.                 >Pensez à commander des tirages... pour leurs offrir un beau
  4010.                 souvenir !
  4011.               </a>
  4012.             </h1>
  4013.           </div>
  4014.         </div>
  4015.       </div>
  4016.       <div class=\"BottomNoUploadImg\">
  4017.         <button class=\"BtnUploadImg btnAnnulerUpload\" data-dismiss=\"modal\">
  4018.           OK
  4019.         </button>
  4020.       </div>
  4021.     </div>
  4022.   </div>
  4023. </div>
  4024. <div class=\"main-content\">
  4025.   <div class=\"row no-margin\">
  4026.     <!-- Chat button -->
  4027.     <div
  4028.       class=\"fav-button\"
  4029.       onmouseover=\"showSelection()\"
  4030.       onmouseout=\"hideSelection()\"
  4031.     >
  4032.       <i id=\"favoris-icon-Accueilpayment\" class=\"bi bi-heart-fill CoeurEclat\"></i
  4033.       ><label
  4034.         id=\"likeCount\"
  4035.         class=\"labelFavCount\"
  4036.         style=\"background-color: #f56040\"
  4037.       >
  4038.         {{ likes | length }}</label
  4039.       >
  4040.     </div>
  4041.     <div class=\"selection-popover\" id=\"selectionPopover\">
  4042.       <h4>Votre sélection</h4>
  4043.       <p>Tirages : {{ likes | length }} / 12</p>
  4044.       <p>Numériques : {{ likes | length }} / 15</p>
  4045.       <p>Album : {{ likes | length }} / 20</p>
  4046.       <button class=\"finalize-button\">Finaliser ma commande</button>
  4047.     </div>
  4048.   </div>
  4049.   <div class=\"divSliderModern\">
  4050.     <input type=\"hidden\" id=\"nbFavCurrent\" value=\"{{ nblikes }}\" />
  4051.     <div
  4052.       class=\"splide no-padding no-margin\"
  4053.       id=\"imageSlider\"
  4054.       style=\"max-height: 200px\"
  4055.     >
  4056.       <div class=\"splide__track\">
  4057.         <ul class=\"splide__list\">
  4058.           <!-- Slide 1 -->
  4059.           <li class=\"splide__slide\">
  4060.             <div class=\"slider-content\" style=\"background: white\">
  4061.               <div class=\"namePRD\" style=\"display: block\">
  4062.                 <h4
  4063.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  4064.                   style=\"color: #41a2aa\"
  4065.                 >
  4066.                   Ajoutez vos favoris dès maintenant
  4067.                 </h4>
  4068.                 <h4
  4069.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  4070.                   style=\"color: #f09e7a\"
  4071.                 >
  4072.                   et profitez de nos produits souvenirs personnalisés !
  4073.                 </h4>
  4074.               </div>
  4075.               <img
  4076.                 src=\"{{ asset('/images/imgSliderEmpty2.png') }}\"
  4077.                 class=\"imgslider\"
  4078.                 alt=\"Image 1\"
  4079.               />
  4080.             </div>
  4081.           </li>
  4082.           <!-- Slide 2 -->
  4083.           <li class=\"splide__slide\">
  4084.             <div class=\"slider-content\" style=\"background: white\">
  4085.               <div class=\"namePRD\" style=\"display: block\">
  4086.                 <h4
  4087.                   class=\"titleProdbienvenu titleProdbienvenu1\"
  4088.                   style=\"color: #f09e7a\"
  4089.                 >
  4090.                   Pensez à commander le livre du séjour
  4091.                 </h4>
  4092.                 <h4
  4093.                   class=\"titleProdbienvenu titleProdbienvenu2\"
  4094.                   style=\"color: #41a2aa\"
  4095.                 >
  4096.                   et offrez lui le plus beau des cadeaux !
  4097.                 </h4>
  4098.               </div>
  4099.               <img
  4100.                 src=\"{{ asset('/images/imgSliderEmpty1.png') }}\"
  4101.                 class=\"imgslider\"
  4102.                 alt=\"Image 2\"
  4103.               />
  4104.             </div>
  4105.           </li>
  4106.         </ul>
  4107.       </div>
  4108.     </div>
  4109.   </div>
  4110.   <!-- Section de contenu à atteindre après le scroll -->
  4111.   <div
  4112.     class=\"no-margin\"
  4113.     id=\"scrollTarget\"
  4114.     style=\"width: 100%; background: #f9f9f9; padding-top: 30px\"
  4115.   >
  4116.     <div class=\"no-margin\" id=\"scrollTarget\" style=\"width: 100%\">
  4117.       <!-- Conteneur principal en ligne -->
  4118.       <div
  4119.         class=\"header d-flex align-items-center justify-content-between\"
  4120.         style=\"padding: 15px;\"
  4121.       >
  4122.         <!-- Bloc titre -->
  4123.         <div class=\"box divInfosSejour\" style=\"width: 95%;\">
  4124.           <img
  4125.             class=\"imageTitreSej\"
  4126.             src=\"/Accueil/imagesAccueil/sejour.png\"
  4127.             alt=\"Icône séjour\"
  4128.             style=\"width: 40px; height: auto\"
  4129.           />
  4130.           <h1 class=\"titreDetailSej\">
  4131.             Séjour {{sejour.codeSejour}} {{ sejour.themSejour }}
  4132.             <span class=\"spnTitleSej\">
  4133.               du
  4134.               {{ 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.\"}) }}
  4135.               au
  4136.               {{ 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.\"}) }}
  4137.             </span>
  4138.           </h1>
  4139.           <span class=\"spnTitleSej\" style=\"color:black\">
  4140.         
  4141.             (📷 {{ attachementsCount }} Photos/Vidéos | 🎵 {{ nbmessages }} Audios  ❤️  <label
  4142.         id=\"mesFavCount\" style=\"color:black;margin-right:5px\"
  4143.       
  4144.     >
  4145.     {{ nblikes }}   </label> Favoris )
  4146.   
  4147.           </span>
  4148.           <div class=\"date-navigation\">
  4149.           
  4150.      
  4151.             <div class=\"date-container\">
  4152.               {% for x, groupAttach in listeattach %}
  4153.                 {% set xDate = date(x) %}
  4154.                 {% set finDate = date(sejour.dateFinSejour) %}
  4155.                 {% if xDate <= finDate %}
  4156.                   <div
  4157.                     class=\"date-card modern-card {% if loop.last and xDate <= finDate %} active {% endif %}\"
  4158.                     data-aos=\"fade-up\"
  4159.                     data-bs-toggle=\"collapse\"
  4160.                     data-bs-target=\"#demP{{ loop.index }}\"
  4161.                     id=\"iconedemoP{{ loop.index }}\"
  4162.                   >
  4163.                     <div class=\"card-content text-center\">
  4164.                       <span class=\"day\">
  4165.                         {% if groupAttach.isFirstDay == \"yes\" %} Premier jour
  4166.                         {% elseif groupAttach.isLastDay == \"yes\" %} Dernier jour
  4167.                         {% else %}
  4168.                           {{ xDate|date(\"D\")|replace({
  4169.                             \"Mon\": \"lun.\",
  4170.                             \"Tue\": \"mar.\",
  4171.                             \"Wed\": \"mer.\",
  4172.                             \"Thu\": \"jeu.\",
  4173.                             \"Fri\": \"ven.\",
  4174.                             \"Sat\": \"sam.\",
  4175.                             \"Sun\": \"dim.\"
  4176.                           }) }}
  4177.                         {% endif %}
  4178.                       </span>
  4179.                       <span class=\"full-date\">
  4180.                         {{ xDate|date(\"d M Y\")|replace({
  4181.                           \"Jan\": \"janv.\",
  4182.                           \"Feb\": \"fév.\",
  4183.                           \"Mar\": \"mars\",
  4184.                           \"Apr\": \"avr.\",
  4185.                           \"May\": \"mai\",
  4186.                           \"Jun\": \"juin\",
  4187.                           \"Jul\": \"juil.\",
  4188.                           \"Aug\": \"août\",
  4189.                           \"Sep\": \"sept.\",
  4190.                           \"Oct.\": \"oct.\",
  4191.                           \"Nov.\": \"nov.\",
  4192.                           \"Dec.\": \"déc.\"
  4193.                         }) }}
  4194.                       </span>
  4195.                       <ul class=\"media-list-horizontal\">
  4196.                         {% if groupAttach.countPhotos > 0 %}
  4197.                         <li>
  4198.                           <i class=\"bi bi-images\" style=\"color: #f56040; font-size: 0.7rem; margin-right: 3px\"></i>
  4199.                           {{ groupAttach.countPhotos }}
  4200.                         </li>
  4201.                         {% endif %}
  4202.                         {% if groupAttach.countAudio > 0 %}
  4203.                         <li>
  4204.                           <i class=\"bi bi-mic-fill\" style=\"color: #ffa500; font-size: 0.7rem; margin-right: 5px\"></i>
  4205.                           {{ groupAttach.countAudio }}
  4206.                         </li>
  4207.                         {% endif %}
  4208.                         {% if groupAttach.countVideos > 0 %}
  4209.                         <li>
  4210.                           <i class=\"bi bi-camera-video-fill\" style=\"color: #41a2aa; font-size: 0.7rem; margin-right: 5px\"></i>
  4211.                           {{ groupAttach.countVideos }}
  4212.                         </li>
  4213.                         {% endif %}
  4214.                       </ul>
  4215.                     </div>
  4216.                   </div>
  4217.                 {% endif %}
  4218.               {% endfor %} <div id=\"dynamic-card\" class=\"dynamic-card\">
  4219.       <div id=\"dynamic-card-content\" class=\"dynamic-card-content\">
  4220.         <!-- Le contenu dynamique (album, pochette, montage vidéo) sera injecté ici -->
  4221.       </div>
  4222.     </div>
  4223.             </div>
  4224.           </div>
  4225.         </div>
  4226.       </div>
  4227.     </div>
  4228.     <!-- Descriptions and Attachments -->
  4229.     <div class=\"container--gallery modern\">
  4230.       {% set lastValidIndex = 0 %}
  4231.       {% set hasAttachments = false %}
  4232.       {% for x, groupAttach in listeattach %}
  4233.       {% set xDate = date(x) %}
  4234.       {% set finDate = date(sejour.dateFinSejour) %}
  4235.       {% if xDate <= finDate %}
  4236.       {% set lastValidIndex = loop.index %}
  4237.       {% set hasAttachments = true %}
  4238.       <div
  4239.         id=\"demP{{ loop.index }}\"
  4240.         class=\"collapse {% if loop.last and xDate <= finDate %}show{% endif %}\"
  4241.         style=\"padding: 2%; padding-top: 0%\"
  4242.       >
  4243.         <div class=\"journal-entry\">
  4244.         <div class=\"entry-header\" style=\"
  4245.     display: flex;
  4246.     align-items: center;
  4247.     justify-content: space-between;
  4248.     background: #ffffff;
  4249.     padding: 8px 15px;
  4250.     border-radius: 10px;
  4251.     margin-bottom: 20px;
  4252.     box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  4253.     border-bottom: 1px solid #eee;
  4254.     flex-wrap: wrap;
  4255. \">
  4256.   <!-- Bouton Jour Précédent -->
  4257.   {% if not loop.first %}
  4258.   <button class=\"btn-prev-day\" data-target=\"{{ loop.index0 - 1 }}\" style=\"
  4259.       background-color: #3BA39B;
  4260.       border: none;
  4261.       padding: 5px 10px;
  4262.       border-radius: 8px;
  4263.       font-weight: bold;
  4264.       font-size: 14px;
  4265.       height: 36px;
  4266.       display: flex;
  4267.       align-items: center;
  4268.       color: white;
  4269.       cursor: pointer;
  4270.       transition: all 0.3s ease;
  4271.   \">
  4272.     <i class=\"bi bi-chevron-left\" style=\"font-size: 18px;\"></i>
  4273.   </button>
  4274.   {% else %}
  4275.   <div style=\"width: 36px;\"></div>
  4276.   {% endif %}
  4277.   <!-- Centre : Date + Médias -->
  4278.   <div style=\"
  4279.       flex-grow: 1;
  4280.       display: flex;
  4281.       align-items: center;
  4282.       justify-content: center;
  4283.       flex-wrap: wrap;
  4284.       gap: 12px;
  4285.   \">
  4286.     <!-- Date -->
  4287.     <div style=\"font-weight: bold; font-size: 16px; color: #333;\">
  4288.       {{ x|date(\"l d F Y\")|replace({
  4289.           \"Monday\": \"Lundi\", \"Tuesday\": \"Mardi\", \"Wednesday\": \"Mercredi\",
  4290.           \"Thursday\": \"Jeudi\", \"Friday\": \"Vendredi\", \"Saturday\": \"Samedi\",
  4291.           \"Sunday\": \"Dimanche\",
  4292.           \"January\": \"Janvier\", \"February\": \"Février\", \"March\": \"Mars\",
  4293.           \"April\": \"Avril\", \"May\": \"Mai\", \"June\": \"Juin\",
  4294.           \"July\": \"Juillet\", \"August\": \"Août\", \"September\": \"Septembre\",
  4295.           \"October\": \"Octobre\", \"November\": \"Novembre\", \"December\": \"Décembre\"
  4296.       }) }}
  4297.     </div>
  4298.   <!-- Filtres Médias -->
  4299. <div class=\"filter-icons\" style=\"display: flex; gap: 8px; flex-wrap: wrap;\">
  4300.     <span class=\"filter-badge active\" data-filter=\"all\" title=\"Afficher tout\">
  4301.         <i class=\"bi bi-grid-3x3-gap-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> Tout
  4302.     </span>
  4303.     {% if groupAttach.countPhotos > 0 %}
  4304.     <span class=\"filter-badge\" data-filter=\"photo\" title=\"Filtrer les photos\">
  4305.         <i class=\"bi bi-image\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countPhotos }}
  4306.     </span>
  4307.     {% endif %}
  4308.     {% if groupAttach.countVideos > 0 %}
  4309.     <span class=\"filter-badge\" data-filter=\"video\" title=\"Filtrer les vidéos\">
  4310.         <i class=\"bi bi-camera-video-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countVideos }}
  4311.     </span>
  4312.     {% endif %}
  4313.     {% if groupAttach.countAudio > 0 %}
  4314.     <span class=\"filter-badge\" data-filter=\"audio\" title=\"Filtrer les messages audio\">
  4315.         <i class=\"bi bi-mic-fill\" style=\"margin-right: 5px; font-size: 14px;\"></i> {{ groupAttach.countAudio }}
  4316.     </span>
  4317.     {% endif %}
  4318. </div>
  4319.   </div>
  4320.   <!-- Bouton Jour Suivant -->
  4321.   {% if not loop.last %}
  4322.   <button class=\"btn-next-day\" data-target=\"{{ loop.index0 + 1 }}\" style=\"
  4323.       background-color: #3BA39B;
  4324.       border: none;
  4325.       padding: 5px 10px;
  4326.       border-radius: 8px;
  4327.       font-weight: bold;
  4328.       font-size: 14px;
  4329.       height: 36px;
  4330.       display: flex;
  4331.       align-items: center;
  4332.       color: white;
  4333.       cursor: pointer;
  4334.       transition: all 0.3s ease;
  4335.   \">
  4336.     <i class=\"bi bi-chevron-right\" style=\"font-size: 18px;\"></i>
  4337.   </button>
  4338.   {% else %}
  4339.   <div style=\"width: 36px;\"></div>
  4340.   {% endif %}
  4341.    
  4342.    
  4343.         </div>
  4344.         <!-- Contenu -->
  4345.         <div class=\"entry-content\" id=\"TourContent\">
  4346.       
  4347.           <p class=\"description\" style=\"margin-left:2%;width:95%;margin-top:1%;margin-bottom:1%;text-align:left\">
  4348.             {% for description in sejour.jourdescripdate %} {% if
  4349.             description.datejourphoto|date(\"m/d/Y\") == x|date(\"m/d/Y\") %}
  4350.             {{ description.description | nl2br }}
  4351.             {% endif %} {% endfor %}
  4352.           </p>
  4353.  
  4354.           <!-- Conteneur des photos et vidéos -->
  4355.           <div
  4356.             class=\"rowimag no-margin\"
  4357.             style=\"
  4358.               width: 100%;
  4359.               display: flex;
  4360.               flex-wrap: wrap;
  4361.               margin: 0;
  4362.               box-sizing: border-box;
  4363.             \"
  4364.           >
  4365.             <!-- Afficher les Photos et Vidéos -->
  4366.             {% for attach in groupAttach.attachments %}
  4367.               {% if attach.libiller == 'photo' %}
  4368.            
  4369.             <div class=\"column\" data-type=\"{{ attach.libiller }}\">
  4370.             
  4371.               <div class=\"photo-zoom photo-item\">
  4372.          
  4373.                 <a href=\"{{ attach.path }}\">
  4374.                   <img src=\"{{ attach.path }}\" alt=\"{{ attach.descreption }}\" />
  4375.                 </a>
  4376.                 <!-- Icône du cœur avec logique existante -->
  4377.                 <div
  4378.                   class=\"heart-icon\"
  4379.                   id=\"coeur{{ attach.id_attchment }}\"
  4380.                   data-id=\"{{ attach.id_attchment }}\"
  4381.                   data-sejour-id=\"{{ sejour.id }}\"
  4382.                   data-path=\"{{ attach.path }}\"
  4383.                   data-description=\"{{ attach.descreption }}\"
  4384.                 >
  4385.                   {% if app.user %} {% if attach.is_favorite %}
  4386.                   <i
  4387.                     class=\"bi bi-heart-fill\"
  4388.                     title=\"Sélectionnée\"
  4389.                     style=\"color: #f56040\"
  4390.                   ></i>
  4391.                   {% else %}
  4392.                   <i class=\"bi bi-heart\" title=\"Ajouter à ma sélection\"></i>
  4393.                   {% endif %} {% endif %}
  4394.                 </div>
  4395.                 <div class=\"photo-actions\" style=\"display: none\">
  4396.                   <button class=\"menu-btn\">⋮</button>
  4397.                   <div class=\"menu-options\">
  4398.                     <button onclick=\"addToPack('tirage')\">
  4399.                       🖨️ Ajouter au tirage
  4400.                     </button>
  4401.                     <button onclick=\"addToPack('numerique')\">
  4402.                       💾 Ajouter au numérique
  4403.                     </button>
  4404.                   </div>
  4405.                 </div>
  4406.               
  4407.               </div>
  4408.               {% if attach.descreption != \"\" %}
  4409.               <h4 class=\"description\">{{ attach.descreption }}</h4>
  4410.               {% endif %}
  4411.             </div>
  4412.             {% endif %} 
  4413.              {% if attach.libiller == 'video' %}
  4414.            
  4415.             <div class=\"column\" data-type=\"{{ attach.libiller }}\">
  4416.                  
  4417.             
  4418.                  <div class=\"video-container\" style=\"position: relative; display: inline-block; width: 100%; border-radius: 8px; overflow: hidden;\">
  4419.                         <video class=\"photo-zoom\" controls controlslist=\"nodownload noplaybackrate\" style=\"width: 100%;\">
  4420.                           <source src=\"{{ attach.path }}\" type=\"video/mp4\" />
  4421.                           Votre navigateur ne supporte pas la lecture vidéo.
  4422.                         </video>
  4423.                       
  4424.                       </div>
  4425.               {% if attach.descreption != \"\" %}
  4426.               <h4 class=\"description\">{{ attach.descreption }}</h4>
  4427.               {% endif %}
  4428.             </div>
  4429.             {% endif %} 
  4430.             
  4431.             {% endfor %}
  4432.           </div>
  4433.           <!-- Section séparée pour les messages audio -->
  4434.           {% if groupAttach.countAudio > 0 %}
  4435.           <div class=\"audio-messages-section\" style=\"margin-top:15px; border-top: 1px solid #eee; padding: 30px;\">
  4436.             <h4 style=\"margin-bottom: 15px; color: #555\">
  4437.               <i class=\"bi bi-mic-fill\" style=\"margin-right: 8px; color: #ffa500\"></i>
  4438.               Messages vocaux ({{ groupAttach.countAudio }})
  4439.             </h4>
  4440.             
  4441.             {% if sejour.codeSejour|slice(0, 2) == 'PF' %}
  4442.               {# Les séjours commençant par PF ont toujours accès #}
  4443.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  4444.                 {% for attach in groupAttach.attachments %}
  4445.                   {% if attach.libiller == 'message' %}
  4446.                     <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;\">
  4447.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4448.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4449.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  4450.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4451.                           Votre navigateur ne supporte pas la lecture audio.
  4452.                         </audio>
  4453.                       </div>
  4454.                       {% if attach.descreption != \"\" %}
  4455.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4456.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4457.                             {{ attach.descreption }}
  4458.                           </p>
  4459.                         </div>
  4460.                       {% endif %}
  4461.                     </div>
  4462.                   {% endif %}
  4463.                 {% endfor %}
  4464.               </div>
  4465.             
  4466.             {% elseif sejour.codeSejour|slice(0, 2) == 'PP' and parentsejour.payment  == 1 or sejour.codeSejour|slice(0, 2) == 'EF' and parentsejour.payment  == 1 %}
  4467.               {# PP ou EF avec paiement effectué #}
  4468.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px\">
  4469.                 {% for attach in groupAttach.attachments %}
  4470.                   {% if attach.libiller == 'message' %}
  4471.                     <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;\">
  4472.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4473.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4474.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\">
  4475.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4476.                           Votre navigateur ne supporte pas la lecture audio.
  4477.                         </audio>
  4478.                       </div>
  4479.                       {% if attach.descreption != \"\" %}
  4480.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4481.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4482.                             {{ attach.descreption }}
  4483.                           </p>
  4484.                         </div>
  4485.                       {% endif %}
  4486.                     </div>
  4487.                   {% endif %}
  4488.                 {% endfor %}
  4489.               </div>
  4490.             
  4491.             {% elseif sejour.codeSejour|slice(0, 2) == 'PP' and parentsejour.payment == 0 or sejour.codeSejour|slice(0, 2) == 'EF' and parentsejour.payment == 0 %}
  4492.               {# PP ou EF sans paiement - message d'accès limité et audio désactivés #}
  4493.               <div class=\"audio-messages-container\" style=\"display: flex; flex-wrap: wrap; gap: 15px; opacity: 0.5; pointer-events: none; filter: grayscale(100%);\">
  4494.                 <div class=\"audio-messages-restricted\" style=\"padding: 20px; background: #f0f0f0; border-radius: 8px; text-align: center; margin-bottom: 15px; width: 100%;\">
  4495.                   <i class=\"bi bi-lock-fill\" style=\"font-size: 24px; color: #808080; margin-bottom: 10px;\"></i>
  4496.                   <p style=\"margin: 0; color: #555;\">📢 Les messages vocaux sont disponibles via la boîte vocale premium. Un paiement est requis pour l’activer et y accéder.</p>
  4497.                 </div>
  4498.                 {% for attach in groupAttach.attachments %}
  4499.                   {% if attach.libiller == 'message' %}
  4500.                     <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;\">
  4501.                       <div class=\"audio-player-container\" style=\"display: flex; align-items: center; margin-bottom: 10px;\">
  4502.                         <i class=\"bi bi-mic-fill\" style=\"font-size: 20px; margin-right: 10px; color: #ffa500\"></i>
  4503.                         <audio controls controlslist=\"nodownload noplaybackrate\" style=\"flex: 1\" disabled>
  4504.                           <source src=\"{{ attach.path }}\" type=\"audio/mp3\" />
  4505.                           Votre navigateur ne supporte pas la lecture audio.
  4506.                         </audio>
  4507.                       </div>
  4508.                       {% if attach.descreption != \"\" %}
  4509.                         <div class=\"audio-description\" style=\"padding-left: 30px\">
  4510.                           <p style=\"margin: 0; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;\">
  4511.                             {{ attach.descreption }}
  4512.                           </p>
  4513.                         </div>
  4514.                       {% endif %}
  4515.                     </div>
  4516.                   {% endif %}
  4517.                 {% endfor %}
  4518.               </div>
  4519.             {% endif %}
  4520.           </div>
  4521.         {% endif %}
  4522.         </div>
  4523.       </div>
  4524.     </div>
  4525.     {% endif %}
  4526.     {% endfor %}
  4527.     {% if not hasAttachments %}
  4528.     <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);\">
  4529.       <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';\">
  4530.       
  4531.       <h2 style=\"color: #41a2aa; margin-bottom: 20px; font-size: 24px;\">Bienvenue sur votre espace séjour !</h2>
  4532.       
  4533.       <p style=\"font-size: 18px; color: #555; margin-bottom: 15px;\">
  4534.         Aucun contenu n'a encore été partagé pour ce séjour.
  4535.       </p>
  4536.       
  4537.       <p style=\"font-size: 16px; color: #666; margin-bottom: 25px;\">
  4538.         L'accompagnateur partagera bientôt des photos, vidéos et messages vocaux.
  4539.         <br>Revenez consulter cette page régulièrement pour suivre les aventures du séjour !
  4540.       </p>
  4541.       
  4542.       <div style=\"display: flex; justify-content: center; gap: 15px; flex-wrap: wrap;\">
  4543.         <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);\">
  4544.           <i class=\"bi bi-images\" style=\"font-size: 24px; color: #f56040; margin-right: 10px;\"></i>
  4545.           <span>Photos du séjour</span>
  4546.         </div>
  4547.         
  4548.         <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);\">
  4549.           <i class=\"bi bi-camera-video-fill\" style=\"font-size: 24px; color: #41a2aa; margin-right: 10px;\"></i>
  4550.           <span>Vidéos des activités</span>
  4551.         </div>
  4552.         
  4553.         <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);\">
  4554.           <i class=\"bi bi-mic-fill\" style=\"font-size: 24px; color: #ffa500; margin-right: 10px;\"></i>
  4555.           <span>Messages vocaux</span>
  4556.         </div>
  4557.       </div>
  4558.     </div>
  4559.     
  4560.     <!-- Espace supplémentaire pour déplacer le footer vers le bas -->
  4561.     <div style=\"height: 300px;\"></div>
  4562.     {% endif %}
  4563.     
  4564.     <!-- Make sure we're showing the right content by default if no valid content is marked 'show' -->
  4565.     {% if lastValidIndex > 0 %}
  4566.     <script>
  4567.       document.addEventListener('DOMContentLoaded', function() {
  4568.         // Check if no content is showing
  4569.         if (document.querySelectorAll('.container--gallery .collapse.show').length === 0) {
  4570.           // Show the content for the last valid date
  4571.           var lastValidContent = document.getElementById('demP{{ lastValidIndex }}');
  4572.           if (lastValidContent) {
  4573.             lastValidContent.classList.add('show');
  4574.             
  4575.             // Also mark the corresponding date card as active
  4576.             var dateCards = document.querySelectorAll('.date-card');
  4577.             if (dateCards.length >= {{ lastValidIndex }}) {
  4578.               dateCards.forEach(card => card.classList.remove('active'));
  4579.               dateCards[{{ lastValidIndex - 1 }}].classList.add('active');
  4580.             }
  4581.           }
  4582.         }
  4583.       });
  4584.     </script>
  4585.     {% endif %}
  4586.   </div>
  4587. </div>
  4588.   {% endblock %} {% block Javascript %}
  4589.   {{ parent() }}
  4590.   <script>// Gestion de la sidebar des favoris
  4591. document.addEventListener('DOMContentLoaded', function() {
  4592.     const sidebar = document.getElementById('favorites-sidebar');
  4593.     const openBtn = document.getElementById('openFavoritesSidebar');
  4594.     const closeBtn = document.querySelector('.favorites-close');
  4595.     const favButton = document.querySelector('.fav-button');
  4596.     function openSidebar() {
  4597.         sidebar.classList.add('active');
  4598.         updateFavoritesSidebar();
  4599.     }
  4600.     function closeSidebar() {
  4601.         sidebar.classList.remove('active');
  4602.     }
  4603.     function updateFavoritesSidebar() {
  4604.         const grid = document.getElementById('favorites-grid');
  4605.         const counter = document.getElementById('favorites-counter');
  4606.         const emptyState = document.getElementById('favorites-empty-state');
  4607.         const progress = document.getElementById('favorites-progress');
  4608.         
  4609.         const count = parseInt(document.getElementById('likeCount').textContent);
  4610.         counter.textContent = count +1;
  4611.         
  4612.         if (count === 0) {
  4613.             emptyState.style.display = 'flex';
  4614.             grid.style.display = 'none';
  4615.         } else {
  4616.             emptyState.style.display = 'none';
  4617.             grid.style.display = 'grid';
  4618.             const percentage = (count / 20) * 100;
  4619.             progress.style.width = `\${percentage}%`;
  4620.         }
  4621.     }
  4622.     if (openBtn) {
  4623.         openBtn.addEventListener('click', openSidebar);
  4624.     }
  4625.     if (favButton) {
  4626.         favButton.addEventListener('click', openSidebar);
  4627.     }
  4628.     if (closeBtn) {
  4629.         closeBtn.addEventListener('click', closeSidebar);
  4630.     }
  4631.     document.addEventListener('click', (e) => {
  4632.         if (sidebar.classList.contains('active') && 
  4633.             !sidebar.contains(e.target) && 
  4634.             !favButton.contains(e.target) && 
  4635.             !openBtn.contains(e.target)) {
  4636.             closeSidebar();
  4637.         }
  4638.     });
  4639. });
  4640. // Modification des fonctions existantes
  4641. const originalAddFavoris = window.AddFavoris;
  4642. window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  4643.     if (originalAddFavoris) {
  4644.         originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  4645.     }
  4646.     
  4647.     // Vérifier si la sidebar est ouverte - noter que nous vérifions la valeur CSS right: 0
  4648.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4649.         // Recharger les favoris
  4650.         loadFavorites();
  4651.     }
  4652. };
  4653. const originalSupprimerFavoris = window.supprimerFavoris;
  4654. window.supprimerFavoris = function(\$id, \$idSejour) {
  4655.     if (originalSupprimerFavoris) {
  4656.         originalSupprimerFavoris(\$id, \$idSejour);
  4657.     }
  4658.     
  4659.     // Vérifier si la sidebar est ouverte
  4660.     if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4661.         // Recharger les favoris
  4662.         loadFavorites();
  4663.     }
  4664. };
  4665. // Variables globales
  4666. let selectedFavorites = [];
  4667. let allFavorites = [];
  4668. // Fonction pour mettre à jour la sidebar
  4669. function loadFavorites() {
  4670.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  4671.     
  4672.     \$.ajax({
  4673.         url: \"/Parent/mes-favoris\",
  4674.         type: \"GET\",
  4675.         dataType: \"json\",
  4676.         success: function(data) {
  4677.             \$(\"#favorites-grid\").empty();
  4678.             allFavorites = data.data || [];
  4679.             
  4680.             if (allFavorites.length > 0) {
  4681.                 \$(\"#favorites-empty-state\").hide();
  4682.                 
  4683.                 \$.each(allFavorites, function(i, fav) {
  4684.                     var isSelected = selectedFavorites.includes(fav.id);
  4685.                     
  4686.                     var item = \$(\"<div class='favorite-item' style='position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;'></div>\");
  4687.                     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\");
  4688.                     
  4689.                     // Overlay de sélection
  4690.                     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>\");
  4691.                     
  4692.                     // Icône de sélection
  4693.                     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>\");
  4694.                     if (isSelected) {
  4695.                         checkIcon.append(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4696.                     }
  4697.                     
  4698.                     selectionOverlay.append(checkIcon);
  4699.                     
  4700.                     // Overlay d'action (bouton supprimer)
  4701.                     var actionOverlay = \$(\"<div class='action-overlay' style='position:absolute;top:5px;right:5px;opacity:0;transition:opacity 0.2s;'></div>\");
  4702.                   
  4703.                     actionOverlay.append(deleteBtn);
  4704.                     
  4705.                     // Ajouter les événements
  4706.                     item.hover(
  4707.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"1\"); },
  4708.                         function() { \$(this).find(\".action-overlay\").css(\"opacity\", \"0\"); }
  4709.                     );
  4710.                     
  4711.                     item.click(function() {
  4712.                         toggleSelection(fav.id, \$(this).find(\".selection-overlay > div\"));
  4713.                     });
  4714.                     
  4715.                     item.append(img).append(selectionOverlay).append(actionOverlay);
  4716.                     \$(\"#favorites-grid\").append(item);
  4717.                 });
  4718.                 
  4719.                 \$(\"#favorites-counter\").text(allFavorites.length);
  4720.                 
  4721.                 // Mettre à jour le compteur sur le bouton également
  4722.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  4723.                 
  4724.                 // Mettre à jour l'interface produits
  4725.                 updateProductsView();
  4726.                 
  4727.             } else {
  4728.                 \$(\"#favorites-empty-state\").show();
  4729.                 \$(\"#favorites-counter\").text(\"0\");
  4730.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  4731.                 \$(\"#selection-count\").text(\"0\");
  4732.                 updateProductsView();
  4733.             }
  4734.         },
  4735.         error: function() {
  4736.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  4737.         }
  4738.     });
  4739. }
  4740. // Fonction pour supprimer un favori
  4741. function removeFavorite(id) {
  4742.     \$.ajax({
  4743.         url: \"/Parent/remove-favorite/\" + id,
  4744.         type: \"POST\",
  4745.         success: function() {
  4746.             // Retirer de la sélection si présent
  4747.             selectedFavorites = selectedFavorites.filter(favId => favId != id);
  4748.             
  4749.             // Mettre à jour le compteur de sélection
  4750.             \$(\"#selection-count\").text(selectedFavorites.length);
  4751.             
  4752.             // Recharger les favoris
  4753.             loadFavorites();
  4754.             
  4755.             // Mettre à jour les compteurs globaux
  4756.             var count = parseInt(\$(\"#likeCount\").text());
  4757.             if (!isNaN(count)) {
  4758.                 \$(\"#likeCount\").text(count - 1);
  4759.             }
  4760.             
  4761.             var countFav = parseInt(\$(\"#mesFavCount\").text());
  4762.             if (!isNaN(countFav)) {
  4763.                 \$(\"#mesFavCount\").text(countFav - 1);
  4764.             }
  4765.             
  4766.             // Mettre à jour l'interface produits
  4767.             updateProductsView();
  4768.         },
  4769.         error: function() {
  4770.             alert(\"Erreur lors de la suppression du favori\");
  4771.         }
  4772.     });
  4773. }
  4774. // Fonction pour basculer la sélection d'une photo
  4775. function toggleSelection(id, checkElement) {
  4776.     const index = selectedFavorites.indexOf(id);
  4777.     
  4778.     if (index === -1) {
  4779.         // Ajouter à la sélection
  4780.         selectedFavorites.push(id);
  4781.         checkElement.css(\"background\", \"#F56040\");
  4782.         checkElement.html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4783.     } else {
  4784.         // Retirer de la sélection
  4785.         selectedFavorites.splice(index, 1);
  4786.         checkElement.css(\"background\", \"transparent\");
  4787.         checkElement.html(\"\");
  4788.     }
  4789.     
  4790.     // Mettre à jour le compteur
  4791.     \$(\"#selection-count\").text(selectedFavorites.length);
  4792.     
  4793.     // Mettre à jour l'interface produits
  4794.     updateProductsView();
  4795. }
  4796. // Fonction pour mettre à jour la vue des produits
  4797. function updateProductsView() {
  4798.     const current = selectedFavorites.length;
  4799.     \$(\"#product-photo-count\").text(current);
  4800.     
  4801.     let remainingForAlbum = Math.max(0, 20 - current);
  4802.     let remainingForPochette = Math.max(0, 12 - current);
  4803.     let remainingForPack = Math.max(0, 12 - current);
  4804.     const progressBar = (count, total, color) => `
  4805.         <div style=\"margin: 5px 0;\">
  4806.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  4807.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  4808.             </div>
  4809.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  4810.         </div>
  4811.     `;
  4812.     // Liste des produits
  4813.     const products = [
  4814.         {
  4815.             name: \"Pack numérique (20 photos)\",
  4816.             required: 20,
  4817.             remaining: Math.max(0, 20 - current),
  4818.             image: \"/images/produit/photoNumerique.jpg\",
  4819.             color: \"#4caf50\",
  4820.             link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr':20}) }}\",
  4821.         },
  4822.        +
  4823.         {
  4824.             name: \"Pochette photo (12 photos)\",
  4825.             required: 12,
  4826.             remaining: Math.max(0, 12 - current),
  4827.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  4828.             color: \"#2196f3\",
  4829.             link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  4830.         },
  4831.     ].sort((a, b) => a.remaining - b.remaining);
  4832.     const productList = products
  4833.         .map((product) => {
  4834.             const count = current;
  4835.             const total = product.required;
  4836.             const remaining = product.remaining;
  4837.             return `
  4838.                 <li style=\"margin-bottom: 20px;\">
  4839.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  4840.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  4841.                         <div style=\"flex: 1;\">
  4842.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  4843.                             \${progressBar(count, total, product.color)}
  4844.                             \${
  4845.                                 `<small style=\"color: \${product.color}; font-size: 12px;\">
  4846.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  4847.                                 </small>
  4848.                                 <button
  4849.                                     style=\"
  4850.                                         margin-top: 5px;
  4851.                                         padding: 6px 12px;
  4852.                                         background-color: \${product.color};
  4853.                                         color: white;
  4854.                                         border: none;
  4855.                                         border-radius: 5px;
  4856.                                         font-size: 13px;
  4857.                                         cursor: pointer;
  4858.                                     \"
  4859.                                     onclick=\"window.location.href='\${product.link}'\"
  4860.                                 >
  4861.                                     Commander
  4862.                                 </button>`
  4863.                             }
  4864.                         </div>
  4865.                     </div>
  4866.                 </li>
  4867.             `;
  4868.         })
  4869.         .join(\"\");
  4870.     const boutiqueButton = `
  4871.         <li style=\"margin-top: 25px; text-align: center;\">
  4872.             <button
  4873.                 style=\"
  4874.                     padding: 8px 15px;
  4875.                     background-color: #F56040;
  4876.                     color: white;
  4877.                     border: none;
  4878.                     border-radius: 5px;
  4879.                     font-size: 14px;
  4880.                     width: 170px;
  4881.                     height: 40px;
  4882.                     cursor: pointer;
  4883.                 \"
  4884.                 onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  4885.             >
  4886.                 Voir toute la boutique
  4887.             </button>
  4888.         </li>
  4889.     `;
  4890.     \$(\"#product-list\").html(productList + boutiqueButton);
  4891. }
  4892. // Modifications au script existant
  4893. \$(document).ready(function() {
  4894.     // Fonctions pour ouvrir/fermer la sidebar
  4895.     \$(\"#openFavoritesSidebar\").click(function() {
  4896.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  4897.         loadFavorites();
  4898.     });
  4899.     
  4900.     \$(\"#close-favorites-btn\").click(function() {
  4901.         closeFavoritesSidebar();
  4902.     });
  4903.     
  4904.     // Fonction pour fermer la sidebar
  4905.     window.closeFavoritesSidebar = function() {
  4906.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  4907.     };
  4908.     
  4909.     // Tout sélectionner / Tout désélectionner
  4910.     \$(\"#select-all-btn\").click(function() {
  4911.         if (selectedFavorites.length === allFavorites.length) {
  4912.             // Tout désélectionner
  4913.             selectedFavorites = [];
  4914.             \$(\".selection-overlay > div\").css(\"background\", \"transparent\").html(\"\");
  4915.             \$(this).text(\"Tout sélectionner\");
  4916.         } else {
  4917.             // Tout sélectionner
  4918.             selectedFavorites = allFavorites.map(fav => fav.id);
  4919.             \$(\".selection-overlay > div\").css(\"background\", \"#F56040\").html(\"<i class='bi bi-check' style='color:white;font-size:16px;'></i>\");
  4920.             \$(this).text(\"Tout désélectionner\");
  4921.         }
  4922.         
  4923.         // Mettre à jour le compteur
  4924.         \$(\"#selection-count\").text(selectedFavorites.length);
  4925.         
  4926.         // Mettre à jour l'interface produits
  4927.         updateProductsView();
  4928.     });
  4929.     
  4930.     // Gestion des onglets
  4931.     \$(\".sidebar-tab\").click(function() {
  4932.         \$(\".sidebar-tab\").removeClass(\"active\").css({
  4933.             \"color\": \"#666\",
  4934.             \"border-bottom\": \"none\"
  4935.         });
  4936.         \$(this).addClass(\"active\").css({
  4937.             \"color\": \"#F56040\",
  4938.             \"border-bottom\": \"2px solid #F56040\"
  4939.         });
  4940.         
  4941.         const tabId = \$(this).attr(\"id\");
  4942.         \$(\".tab-content\").hide();
  4943.         
  4944.         if (tabId === \"tab-photos\") {
  4945.             \$(\"#photos-content\").show();
  4946.         } else if (tabId === \"tab-products\") {
  4947.             \$(\"#products-content\").show();
  4948.         }
  4949.     });
  4950.     
  4951.     // Modifier les fonctions existantes pour intercepter l'ajout/suppression de favoris
  4952.     const originalAddFavoris = window.AddFavoris;
  4953.     window.AddFavoris = function(\$id, \$idSejour, \$urlimg, \$description) {
  4954.         if (originalAddFavoris) {
  4955.             originalAddFavoris(\$id, \$idSejour, \$urlimg, \$description);
  4956.         }
  4957.         
  4958.         // Recharger les favoris si la sidebar est ouverte
  4959.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4960.             loadFavorites();
  4961.         }
  4962.     };
  4963.     const originalSupprimerFavoris = window.supprimerFavoris;
  4964.     window.supprimerFavoris = function(\$id, \$idSejour) {
  4965.         if (originalSupprimerFavoris) {
  4966.             originalSupprimerFavoris(\$id, \$idSejour);
  4967.         }
  4968.         
  4969.         // Recharger les favoris si la sidebar est ouverte
  4970.         if (\$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4971.             // Retirer de la sélection si présent
  4972.             selectedFavorites = selectedFavorites.filter(favId => favId != \$id);
  4973.             loadFavorites();
  4974.         }
  4975.     };
  4976.     
  4977.     // Fermer en cliquant en dehors
  4978.     \$(document).click(function(event) {
  4979.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  4980.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  4981.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  4982.             closeFavoritesSidebar();
  4983.         }
  4984.     });
  4985. });
  4986. // Initialisation de la sidebar
  4987. \$(document).ready(function() {
  4988.     // Fonctions pour ouvrir/fermer la sidebar
  4989.     \$(\"#openFavoritesSidebar\").click(function() {
  4990.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  4991.         loadFavorites();
  4992.     });
  4993.     
  4994.     \$(\"#close-favorites-btn\").click(function() {
  4995.         \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  4996.     });
  4997.     
  4998.     // Fermer en cliquant en dehors
  4999.     \$(document).click(function(event) {
  5000.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  5001.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  5002.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  5003.             \$(\"#favorites-sidebar\").css(\"right\", \"-500px\");
  5004.         }
  5005.     });
  5006. });
  5007.   </script>
  5008.   <script src=\"{{ asset('js/splide.min.js') }}\"></script>
  5009.    
  5010. <script>
  5011.   document.addEventListener('DOMContentLoaded', function () {
  5012.     const openBtn = document.getElementById('openFavoritesSidebar');
  5013.     const sidebar = document.getElementById('favorites-sidebar');
  5014.     const closeBtn = document.getElementById('favorites-close');
  5015.     if (openBtn && sidebar) {
  5016.       openBtn.addEventListener('click', () => sidebar.classList.add('active'));
  5017.     }
  5018.     if (closeBtn && sidebar) {
  5019.       closeBtn.addEventListener('click', () => sidebar.classList.remove('active'));
  5020.     }
  5021.   });
  5022. </script>
  5023.  
  5024. <script>
  5025. document.addEventListener('DOMContentLoaded', function() {
  5026.   const filterBadges = document.querySelectorAll('.filter-badge');
  5027.   filterBadges.forEach(badge => {
  5028.     badge.addEventListener('click', function() {
  5029.       // Désactiver tous les badges
  5030.       filterBadges.forEach(b => b.classList.remove('active'));
  5031.       // Activer le badge cliqué
  5032.       this.classList.add('active');
  5033.     });
  5034.   });
  5035. });
  5036. </script>
  5037.   <script
  5038.     type=\"text/javascript\"
  5039.     src=\"{{ asset('Accueil/js/jquery.magnific-popup.min.js') }}\"
  5040.   ></script>
  5041.   <script>
  5042. document.addEventListener('DOMContentLoaded', function () {
  5043.   const prevButtons = document.querySelectorAll('.btn-prev-day');
  5044.   const nextButtons = document.querySelectorAll('.btn-next-day');
  5045.   const dateCards = document.querySelectorAll('.date-card.modern-card');
  5046.   const collapseSections = document.querySelectorAll('.collapse');
  5047.   function navigateToDay(index) {
  5048.     if (index >= 0 && index < collapseSections.length) {
  5049.       // Fermer tous les jours
  5050.       collapseSections.forEach(s => s.classList.remove('show'));
  5051.       dateCards.forEach(c => c.classList.remove('active'));
  5052.       // Ouvrir le bon jour
  5053.       const targetCollapse = collapseSections[index];
  5054.       const targetCard = dateCards[index];
  5055.       if (targetCollapse && targetCard) {
  5056.         targetCollapse.classList.add('show');
  5057.         targetCard.classList.add('active');
  5058.       }
  5059.     }
  5060.   }
  5061.   prevButtons.forEach(button => {
  5062.     button.addEventListener('click', function () {
  5063.       const targetIndex = parseInt(this.dataset.target, 10);
  5064.       navigateToDay(targetIndex);
  5065.     });
  5066.   });
  5067.   nextButtons.forEach(button => {
  5068.     button.addEventListener('click', function () {
  5069.       const targetIndex = parseInt(this.dataset.target, 10);
  5070.       navigateToDay(targetIndex);
  5071.     });
  5072.   });
  5073. });
  5074. </script>
  5075.   <script>
  5076.     document.addEventListener('DOMContentLoaded', function() {
  5077.   const style = document.createElement('style');
  5078.   style.textContent = `
  5079.     .hidden {
  5080.       display: none !important;
  5081.     }
  5082.   `;
  5083.   document.head.appendChild(style);
  5084. });
  5085.     document.addEventListener('DOMContentLoaded', function() {
  5086.     // Get the favorite button
  5087.     const favoriteButton = document.querySelector('.fav-button');
  5088.     if (favoriteButton) {
  5089.       // Make it unclickable with JS too (belt and suspenders approach)
  5090.       favoriteButton.style.pointerEvents = 'none';
  5091.       
  5092.       // Override any existing click handlers
  5093.       favoriteButton.onclick = function(e) {
  5094.         e.preventDefault();
  5095.         e.stopPropagation();
  5096.         return false;
  5097.       };
  5098.       
  5099.       // Make sure hover still works
  5100.       favoriteButton.addEventListener('mouseover', function() {
  5101.         document.getElementById('purchase-alert').style.display = 'block';
  5102.       });
  5103.       
  5104.       // Keep any existing hover functionality
  5105.       if (typeof showSelection === 'function') {
  5106.         favoriteButton.onmouseover = showSelection;
  5107.       }
  5108.     }
  5109.     
  5110.     // Make sure the purchase alert remains interactive
  5111.     const purchaseAlert = document.getElementById('purchase-alert');
  5112.     if (purchaseAlert) {
  5113.       purchaseAlert.style.pointerEvents = 'auto';
  5114.     }
  5115.   });
  5116.     // Sélection des éléments
  5117.     const purchaseAlert = document.getElementById(\"purchase-alert\");
  5118.     const alertContent = document.getElementById(\"purchase-alert-content\");
  5119.     const likeCountLabel = document.getElementById(\"likeCount\");
  5120.     
  5121.     // Fonction pour obtenir le nombre actuel de favoris
  5122.     function getCurrentFavoriteCount() {
  5123.         const likeCountLabel = document.getElementById(\"likeCount\");
  5124.         return parseInt(likeCountLabel?.textContent.trim(), 10) || 0;
  5125.     }
  5126.     // Fonction pour mettre à jour le contenu de l'alerte
  5127.     function updatePurchaseAlert(current) {
  5128.   let remainingForAlbum = Math.max(0, 20 - current);
  5129.   let remainingForPochette = Math.max(0, 12 - current);
  5130.   let remainingForPack = Math.max(0, 12 - current);
  5131.   const progressBar = (count, total, color) => `
  5132.   <div style=\"margin: 5px 0;\">
  5133.     <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  5134.       <div style=\"width: \${
  5135.         (count / total) * 100
  5136.       }%; background-color: \${color}; height: 100%;\"></div>
  5137.     </div>
  5138.     <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  5139.   </div>
  5140. `;
  5141.   // Use Twig paths here:
  5142.   const products = [
  5143.       {
  5144.       name: \"Pochette photo (12 photos)\",
  5145.       required: 12,
  5146.       remaining: remainingForPochette,
  5147.       image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  5148.       color: \"#2196f3\",
  5149.       link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  5150.     },
  5151.        {
  5152.       name: \"Pack numérique (20 photos)\",
  5153.       required: 20,
  5154.       remaining: remainingForAlbum,
  5155.       image: \"/images/produit/photoNumerique.jpg\",
  5156.       color: \"#4caf50\",
  5157.       link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 20}) }}\",
  5158.     }
  5159.   
  5160.   
  5161.     
  5162.   ].sort((a, b) => a.remaining - b.remaining);
  5163.   const productList = products
  5164.     .map((product) => {
  5165.       const count = current;
  5166.       const total = product.required;
  5167.       const remaining = product.remaining;
  5168.       return `
  5169.     <li style=\"margin-bottom: 15px;\">
  5170.       <div style=\"display: flex; align-items: center; gap: 10px;\">
  5171.         <img
  5172.           src=\"\${product.image}\"
  5173.           alt=\"\${product.name}\"
  5174.           style=\"width: 65px; height: 65px; border-radius: 5px; margin-top:-19px\"
  5175.         />
  5176.         <div style=\"flex: 1;\">
  5177.           <strong style=\"font-size: 14px;\">\${product.name}</strong>
  5178.           \${progressBar(count, total, product.color)}
  5179.           \${
  5180.             remaining > 0
  5181.               ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  5182.                    Encore \${remaining} photos ❤️ pour compléter \${product.name.toLowerCase()}
  5183.                  </small>`
  5184.               : `<button
  5185.                   style=\"
  5186.                     margin-top: 5px;
  5187.                     padding: 5px 8px;
  5188.                     background-color: \${product.color};
  5189.                     color: white;
  5190.                     border: none;
  5191.                     border-radius: 5px;
  5192.                     font-size: 12px;
  5193.                     cursor: pointer;
  5194.                   \"
  5195.                   onclick=\"window.location.href='\${product.link}'\"
  5196.                 >
  5197.                   Commander
  5198.                 </button>`
  5199.           }
  5200.         </div>
  5201.       </div>
  5202.     </li>
  5203.   `;
  5204.     })
  5205.     .join(\"\");
  5206.   const plusButton = `
  5207.     <li style=\"margin-bottom: 15px; text-align: center;\">
  5208.       <button
  5209.         style=\"
  5210.           padding: 5px 8px;
  5211.           background-color: #F56040;
  5212.           color: white;
  5213.           border: none;
  5214.           border-radius: 5px;
  5215.           font-size: 14px;
  5216.           line-height: 1;
  5217.           width: 150px;
  5218.           height: 40px;
  5219.           cursor: pointer;
  5220.         \"
  5221.         onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  5222.       >
  5223.         Aller à la boutique
  5224.       </button>
  5225.     </li>
  5226.   `;
  5227.   if (current === 0) {
  5228.     alertContent.innerHTML = `
  5229.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  5230.       Vous n'avez pas encore de photos favorites !
  5231.     </p>
  5232.     <p style=\"margin-bottom: 20px; color: #555;\">
  5233.       Commencez à ajouter vos moments préférés pour profiter de nos offres.
  5234.     </p>
  5235.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  5236.   `;
  5237.   } else {
  5238.     alertContent.innerHTML = `
  5239.     <p style=\"font-size: 16px; font-weight: bold; color: #333;\">
  5240.       Vous avez atteint \${current} photos favorites !
  5241.     </p>
  5242.     <p style=\"margin-bottom: 20px; color: #555;\">
  5243.       Profitez de nos offres spéciales :
  5244.     </p>
  5245.     <ul style=\"list-style-type: none; padding: 0;\">\${productList}\${plusButton}</ul>
  5246.   `;
  5247.   }
  5248.   purchaseAlert.classList.remove(\"hidden\");
  5249.   clearTimeout(purchaseAlertTimeout);
  5250.   purchaseAlertTimeout = setTimeout(() => {
  5251.     if (!purchaseAlert.matches(\":hover\")) {
  5252.       closePurchaseAlert();
  5253.     }
  5254.   }, 5000);
  5255. }
  5256.     // Fonction pour fermer l'alerte
  5257.     function closePurchaseAlert() {
  5258.       purchaseAlert.classList.add(\"hidden\");
  5259.     }
  5260.     // Événement pour mettre à jour le contenu et afficher la popover dynamiquement au hover
  5261.     document.querySelector(\".fav-button\").addEventListener(\"mouseover\", () => {
  5262.       const currentCount = getCurrentFavoriteCount();
  5263.       updatePurchaseAlert(currentCount);
  5264.       purchaseAlert.classList.remove(\"cachee\"); // Réaffiche la popover
  5265.     });
  5266.     function showSelection() {
  5267.       document.getElementById(\"purchase-alert\").style.display = \"block\";
  5268.     }
  5269.     function hideSelection() {
  5270.       document.getElementById(\"selectionPopover\").style.display = \"none\";
  5271.     }
  5272.     document.addEventListener(\"DOMContentLoaded\", function () {
  5273.       const container = document.querySelector(\".date-container\");
  5274.       // Vérifie si le conteneur existe pour éviter les erreurs
  5275.       if (container) {
  5276.         container.scrollTo({
  5277.           left: container.scrollWidth, // Scroll directement à la position maximale
  5278.           behavior: \"smooth\", // Défilement fluide
  5279.         });
  5280.       }
  5281.     });
  5282.     document.addEventListener(\"DOMContentLoaded\", function () {
  5283.       const container = document.querySelector(\".date-container\");
  5284.       const leftArrow = document.querySelector(\".scroll-btn.left\");
  5285.       const rightArrow = document.querySelector(\".scroll-btn.right\");
  5286.       // Fonction pour vérifier le débordement et activer/désactiver les flèches
  5287.       function updateArrowsVisibility() {
  5288.         const isOverflowing = container.scrollWidth > container.clientWidth; // Vérifie si débordement
  5289.         leftArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  5290.         rightArrow.style.display = isOverflowing ? \"flex\" : \"none\";
  5291.       }
  5292.       // Fonction pour défiler
  5293.       function scrollContainer(direction) {
  5294.         container.scrollBy({
  5295.           left: direction === \"left\" ? -200 : 200, // Défiler à gauche ou à droite
  5296.           behavior: \"smooth\",
  5297.         });
  5298.       }
  5299.       // Ajout des événements de clic pour les flèches
  5300.       leftArrow.addEventListener(\"click\", () => scrollContainer(\"left\"));
  5301.       rightArrow.addEventListener(\"click\", () => scrollContainer(\"right\"));
  5302.       // Vérification initiale et sur redimensionnement de la fenêtre
  5303.       updateArrowsVisibility();
  5304.       window.addEventListener(\"resize\", updateArrowsVisibility);
  5305.     });
  5306.     document.addEventListener(\"DOMContentLoaded\", function () {
  5307.       const container = document.querySelector(\".date-container\");
  5308.       const leftBtn = document.querySelector(\".scroll-btn.left\");
  5309.       const rightBtn = document.querySelector(\".scroll-btn.right\");
  5310.       leftBtn.addEventListener(\"click\", () => {
  5311.         container.scrollBy({
  5312.           left: -200, // Défile vers la gauche
  5313.           behavior: \"smooth\",
  5314.         });
  5315.       });
  5316.       rightBtn.addEventListener(\"click\", () => {
  5317.         container.scrollBy({
  5318.           left: 200, // Défile vers la droite
  5319.           behavior: \"smooth\",
  5320.         });
  5321.       });
  5322.     });
  5323.  document.addEventListener(\"DOMContentLoaded\", function () {
  5324.     // Sélectionnez tous les badges de filtre
  5325.     const filterBadges = document.querySelectorAll(\".filter-badge\");
  5326.     // Sélectionnez tous les éléments de la galerie
  5327.     const galleryItems = document.querySelectorAll(\".column\");
  5328.     // Sélectionnez tous les jours
  5329.     const days = document.querySelectorAll(\".collapse\");
  5330.     // Fonction pour réinitialiser les filtres
  5331.     function resetFilters() {
  5332.         // Réinitialisez tous les éléments de la galerie
  5333.         galleryItems.forEach((item) => {
  5334.             item.style.display = \"block\";
  5335.         });
  5336.         // Réinitialisez les états des badges
  5337.         filterBadges.forEach((badge) => badge.classList.remove(\"active\"));
  5338.     }
  5339.     // Ajoutez un gestionnaire d'événements pour chaque badge
  5340.     filterBadges.forEach((badge) => {
  5341.         badge.addEventListener(\"click\", function () {
  5342.             const filter = this.getAttribute(\"data-filter\");
  5343.             // Réinitialisez l'état actif pour tous les badges
  5344.             filterBadges.forEach((btn) => btn.classList.remove(\"active\"));
  5345.             // Ajoutez l'état actif au badge cliqué
  5346.             this.classList.add(\"active\");
  5347.             // Affichez ou masquez les éléments de la galerie
  5348.             galleryItems.forEach((item) => {
  5349.                 if (filter === \"all\") {
  5350.                     item.style.display = \"block\";
  5351.                 } else if (filter === \"photo\" && item.querySelector(\"img\")) {
  5352.                     item.style.display = \"block\";
  5353.                 } else if (filter === \"video\" && item.querySelector(\"video\")) {
  5354.                     item.style.display = \"block\";
  5355.                 } else if (filter === \"audio\" && item.classList.contains(\"audio-message-item\")) {
  5356.                     item.style.display = \"block\";
  5357.                 } else {
  5358.                     item.style.display = \"none\";
  5359.                 }
  5360.             });
  5361.         });
  5362.     });
  5363.     // Réinitialiser les filtres lors du changement de jour
  5364.     days.forEach((day) => {
  5365.         day.addEventListener(\"show.bs.collapse\", function () {
  5366.             resetFilters();
  5367.         });
  5368.     });
  5369. });
  5370.     \$(document).ready(function () {
  5371.       let zoomCounter = 0; // Initialize zoom counter
  5372.       let currentImageSrc = \"\"; // Track current image source
  5373.       let lastClickPosition = { x: 50, y: 50 }; // Default to center of image
  5374.       \$(\".container--gallery\").magnificPopup({
  5375.         delegate: \"a\",
  5376.         type: \"image\",
  5377.         mainClass: \"mfp-with-zoom mfp-img-mobile\",
  5378.         image: {
  5379.           verticalFit: true,
  5380.         },
  5381.         gallery: {
  5382.           enabled: true,
  5383.           tPrev: \"Previous (Left arrow key)\", // Alt text on left arrow
  5384.           tNext: \"Next (Right arrow key)\", // Alt text on right arrow
  5385.           tCounter: \"%curr% of %total%\", // Markup for \"1 of 7\" counter
  5386.         },
  5387.         zoom: {
  5388.           enabled: true,
  5389.           duration: 300,
  5390.           opener: function (element) {
  5391.             return element.find(\"img\");
  5392.           },
  5393.         },
  5394.         callbacks: {
  5395.           open: function () {
  5396.             // Get current image data from the link that was clicked
  5397.             const currentLink = this.currItem.el;
  5398.             const imageId =
  5399.               currentLink
  5400.                 .closest(\".photo-zoom\")
  5401.                 .find(\".heart-icon\")
  5402.                 .data(\"id\") || \"\";
  5403.             const sejourId =
  5404.               currentLink
  5405.                 .closest(\".photo-zoom\")
  5406.                 .find(\".heart-icon\")
  5407.                 .data(\"sejour-id\") || \"\";
  5408.             const imagePath =
  5409.               currentLink
  5410.                 .closest(\".photo-zoom\")
  5411.                 .find(\".heart-icon\")
  5412.                 .data(\"path\") || \"\";
  5413.             const imageDesc =
  5414.               currentLink
  5415.                 .closest(\".photo-zoom\")
  5416.                 .find(\".heart-icon\")
  5417.                 .data(\"description\") || \"\";
  5418.             const isFavorite = currentLink
  5419.               .closest(\".photo-zoom\")
  5420.               .find(\".heart-icon i\")
  5421.               .hasClass(\"bi-heart-fill\");
  5422.             const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  5423.             const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  5424.             const favoriteTooltip = isFavorite
  5425.               ? \"Retirer des favoris\"
  5426.               : \"Ajouter aux favoris\";
  5427.             const zoomControls = `
  5428.           <div class=\"mfp-zoom-controls\">
  5429.             <button class=\"zoom-btn zoom-out\" title=\"Zoom Out\"><i class=\"fa fa-search-minus\"></i></button>
  5430.             <button class=\"zoom-btn zoom-in\" title=\"Zoom In\"><i class=\"fa fa-search-plus\"></i></button>
  5431.           </div>
  5432.           <div class=\"mfp-favorite\">
  5433.             <button class=\"favorite-btn\" 
  5434.                     data-id=\"\${imageId}\" 
  5435.                     data-sejour-id=\"\${sejourId}\" 
  5436.                     data-path=\"\${imagePath}\" 
  5437.                     data-description=\"\${imageDesc}\"
  5438.                     title=\"\${favoriteTooltip}\">
  5439.               <i class=\"bi \${favoriteIconClass}\" style=\"color: \${favoriteIconColor}; text-shadow: 0px 0px 3px rgba(0,0,0,0.5);\"></i>
  5440.             </button>
  5441.           </div>
  5442.           <div class=\"mfp-counter\"></div>
  5443.         `;
  5444.             \$(\".mfp-content\").append(zoomControls);
  5445.             initializeZoomControls();
  5446.             initializeFavoriteButton();
  5447.             const intervalId = setInterval(() => {
  5448.               const newImageSrc = \$(\".mfp-img\").attr(\"src\");
  5449.               if (newImageSrc !== currentImageSrc) {
  5450.                 currentImageSrc = newImageSrc;
  5451.                 zoomCounter = 0;
  5452.                 lastClickPosition = { x: 50, y: 50 }; // Reset to center
  5453.                 attachZoomHandler(); // Reattach zoom handler to new image
  5454.                 \$(\".mfp-img\").css({
  5455.                   \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5456.                   transform: `scale(1)`,
  5457.                 });
  5458.                 // Update favorite button for the new image
  5459.                 updateFavoriteButton();
  5460.                 initializeZoomControls();
  5461.                 updateCounter();
  5462.               }
  5463.             }, 100);
  5464.             this.content.on(\"mfpClose\", function () {
  5465.               clearInterval(intervalId);
  5466.             });
  5467.             attachZoomHandler();
  5468.           },
  5469.           close: function () {
  5470.             \$(\".mfp-zoom-controls\").remove();
  5471.             \$(\".mfp-favorite\").remove();
  5472.             \$(\".mfp-counter\").remove();
  5473.             zoomCounter = 0;
  5474.           },
  5475.         },
  5476.       });
  5477.       function attachZoomHandler() {
  5478.         \$(\".mfp-img\")
  5479.           .off(\"click\")
  5480.           .on(\"click\", function (event) {
  5481.             event.stopPropagation(); // Prevent default navigation behavior
  5482.             // Calculate click coordinates relative to the image
  5483.             const imgOffset = \$(this).offset();
  5484.             const clickX = event.pageX - imgOffset.left;
  5485.             const clickY = event.pageY - imgOffset.top;
  5486.             const imgWidth = \$(this).width();
  5487.             const imgHeight = \$(this).height();
  5488.             // Calculate transform-origin based on click position
  5489.             lastClickPosition = {
  5490.               x: (clickX / imgWidth) * 100,
  5491.               y: (clickY / imgHeight) * 100,
  5492.             };
  5493.             // Cycle through zoom levels: 1x, 1.5x, 2x
  5494.             zoomCounter = (zoomCounter + 1) % 3;
  5495.             const zoomLevels = [1, 1.5, 2];
  5496.             const zoomLevel = zoomLevels[zoomCounter];
  5497.             \$(this).css({
  5498.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5499.               transform: `scale(\${zoomLevel})`,
  5500.             });
  5501.             updateZoomButtonState();
  5502.           });
  5503.       }
  5504.       function initializeZoomControls() {
  5505.         \$(\".mfp-zoom-controls .zoom-in\")
  5506.           .off(\"click\")
  5507.           .on(\"click\", function (event) {
  5508.             event.stopPropagation();
  5509.             zoomCounter = (zoomCounter + 1) % 3;
  5510.             const zoomLevels = [1, 1.5, 2];
  5511.             const zoomLevel = zoomLevels[zoomCounter];
  5512.             \$(\".mfp-img\").css({
  5513.               \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5514.               transform: `scale(\${zoomLevel})`,
  5515.             });
  5516.             updateZoomButtonState();
  5517.           });
  5518.         \$(\".mfp-zoom-controls .zoom-out\")
  5519.           .off(\"click\")
  5520.           .on(\"click\", function (event) {
  5521.             event.stopPropagation();
  5522.             if (zoomCounter > 0) {
  5523.               zoomCounter -= 1;
  5524.               const zoomLevels = [1, 1.5, 2];
  5525.               const zoomLevel = zoomLevels[zoomCounter];
  5526.               \$(\".mfp-img\").css({
  5527.                 \"transform-origin\": `\${lastClickPosition.x}% \${lastClickPosition.y}%`,
  5528.                 transform: `scale(\${zoomLevel})`,
  5529.               });
  5530.               updateZoomButtonState();
  5531.             } else {
  5532.               \$.magnificPopup.close();
  5533.             }
  5534.           });
  5535.       }
  5536.       function initializeFavoriteButton() {
  5537.         \$(\".mfp-favorite .favorite-btn\")
  5538.           .off(\"click\")
  5539.           .on(\"click\", function (event) {
  5540.             event.stopPropagation();
  5541.             const \$this = \$(this);
  5542.             const imageId = \$this.data(\"id\");
  5543.             const sejourId = \$this.data(\"sejour-id\");
  5544.             // Toggle favorite status
  5545.             const isFavorite = \$this.find(\"i\").hasClass(\"bi-heart-fill\");
  5546.             // Update the button appearance
  5547.             if (isFavorite) {
  5548.               \$this
  5549.                 .find(\"i\")
  5550.                 .removeClass(\"bi-heart-fill\")
  5551.                 .addClass(\"bi-heart\")
  5552.                 .css(\"color\", \"white\");
  5553.               \$this.attr(\"title\", \"Ajouter aux favoris\");
  5554.             } else {
  5555.               \$this
  5556.                 .find(\"i\")
  5557.                 .removeClass(\"bi-heart\")
  5558.                 .addClass(\"bi-heart-fill\")
  5559.                 .css(\"color\", \"#f56040\");
  5560.               \$this.attr(\"title\", \"Retirer des favoris\");
  5561.             }
  5562.             // Update the original heart icon in the gallery
  5563.             const originalHeartIcon = \$(
  5564.               `.heart-icon[data-id=\"\${imageId}\"]`
  5565.             ).find(\"i\");
  5566.             if (isFavorite) {
  5567.               originalHeartIcon
  5568.                 .removeClass(\"bi-heart-fill\")
  5569.                 .addClass(\"bi-heart\")
  5570.                 .css(\"color\", \"\");
  5571.             } else {
  5572.               originalHeartIcon
  5573.                 .removeClass(\"bi-heart\")
  5574.                 .addClass(\"bi-heart-fill\")
  5575.                 .css(\"color\", \"#f56040\");
  5576.             }
  5577.             // Make AJAX call to update favorite status in the backend using Parent routes
  5578.             \$.ajax({
  5579.               url: isFavorite ? \"/Parent/aSupprimerFav\" : \"/Parent/ajouterFav\",
  5580.               type: \"POST\",
  5581.               data: {
  5582.                 id: imageId,
  5583.                 idSejour: sejourId,
  5584.               },
  5585.               success: function (response) {
  5586.                 // Optional: Show a success message or handle response
  5587.                 console.log(\"Favorite status updated\", response);
  5588.               },
  5589.               error: function (error) {
  5590.                 console.error(\"Error updating favorite status\", error);
  5591.                 // Revert the icon change on error
  5592.                 if (isFavorite) {
  5593.                   \$this
  5594.                     .find(\"i\")
  5595.                     .removeClass(\"bi-heart\")
  5596.                     .addClass(\"bi-heart-fill\")
  5597.                     .css(\"color\", \"#f56040\");
  5598.                   originalHeartIcon
  5599.                     .removeClass(\"bi-heart\")
  5600.                     .addClass(\"bi-heart-fill\")
  5601.                     .css(\"color\", \"#f56040\");
  5602.                 } else {
  5603.                   \$this
  5604.                     .find(\"i\")
  5605.                     .removeClass(\"bi-heart-fill\")
  5606.                     .addClass(\"bi-heart\")
  5607.                     .css(\"color\", \"white\");
  5608.                   originalHeartIcon
  5609.                     .removeClass(\"bi-heart-fill\")
  5610.                     .addClass(\"bi-heart\")
  5611.                     .css(\"color\", \"\");
  5612.                 }
  5613.               },
  5614.             });
  5615.           });
  5616.       }
  5617.       function updateFavoriteButton() {
  5618.         // Get current image data from the current slide
  5619.         const currentSlide = \$.magnificPopup.instance.currItem.el;
  5620.         const photoZoom = currentSlide.closest(\".photo-zoom\");
  5621.         if (photoZoom.length) {
  5622.           const heartIcon = photoZoom.find(\".heart-icon\");
  5623.           const imageId = heartIcon.data(\"id\") || \"\";
  5624.           const sejourId = heartIcon.data(\"sejour-id\") || \"\";
  5625.           const imagePath = heartIcon.data(\"path\") || \"\";
  5626.           const imageDesc = heartIcon.data(\"description\") || \"\";
  5627.           const isFavorite = heartIcon.find(\"i\").hasClass(\"bi-heart-fill\");
  5628.           const favoriteIconClass = isFavorite ? \"bi-heart-fill\" : \"bi-heart\";
  5629.           const favoriteIconColor = isFavorite ? \"#f56040\" : \"white\";
  5630.           const favoriteTooltip = isFavorite
  5631.             ? \"Retirer des favoris\"
  5632.             : \"Ajouter aux favoris\";
  5633.           // Update the favorite button
  5634.           const \$favoriteBtn = \$(\".mfp-favorite .favorite-btn\");
  5635.           \$favoriteBtn.data(\"id\", imageId);
  5636.           \$favoriteBtn.data(\"sejour-id\", sejourId);
  5637.           \$favoriteBtn.data(\"path\", imagePath);
  5638.           \$favoriteBtn.data(\"description\", imageDesc);
  5639.           \$favoriteBtn.attr(\"title\", favoriteTooltip);
  5640.           \$favoriteBtn
  5641.             .find(\"i\")
  5642.             .removeClass(\"bi-heart bi-heart-fill\")
  5643.             .addClass(favoriteIconClass)
  5644.             .css(\"color\", favoriteIconColor);
  5645.         }
  5646.       }
  5647.       function updateZoomButtonState() {
  5648.         const zoomLevels = [1, 1.5, 2];
  5649.         const currentZoom = zoomLevels[zoomCounter];
  5650.         \$(\".zoom-in\").prop(\"disabled\", currentZoom === 2);
  5651.         \$(\".zoom-out\").prop(\"disabled\", currentZoom === 1);
  5652.       }
  5653.       function updateCounter() {
  5654.         const counterText = \$(\".mfp-counter\")
  5655.           .closest(\".mfp-content\")
  5656.           .find(\".mfp-counter\")
  5657.           .text();
  5658.         const matches = counterText.match(/(\\d+) of (\\d+)/);
  5659.         if (matches) {
  5660.           const currentIndex = matches[1];
  5661.           const totalImages = matches[2];
  5662.           \$(\".mfp-counter\").text(`\${currentIndex} of \${totalImages}`);
  5663.         }
  5664.       }
  5665.       // Add CSS for the favorite button and rounded image corners
  5666.       \$(\"<style>\")
  5667.         .prop(\"type\", \"text/css\")
  5668.         .html(
  5669.           `
  5670.       .mfp-favorite {
  5671.         position: absolute;
  5672.         top: 15px;
  5673.         left: 15px;
  5674.         z-index: 1046;
  5675.       }
  5676.       .favorite-btn {
  5677.         background: transparent;
  5678.         border: none;
  5679.         font-size: 24px;
  5680.         padding: 5px;
  5681.         cursor: pointer;
  5682.         outline: none;
  5683.       }
  5684.       .favorite-btn i {
  5685.         transition: all 0.3s ease;
  5686.       }
  5687.       .favorite-btn:hover i {
  5688.         transform: scale(1.2);
  5689.       }
  5690.       /* Rounded corners for zoomed images */
  5691.       .mfp-img {
  5692.         border-radius: 8px;
  5693.       }
  5694.       /* Make sure the container doesn't clip the rounded corners */
  5695.       .mfp-figure:after {
  5696.         border-radius: 8px;
  5697.       }
  5698.     `
  5699.         )
  5700.         .appendTo(\"head\");
  5701.     });
  5702.   </script>
  5703. <script>
  5704. document.addEventListener('DOMContentLoaded', function () {
  5705.   const openBtn = document.getElementById('openFavoritesBtn');
  5706.   const closeBtn = document.getElementById('closeSidebarBtn');
  5707.   const sidebar = document.getElementById('favoritesSidebar');
  5708.   const tbody = document.querySelector('#favoritesTable tbody');
  5709.   openBtn.addEventListener('click', async () => {
  5710.     try {
  5711.       const response = await fetch('/Parent/mes-favoris', {
  5712.         headers: {
  5713.           'Accept': 'application/json'
  5714.         }
  5715.       });
  5716.       const result = await response.json();
  5717.       if (!result.success || !Array.isArray(result.data)) {
  5718.         alert('Erreur lors du chargement des favoris.');
  5719.         return;
  5720.       }
  5721.       tbody.innerHTML = '';
  5722.       result.data.forEach((fav, index) => {
  5723.         const row = document.createElement('tr');
  5724.         row.innerHTML = `
  5725.           <td>\${index + 1}</td>
  5726.           <td><img src=\"\${fav.path}\" alt=\"favori\"></td>
  5727.           <td>\${fav.descreption || '—'}</td>
  5728.           <td>\${fav.created_at}</td>
  5729.         `;
  5730.         tbody.appendChild(row);
  5731.       });
  5732.       sidebar.classList.add('active');
  5733.     } catch (e) {
  5734.       console.error('Erreur réseau:', e);
  5735.       alert('Impossible de charger les favoris.');
  5736.     }
  5737.   });
  5738.   closeBtn.addEventListener('click', () => {
  5739.     sidebar.classList.remove('active');
  5740.   });
  5741. });
  5742. </script>
  5743.   <script>
  5744.         // Fonction pour vérifier et afficher l'alerte
  5745.         function checkFavorites() {
  5746.             if (favoriteCount >= 10) {
  5747.                 purchaseAlert.style.display = 'block'; // Affiche l'alerte
  5748.             } else {
  5749.                 purchaseAlert.style.display = 'none'; // Cache l'alerte si le nombre est réduit
  5750.             }
  5751.         }
  5752.     
  5753.         
  5754.         document.addEventListener('DOMContentLoaded', () => {
  5755.     const favoriteCount = {{ nblikes }};
  5756.     updateCardContent(favoriteCount);
  5757. });
  5758. function updateCardContent(favoriteCount) {
  5759.     const card = document.getElementById('dynamic-card');
  5760.     const cardContent = document.getElementById('dynamic-card-content');
  5761.     let produits = [];
  5762.     if (favoriteCount >= 20) {
  5763.         produits.push({
  5764.             titre: \"Album débloqué !\",
  5765.             bouton: \"Commander\",
  5766.             image: \"/images/produit/Album5sur5-3.jpg\",
  5767.             lien: \"{{ path('EditionAlbum') }}\"
  5768.         });
  5769.     }
  5770.     if (favoriteCount >= 12) {
  5771.         produits.push({
  5772.             titre: \"Pochette débloquée !\",
  5773.             bouton: \"Commander\",
  5774.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  5775.             lien: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\"
  5776.         });
  5777.     }
  5778.     if (favoriteCount >= 5) {
  5779.         produits.push({
  5780.             titre: \"Pack numérique débloqué !\",
  5781.             bouton: \"Commander\",
  5782.             image: \"/images/produit/photoNumerique.jpg\",
  5783.             lien: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 15}) }}\"
  5784.         });
  5785.     }
  5786. if (produits.length === 0) {
  5787.   cardContent.innerHTML = `
  5788.     <div style=\"position: relative; width: 100%; height: 140px; border-radius: 15px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.1);\">
  5789.       <div style=\"background-image: url('/images/produit/CoffretCadeau5sur5-2.jpg'); background-size: cover; background-position: center; width: 100%; height: 100%;\">
  5790.         <div style=\"position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; padding: 10px;\">
  5791.           <div style=\"
  5792.     margin-top: 35px;
  5793.     color: white;
  5794.     font-size: 15px;
  5795.     font-weight: bold;
  5796.     text-align: center;
  5797.     line-height: 1;
  5798.     text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);\">
  5799.             Ajoutez des favoris ❤️<br><span style=\"font-size: 16px; font-weight: normal;\">pour débloquer un souvenir à offrir 🎁</span>
  5800.           </div>
  5801.         </div>
  5802.       </div>
  5803.     </div>
  5804.   `;
  5805.         return;
  5806.     }
  5807.     cardContent.innerHTML = `
  5808.     <div class=\"splide\" id=\"dynamicSplide\">
  5809.       <div class=\"splide__track\">
  5810.         <ul class=\"splide__list\">
  5811.           \${produits.map(produit => `
  5812.             <li class=\"splide__slide\" style=\"position: relative;\">
  5813.               <img src=\"\${produit.image}\" alt=\"\${produit.titre}\" style=\"width: 100%; height: 150px; object-fit: cover; border-radius: 8px;\">
  5814.               <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;\">
  5815.                 <div style=\"font-weight: bold; font-size: 14px;\">\${produit.titre}</div>
  5816.                 <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}'\">
  5817.                   \${produit.bouton}
  5818.                 </button>
  5819.               </div>
  5820.             </li>
  5821.           `).join('')}
  5822.         </ul>
  5823.       </div>
  5824.     </div>
  5825.     `;
  5826.     // Monte le carrousel
  5827.     new Splide('#dynamicSplide', {
  5828.         type: 'loop',
  5829.         arrows: true,
  5830.         pagination: false,
  5831.         autoplay: true,
  5832.         interval: 4000,
  5833.         speed: 800,
  5834.     }).mount();
  5835. }
  5836.         function supprimerFavoris(\$id, \$idSejour) {
  5837.             // Vider l'élément coeur pour ce favori
  5838.             const coeurElement = \$('#coeur' + \$id);
  5839.             coeurElement.empty();
  5840.             // Ajout d'une animation sur le bouton favori
  5841.             const favoriteButton = document.querySelector('.fav-button');
  5842.             if (favoriteButton) {
  5843.                 favoriteButton.classList.add('active');
  5844.                 // Retirer l'animation après qu'elle soit jouée
  5845.                 setTimeout(() => {
  5846.                     favoriteButton.classList.remove('active');
  5847.                 }, 600); // La durée doit correspondre à celle de l'animation
  5848.             }
  5849.             // Mise à jour de l'icône coeur
  5850.             const clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  5851.             coeurElement.html(
  5852.                 `<i class=\"bi bi-heart \${clas}\" ></i>`
  5853.             );
  5854.             // Mettre à jour le compteur des favoris
  5855.             const likeCountLabel = document.getElementById('likeCount');
  5856.             const likeMesFavLabel = document.getElementById('mesFavCount');
  5857.             
  5858.             let newCount = 0;
  5859.             
  5860.             if (likeCountLabel) {
  5861.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  5862.                 newCount = Math.max(0, currentCount - 1); // Empêche le compteur d'aller en dessous de 0
  5863.                 likeCountLabel.textContent = newCount;
  5864.             
  5865.                 // Mettre à jour la valeur dans l'input hidden
  5866.                 const nbFavCurrentInput = \$('#nbFavCurrent');
  5867.                 if (nbFavCurrentInput.length) {
  5868.                     nbFavCurrentInput.val(newCount);
  5869.                 }
  5870.             }
  5871.             
  5872.             // Synchroniser mesFavCount avec likeCount
  5873.             if (likeMesFavLabel) {
  5874.                 if (likeCountLabel) {
  5875.                     // Utiliser la valeur de likeCount pour synchroniser
  5876.                     likeMesFavLabel.textContent = newCount;
  5877.                 } else {
  5878.                     // Si likeCount n'existe pas, décrémenter directement mesFavCount
  5879.                     let currentFavCount = parseInt(likeMesFavLabel.textContent.trim(), 10) || 0;
  5880.                     newCount = Math.max(0, currentFavCount - 1);
  5881.                                          likeMesFavLabel.textContent = newCount;
  5882.                  }
  5883.              }
  5884.              
  5885.              // Mettre à jour l'alerte immédiatement
  5886.              setTimeout(() => {
  5887.                  const finalCount = getCurrentFavoriteCount();
  5888.                  if (typeof updatePurchaseAlert === 'function') {
  5889.                      updatePurchaseAlert(finalCount);
  5890.                  }
  5891.              }, 50);
  5892.             // Préparation des données pour l'Ajax
  5893.             const \$_data = { 'id': \$id, 'idSejour': \$idSejour };
  5894.             // Appel Ajax pour supprimer le favori
  5895.             \$.ajax({
  5896.                 type: \"POST\",
  5897.                 url: \"{{ path('Supprimer_fav') }}\",
  5898.                 data: \$_data,
  5899.                 success: function () {
  5900.                     // Réactiver les icônes après succès
  5901.                     \$('.IconDelete').each(function () {
  5902.                         \$(this).css('pointer-events', '');
  5903.                     });
  5904.                     
  5905.                     // Mettre à jour l'alerte avec le nouveau nombre
  5906.                     const finalCount = getCurrentFavoriteCount();
  5907.                     if (typeof updatePurchaseAlert === 'function') {
  5908.                         updatePurchaseAlert(finalCount);
  5909.                     }
  5910.                 },
  5911.                 error: function (xhr, status, error) {
  5912.                     console.error('Erreur lors de la suppression du favori :', error);
  5913.                 }
  5914.             });
  5915.         }
  5916.         function AddFavoris(\$id, \$idSejour, \$urlimg, \$description) {
  5917.             // Update heart icon
  5918.             \$('#coeur' + \$id).empty();
  5919.             var clas = \$('.IconImag6').hasClass('active') ? \"IconDelete IconDeletesix\" : \"IconDelete\";
  5920.             \$('#coeur' + \$id).html(\"<i class=\\\"bi bi-heart-fill favSelect \" + clas + \"\\\" )\\\"></i>\");
  5921.             
  5922.             // Update counters UNIQUEMENT
  5923.             const likeCountLabel = document.getElementById('likeCount');
  5924.             const likeMesFavLabel = document.getElementById('mesFavCount');
  5925.             
  5926.             if (likeCountLabel) {
  5927.                 let currentCount = parseInt(likeCountLabel.textContent.trim(), 10) || 0;
  5928.                 currentCount++;
  5929.                 likeCountLabel.textContent = currentCount;
  5930.                 
  5931.                 // Mettre à jour le compteur des favoris dans le titre
  5932.                 if (likeMesFavLabel) {
  5933.                     likeMesFavLabel.textContent = currentCount;
  5934.                 }
  5935.                 
  5936.                 // Mettre à jour l'input hidden
  5937.                 const nbFavCurrentInput = document.getElementById('nbFavCurrent');
  5938.                 if (nbFavCurrentInput) {
  5939.                     nbFavCurrentInput.value = currentCount;
  5940.                 }
  5941.             }
  5942.             
  5943.             // Update other counters
  5944.             var \$total = parseInt(\$(\"#totalLike\").html()) + 1;
  5945.             \$(\"#totalLike\").html(\$total);
  5946.             \$(\"#totalLikeTitle\").html(\$total);
  5947.             \$(\"#totalLikeMobile\").html(\$total);
  5948.             
  5949.             // Add favorite button animation
  5950.             const favoriteButton = document.querySelector('.fav-button');
  5951.             if (favoriteButton) {
  5952.                 favoriteButton.classList.add('active');
  5953.                 setTimeout(() => {
  5954.                     favoriteButton.classList.remove('active');
  5955.                 }, 600);
  5956.             }
  5957.             var \$data = { 'id': \$id, 'idSejour': \$idSejour };
  5958.             \$.ajax({
  5959.                 type: \"POST\",
  5960.                 url: \"{{ path('Ajouter_fav') }}\",
  5961.                 data: \$data,
  5962.                 success: function () {
  5963.                     \$('.IconDelete').each(function () {
  5964.                         \$(this).css('pointer-events', '');
  5965.                     });
  5966.                     if (\$description === undefined) {
  5967.                         \$description = ''; // Set it to an empty string
  5968.                     }
  5969.                     \$('.rowMaselection').append(
  5970.                         '<div class=\"column\" id=\"column-' + \$id + '\">'+
  5971.                         '<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>'+
  5972.                         '<a class=\"photo-zoom\">'+
  5973.                         '<img data-idAtach=\"'+\$id+'\" id=\"'+\$idSejour+'\" src=\"'+\$urlimg+'\"></a>'+
  5974.                         (\$description ? '<h4 id=\"commint\" class=\"titleHeadPhoto\">'+\$description+'</h4>' : '')+ // Only add the <h4> if \$description is not empty
  5975.                         '</div>'
  5976.                     );
  5977.                     // Directly update nbLikes count in the header
  5978.                     var currentNbLikes = parseInt(\$('#favoris-link-Accueilpayment .nbrpanier').text());
  5979.                     var newNbLikes = currentNbLikes + 1;
  5980.                     \$('#favoris-link-Accueilpayment .nbrpanier').text(newNbLikes);
  5981.                     
  5982.                     // Mettre à jour l'alerte avec le nouveau nombre
  5983.                     const finalCount = getCurrentFavoriteCount();
  5984.                     if (typeof updatePurchaseAlert === 'function') {
  5985.                         updatePurchaseAlert(finalCount);
  5986.                     }
  5987.                 },
  5988.                 error: function (xhr, status, error) {
  5989.                     console.error('Error:', error);
  5990.                 }
  5991.             });
  5992.         }
  5993.         \$(document).on('click', '.bi-heart, .bi-heart-fill', function () {
  5994.         const heartIcon       = \$(this);
  5995.         const heartContainer  = heartIcon.closest('.heart-icon');
  5996.         // Extract data attributes
  5997.         const attachmentId    = heartContainer.data('id');
  5998.         const sejourId        = heartContainer.data('sejour-id');
  5999.         const path            = heartContainer.data('path');
  6000.         const description     = heartContainer.data('description');
  6001.         const isFavorite      = heartIcon.hasClass('bi-heart-fill');
  6002.         if (isFavorite) {
  6003.             // Remove from favorites
  6004.             supprimerFavoris(attachmentId, sejourId);
  6005.         } else {
  6006.             // Add to favorites
  6007.             AddFavoris(attachmentId, sejourId, path, description);
  6008.         }
  6009.         // Update UI components after the action (sans double comptage)
  6010.         setTimeout(function() {
  6011.             const likeCountLabel = document.getElementById('likeCount');
  6012.             
  6013.             if (likeCountLabel) {
  6014.                 const currentCount = parseInt(likeCountLabel.textContent, 10) || 0;
  6015.                 
  6016.                 // Update UI components seulement
  6017.                 updateCardContent(currentCount);
  6018.                 updateFavoritesSidebar();
  6019.                 \$(\"#close-favorites-btn\").click();
  6020.             }
  6021.         }, 50);
  6022.     });
  6023.         // Ajoutez les événements sur les icônes de cœur
  6024.         document.querySelectorAll('.IconDelete').forEach((icon) => {
  6025.             icon.addEventListener('click', (event) => {
  6026.                 const isFavorite = icon.classList.contains('bi-heart-fill');
  6027.                 if (isFavorite) {
  6028.                     removeFavorite();
  6029.                     icon.classList.remove('bi-heart-fill');
  6030.                     icon.classList.add('bi-heart');
  6031.                 } else {
  6032.                     addFavorite();
  6033.                     icon.classList.remove('bi-heart');
  6034.                     icon.classList.add('bi-heart-fill');
  6035.                 }
  6036.             });
  6037.         });
  6038.         // Vérifie l'état initial
  6039.         checkFavorites();
  6040.         
  6041.         
  6042.         // Appeler la synchronisation au chargement de la page
  6043.         \$(document).ready(function() {
  6044.             setTimeout(syncFavoriteCounters, 500); // Petit délai pour s'assurer que le DOM est prêt
  6045.         });
  6046.   </script>
  6047.   <!-- Initialisation -->
  6048.   <script>
  6049.     AOS.init({
  6050.       duration: 800, // Duration of animations in milliseconds
  6051.       easing: \"ease-in-out\", // Animation timing function
  6052.     });
  6053.     document.addEventListener(\"DOMContentLoaded\", function () {
  6054.       const dateCards = document.querySelectorAll(\".date-card\");
  6055.       const sections = document.querySelectorAll(\".collapse\");
  6056.       dateCards.forEach((card) => {
  6057.         card.addEventListener(\"click\", function () {
  6058.           // Supprimer les classes actives des autres cartes et sections
  6059.           dateCards.forEach((c) => c.classList.remove(\"active\"));
  6060.           sections.forEach((s) => s.classList.remove(\"show\"));
  6061.           // Ajouter la classe active à la carte cliquée
  6062.           this.classList.add(\"active\");
  6063.           // Récupérer la cible et afficher la bonne section
  6064.           const targetId = this.getAttribute(\"data-bs-target\");
  6065.           const targetSection = document.querySelector(targetId);
  6066.           if (targetSection) {
  6067.             targetSection.classList.add(\"show\");
  6068.           }
  6069.         });
  6070.       });
  6071.     });
  6072.     document.addEventListener(\"DOMContentLoaded\", function () {
  6073.       // Initialisation du carrousel Splide
  6074.       var splide = new Splide(\"#imageSlider\", {
  6075.         type: \"loop\",
  6076.         perPage: 1,
  6077.         autoplay: true,
  6078.         interval: 6000,
  6079.         pauseOnHover: false,
  6080.         pauseOnFocus: false,
  6081.         pagination: false, // Désactive la pagination
  6082.         arrows: false,
  6083.       });
  6084.       splide.mount();
  6085.       // Fonction pour faire défiler automatiquement vers la section suivante avec un ajustement personnalisé de la hauteur
  6086.       function scrollToNextSection() {
  6087.         const targetSection = document.getElementById(\"scrollTarget\");
  6088.         if (targetSection) {
  6089.           const targetPosition =
  6090.             targetSection.getBoundingClientRect().top + window.scrollY; // Position de la section
  6091.           const adjustedPosition = targetPosition - 50; // Réduit la hauteur du scroll de 150px (ajustez selon vos besoins)
  6092.           // Scroll vers la position ajustée
  6093.           window.scrollTo({
  6094.             top: adjustedPosition,
  6095.             behavior: \"smooth\",
  6096.           });
  6097.         }
  6098.       }
  6099.       // Démarrer le timer pour le scroll automatique après 10 secondes
  6100.       setTimeout(scrollToNextSection, 5000); // 10 secondes
  6101.     });
  6102.   </script>
  6103.   <script>
  6104.         document.addEventListener('DOMContentLoaded', function () {
  6105.             var myModal = new bootstrap.Modal(document.getElementById('PubProd'));
  6106.             myModal.show();
  6107.         });
  6108.         // Function to close the modal
  6109.     function closeModal() {
  6110.         var myModal = bootstrap.Modal.getInstance(document.getElementById('PubProd'));
  6111.         if (myModal) {
  6112.             myModal.hide();
  6113.         }
  6114.     }
  6115.     const favoriteButton = document.querySelector('.fav-button');
  6116.     favoriteButton.addEventListener('click', () => {
  6117.         // Ajouter la classe 'active' pour déclencher l'éclat
  6118.         favoriteButton.classList.add('active');
  6119.         // Retirer l'animation après qu'elle soit jouée
  6120.         setTimeout(() => {
  6121.             favoriteButton.classList.remove('active');
  6122.         }, 600); // La durée doit correspondre à celle de l'animation
  6123.     });
  6124.     
  6125.     //const HeartAddButton = document.querySelector('.IconDelete');
  6126.     \$(\".IconDelete\").on('click', () => {
  6127.         // Ajouter la classe 'active' pour déclencher l'éclat
  6128.         favoriteButton.classList.add('active');
  6129.         // Retirer l'animation après qu'elle soit jouée
  6130.         setTimeout(() => {
  6131.             favoriteButton.classList.remove('active');
  6132.         }, 600); // La durée doit correspondre à celle de l'animation
  6133.     });
  6134.     \$(document).ready(function() {
  6135.         // Attach click event to collapse triggers
  6136.         const lastCard = \$('.date-card.modern-card.active');
  6137.         const lastTargetId = lastCard.attr('data-bs-target');
  6138.         if (lastTargetId) {
  6139.             \$(lastTargetId).collapse('show'); // Expand the last collapse section
  6140.             LoadImagesCloud(\$(lastTargetId)); // Load images for the last day
  6141.         }
  6142.         \$('[data-bs-toggle=\"collapse\"]').on('click', function() {
  6143.             var targetId = \$(this).attr('data-bs-target'); // Get the target ID
  6144.             \$('.date-card.modern-card').removeClass('active'); // Remove 'active' class from all cards
  6145.             \$(this).addClass('active'); // Add 'active' class to the clicked card
  6146.             LoadImagesCloud(\$(targetId)); // Ensure this function works as expected
  6147.                // Hide all other collapses except the one clicked
  6148.                \$('[data-bs-target]').each(function() {
  6149.                 var currentTargetId = \$(this).attr('data-bs-target');
  6150.                 // If the current collapse is not the one clicked, hide it
  6151.                 if (currentTargetId !== targetId) {
  6152.                     \$(currentTargetId).collapse('hide');
  6153.                     //\$('[data-bs-toggle=\"collapse\"]').removeClass('active'); // Remove active class from all cards
  6154.                     //Modifier leurs style en non active aussi
  6155.                 }
  6156.             });
  6157.         });
  6158.     });
  6159.     function rotateIcone(iconId) {
  6160.         // Use the icon ID to target the specific element
  6161.         var icon = \$('#' + iconId);
  6162.         // Toggle the rotate-right class to apply rotation
  6163.         if (icon.hasClass('rotate-right')) {
  6164.             icon.removeClass('rotate-right'); // Remove rotation class
  6165.         } else {
  6166.             icon.addClass('rotate-right'); // Add rotation class
  6167.         }
  6168.     }
  6169.             \$(document).ready(function () {
  6170.                 \$total1 = parseInt(\$(\"#esphoto\").find('strong').html().replace('(', '').replace(')', ''));
  6171.                 \$('[data-bs-toggle=\"tooltip\"]').tooltip();
  6172.                 {% if app.session.get(\"paymentmoniteco\") %}
  6173.                 {% if app.session.get(\"paymentmoniteco\") == \"succses\" %}
  6174.                 Swal.fire({
  6175.                     icon: 'success',
  6176.                     title: ' succès ',
  6177.                     text: 'votre commande est validée'
  6178.                 });
  6179.                 {% endif %}
  6180.                 {% endif %}
  6181.                 if (\$total1 > 0) {
  6182.                     \$('.iconeFleche').first().click();
  6183.                     //  \$([document.documentElement, document.body]).animate({
  6184.                     //  scrollTop: \$('.iconeFleche').last().offset().top
  6185.                     //  }, );
  6186.                 }
  6187.                 else {
  6188.                     \$(window).scrollTop(0);
  6189.                 }
  6190.                 var slider = \$('.responsive').slick({
  6191.                     infinite: true,
  6192.                     slidesToShow: 1,
  6193.                     slidesToScroll: 1,
  6194.                     autoplay: true,
  6195.                     autoplaySpeed: 4000,
  6196.                     pauseOnFocus: false,
  6197.                     pauseOnHover: false,
  6198.                     draggable: false,
  6199.                     fade: true
  6200.                 });
  6201.                 \$('.responsive').css('display', 'block');
  6202.                 \$('.namePRD').css('display', 'block');
  6203.                 var currSlide = 0;
  6204.                 var nextSlide = 0;
  6205.                 slider.on('afterChange', function (event, slick, currentSlide) {
  6206.                     console.log(typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\");
  6207.                     if (typeof (\$('.slick-active .slick-current').find('.imgproduit2')) != \"undefined\") {
  6208.                         setTimeout(function () {
  6209.                             \$('.slick-active .imgproduit1').removeClass('animated fadeIn');
  6210.                             \$('.slick-active .imgproduit1').addClass('animated fadeOut');
  6211.                             \$('.slick-active .imgproduit1').css('display', 'none');
  6212.                             \$('.slick-active .imgproduit2').css('display', 'block');
  6213.                             \$('.slick-active .imgproduit2').removeClass('animated fadeOut');
  6214.                             \$('.slick-active .imgproduit2').addClass('animated fadeIn');
  6215.                         }, 2000);
  6216.                     }
  6217.                 });
  6218.                 slider.on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  6219.                     currSlide = currentSlide;
  6220.                     \$('.imgproduit2').each(function () {
  6221.                         \$(this).removeClass('animated fadeIn');
  6222.                         \$(this).addClass('animated fadeOut');
  6223.                         \$(this).css('display', 'none');
  6224.                     });
  6225.                     \$('.imgproduit1').each(function () {
  6226.                         \$(this).css('display', 'block');
  6227.                         \$(this).removeClass('animated fadeOut');
  6228.                         \$(this).addClass('animated fadeIn');
  6229.                     });
  6230.                 });
  6231.                 \$('.columnPub').each(function () {
  6232.                     \$(this).slick({
  6233.                         infinite: true,
  6234.                         speed: 50,
  6235.                         fade: true,
  6236.                         slidesToShow: 1,
  6237.                         slidesToScroll: 1,
  6238.                         autoplay: true,
  6239.                         pauseOnFocus: false,
  6240.                         pauseOnHover: false,
  6241.                         draggable: false
  6242.                     });
  6243.                     \$(this).css('display', 'block');
  6244.                 });
  6245.                 \$(\"#offrePack\").click();
  6246.                 {%if app.user.showpubprod != 'false' %}
  6247.                 \$('#btnPubProd').click();
  6248.                 \$('.modal-backdrop').css('background-color', 'rgba(0, 0, 0, 0.2)');
  6249.                 {% endif %}
  6250.             });
  6251.             \$(\"#closeImage\").click(function () {
  6252.                 \$('#myModalImage').css('display', \"none\");
  6253.             });
  6254.             \$.ajax({
  6255.                 type: \"POST\",
  6256.                 url: \"{{ path(\"delateSession_parent\") }}\",
  6257.                 success: function () { }
  6258.             });
  6259.             function afficheDiv(elem) {
  6260.                 \$('.nav-link').each(function () {
  6261.                     \$(this).removeClass('active');
  6262.                 });
  6263.                 elem.addClass('active');
  6264.                 if (elem.attr('id') === \"esphoto\" || elem.attr('id') === \"esphotoMobile\") {
  6265.                     \$(\"#espacphoto\").show();
  6266.                     \$(\"#espacemessage\").hide();
  6267.                     \$(\"#espaceMa_selection\").hide();
  6268.                     pageMenu = 'MonSejour'
  6269.                     \$(this).addClass('active');
  6270.                    \$('#imageActifphoto').css('display', 'block');
  6271.                      \$('#imagenoActifphoto').css('display', 'none');
  6272.                    \$('#VocalActivee').css('display', 'none');
  6273.                      \$('#noActifVocal').css('display', 'block');
  6274.                 }
  6275.                 if (elem.attr('id') === \"esmessage\" || elem.attr('id') === \"esmessageMobile\") {
  6276.                     \$(\"#espacphoto\").hide();
  6277.                     \$(\"#espaceMa_selection\").hide();
  6278.                     \$(\"#espacemessage\").show();
  6279.                     pageMenu = 'BoiteVocale'
  6280.                     \$(\"#espaceMa_selection\").hide();
  6281.                     \$(this).addClass('active');
  6282.                   \$('#imageActifphoto').css('display', 'none');
  6283.                      \$('#imagenoActifphoto').css('display', 'block');
  6284.                    \$('#VocalActivee').css('display', 'block');
  6285.                      \$('#noActifVocal').css('display', 'none');
  6286.                 }
  6287.                 if (elem.attr('id') === \"esselection\" || elem.attr('id') === \"esselectionMobile\") {
  6288.                     \$(\"#espacphoto\").hide();
  6289.                     \$(\"#espacemessage\").hide();
  6290.                     \$(\"#espaceMa_selection\").show();
  6291.                     \$(homeNavmob).removeClass('bi bi-house-door-fill');
  6292.                     \$(homeNavmob).addClass('bi bi-house-door');
  6293.                     \$(micromob).removeClass('bi bi-mic-fill');
  6294.                     \$(micromob).addClass('bi bi-mic');
  6295.                     \$(selecNavmob).removeClass('bi bi-heart');
  6296.                     \$(selecNavmob).addClass('bi bi-heart-fill');
  6297.                 }
  6298.             }
  6299.             function LoadImagesCloud(\$element) {
  6300.                 \$element.find('.photo-zoom img').each(function (\$this) {
  6301.                     if (\$(this).attr('data-src') != \$(this).attr('src')) {
  6302.                         \$(this).attr('src', \$(this).attr('data-src'));
  6303.                     }
  6304.                 });
  6305.             }
  6306.       function afficheDivFooterMobile(elem) {
  6307.              if(elem =='esphotoMobile') {
  6308.                    \$(\"#espacphoto\").show();
  6309.                     \$(\"#espacemessage\").hide();
  6310.                     \$(\"#espaceMa_selection\").hide();
  6311.                     \$(\"#storevide\").hide();
  6312.                     \$(\"#storefull\").show();
  6313.                     \$(\"#fullphoto\").show();
  6314.                     \$(\"#videphoto\").hide()
  6315.                     \$(\"#vocalfull\").hide();
  6316.                     \$(\"#vocalvide\").show();
  6317.                 }
  6318.                 if (elem === \"esmessageMobile\" ) {
  6319.                     \$(\"#espacphoto\").hide();
  6320.                     \$(\"#espacemessage\").show();
  6321.                     \$(\"#espaceMa_selection\").hide();
  6322.                     \$(\"#storefull\").hide();
  6323.                     \$(\"#storevide\").show();
  6324.                     \$(\"#fullphoto\").hide();
  6325.                     \$(\"#videphoto\").show()
  6326.                     \$(\"#vocalfull\").show();
  6327.                     \$(\"#vocalvide\").hide();
  6328.                 }
  6329.             }
  6330.             function permutation(elem) {
  6331.                 \$(\".IconImag\").each(function () {
  6332.                     \$(this).removeClass('active');
  6333.                 });
  6334.                 elem.addClass(\"active\");
  6335.             }
  6336.             function per(elem) {
  6337.                 \$(\".list-group-item \").each(function () {
  6338.                     \$(this).removeClass('show');
  6339.                 });
  6340.                 elem.addClass(\"active\");
  6341.                 \$(\"#iconeFleche\").addClass('active');
  6342.             }
  6343.            function setidattach(id) {
  6344.                 \$(\"#idattachipmut\").val(id)
  6345.             }
  6346.             var ParentAjouterALL_fav = \"{{ path('ParentAjouterALL_fav') }}\";
  6347.             function AllFavoris(\$idSejour) {
  6348.                 \$('#SelectALL').html('Désélectionner tout');
  6349.                 \$('#SelectALL').css('pointer-events', 'none');
  6350.                 \$('#SelectALL').css('opacity', '0.5');
  6351.                 \$('#SelectALL').css('cursor', 'no-drop');
  6352.                 \$('#SelectALL1').html('Désélectionner tout');
  6353.                 \$('#SelectALL1').css('pointer-events', 'none');
  6354.                 \$('#SelectALL1').css('opacity', '0.5');
  6355.                 \$('#SelectALL1').css('cursor', 'no-drop');
  6356.                 \$data = { 'idSejour': \$idSejour }
  6357.                 \$.ajax({
  6358.                     type: \"POST\",
  6359.                     url: \"{{ path('ParentAjouterALL_fav') }}\",
  6360.                     data: \$data,
  6361.                     success: function () {
  6362.                         location.reload();
  6363.                     }
  6364.                 });
  6365.             }
  6366.             function RemoveAllFavoris(\$idSejour) {
  6367.                 \$('#SelectALL').html('Sélectionner tout');
  6368.                 \$('#SelectALL').css('pointer-events', 'none');
  6369.                 \$('#SelectALL').css('opacity', '0.5');
  6370.                 \$('#SelectALL').css('cursor', 'no-drop');
  6371.                 \$('#SelectALL1').html('Sélectionner tout');
  6372.                 \$('#SelectALL1').css('pointer-events', 'none');
  6373.                 \$('#SelectALL1').css('opacity', '0.5');
  6374.                 \$('#SelectALL1').css('cursor', 'no-drop');
  6375.                 \$data = { 'idSejour': \$idSejour }
  6376.                 \$.ajax({
  6377.                     type: \"POST\",
  6378.                     url: \"{{ path('ParentSupprimer_ALLfav') }}\",
  6379.                     data: \$data,
  6380.                     success: function () {
  6381.                         location.reload();
  6382.                     }
  6383.                 });
  6384.             }
  6385.             // Get the elements with class=\"column\"
  6386.             var elements = document.getElementsByClassName(\"column\");
  6387.             // Declare a \"loop\" variable
  6388.             var i;
  6389.             // Full-width images
  6390.             function Four() {
  6391.                 for (i = 0; i < elements.length; i++) {
  6392.                     elements[i].style.flex = \"0 0 25%\";
  6393.                 }
  6394.                 \$('.IconDelete').attr('class', 'IconDelete ');
  6395.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  6396.                 \$('.localistaion').css('visibility', 'visible');
  6397.                 \$('.localistaion').attr('class', 'localistaion');
  6398.                 \$('.legend').css('visibility', 'visible');
  6399.                 \$('.columnPub').each(function () {
  6400.                     \$(this).css('max-width', '25%');
  6401.                     \$(this).find('.slick-list').removeClass('miniature');
  6402.                     \$(this).find('.single_service').removeClass('miniature');
  6403.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  6404.                 });
  6405.             }
  6406.             // Two images side by side
  6407.             function six() {
  6408.                 for (i = 0; i < elements.length; i++) {
  6409.                     elements[i].style.flex = \"0 0 15%\";
  6410.                 }
  6411.                 \$('.column').css('padding', '0px 10px 0px 0px');
  6412.                 \$('.localistaion').attr('class', 'localistaion localistaionsix');
  6413.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletesix');
  6414.                 \$('.legend').css('visibility', 'visible');
  6415.                 \$('.photo-zoom ').attr('class', 'photo-zoom heightimg');
  6416.                 \$('.columnPub').each(function () {
  6417.                     \$(this).css('max-width', '15%');
  6418.                     \$(this).find('.slick-list').addClass('miniature');
  6419.                     \$(this).find('.single_service').addClass('miniature');
  6420.                     \$(this).find('.bottomdivpub').addClass('miniature');
  6421.                 });
  6422.             }
  6423.             // Four images side by side
  6424.             function two() {
  6425.                 for (i = 0; i < elements.length; i++) {
  6426.                     elements[i].style.flex = \"0 0 40%\";
  6427.                 }
  6428.                 \$('.column').css('padding', '14px 10px');
  6429.                 \$('.column').css('max-width', '40%');
  6430.                 \$('.localistaion').css('visibility', 'visible');
  6431.                 \$('.legend').css('visibility', 'visible');
  6432.                 \$('.photo-zoom ').attr('class', 'photo-zoom');
  6433.                 \$('.localistaion').attr('class', 'localistaion localistaiontwo');
  6434.                 \$('.IconDelete').attr('class', 'IconDelete IconDeletetwo');
  6435.                 \$('.legend').attr('class', 'legend legendtwo');
  6436.                 \$('.columnPub').each(function () {
  6437.                     \$(this).css('max-width', '40%');
  6438.                     \$(this).find('.slick-list').removeClass('miniature');
  6439.                     \$(this).find('.single_service').removeClass('miniature');
  6440.                     \$(this).find('.bottomdivpub').removeClass('miniature');
  6441.                 });
  6442.             }
  6443.             function hidePopPub() {
  6444.                 \$('.modal-backdrop').css('background-color', 'rgb(0, 0, 0)');
  6445.             }
  6446.             function changeHref(elem, newhref) {
  6447.                 \$(elem).parent().attr('href', newhref);
  6448.             }
  6449.             function VerifNbLikes(nblikes) {
  6450.                 \$('#allerAlaBoutique').click();
  6451.             }
  6452.     function handleMenuClick(menuId, pageMenu) {
  6453.         // Reset all icons
  6454.         document.getElementById('imagenoActifphoto').style.display = 'block';
  6455.         document.getElementById('imageActifphoto').style.display = 'none';
  6456.         document.getElementById('nofavorisVocal').style.display = 'block';
  6457.         document.getElementById('favorisActive').style.display = 'none';
  6458.         document.getElementById('noActifVocal').style.display = 'block';
  6459.         document.getElementById('VocalActivee').style.display = 'none';
  6460.         // Set selected icon
  6461.         if (menuId === 'photo') {
  6462.             document.getElementById('imagenoActifphoto').style.display = 'none';
  6463.             document.getElementById('imageActifphoto').style.display = 'block';
  6464.         } else if (menuId === 'selection') {
  6465.             document.getElementById('nofavorisVocal').style.display = 'none';
  6466.             document.getElementById('favorisActive').style.display = 'block';
  6467.         } else if (menuId === 'message') {
  6468.             document.getElementById('noActifVocal').style.display = 'none';
  6469.             document.getElementById('VocalActivee').style.display = 'block';
  6470.         }
  6471.         // Handle any other necessary logic
  6472.         \$('#list-tab-photo').removeClass('show');
  6473.         \$('#list-tab-message').removeClass('show');
  6474.         afficheDiv(\$(`#\${menuId}`));
  6475.     }
  6476.   </script>
  6477.   <script>
  6478.     \$(document).ready(function () {
  6479.       \$(\"#PubProd\").on(\"hidden.bs.modal\", function () {
  6480.         \$(document).trigger(\"modalClosed\");
  6481.       });
  6482.     });
  6483.   </script>
  6484.   <script>
  6485.     \$(document).ready(function () {
  6486.       \$(\"#noShow\").on(\"change\", function () {
  6487.         if (\$(this).is(\":checked\")) {
  6488.           \$.ajax({
  6489.             url: \"/Parent/showpub\",
  6490.             type: \"POST\",
  6491.             dataType: \"json\",
  6492.             success: function (response) {
  6493.               if (response.status === \"success\") {
  6494.                 console.log(\"User showpubprod updated successfully.\");
  6495.               } else {
  6496.                 console.log(\"Error:\", response.message);
  6497.               }
  6498.             },
  6499.             error: function (xhr, status, error) {
  6500.               console.log(\"AJAX Error:\", error);
  6501.             },
  6502.           });
  6503.         }
  6504.       });
  6505.     });
  6506.   </script>
  6507. </div>
  6508. <!-- Script pour la sidebar des favoris -->
  6509. <script>
  6510.   \$(document).ready(function() {
  6511.     // Ouvrir la sidebar
  6512.     \$(\"#openFavoritesSidebar\").click(function() {
  6513.       \$(\".favorites-sidebar\").addClass(\"open\");
  6514.       loadFavorites();
  6515.     });
  6516.     
  6517.     // Fermer la sidebar
  6518.     \$(\".favorites-close\").click(function() {
  6519.       \$(\".favorites-sidebar\").removeClass(\"open\");
  6520.     });
  6521.     
  6522.     // Charger les favoris
  6523.     function loadFavorites() {
  6524.       \$.ajax({
  6525.         url: \"/Parent/mes-favoris\",
  6526.         type: \"GET\",
  6527.         dataType: \"json\",
  6528.         beforeSend: function() {
  6529.           \$(\"#favorites-grid\").html(\"<div style='text-align:center'>Chargement...</div>\");
  6530.         },
  6531.         success: function(data) {
  6532.           \$(\"#favorites-grid\").empty();
  6533.           
  6534.           if (data.data && data.data.length > 0) {
  6535.             \$(\"#favorites-empty-state\").hide();
  6536.             
  6537.             \$.each(data.data, function(i, fav) {
  6538.               var item = \$(\"<div class='favorite-item'></div>\");
  6539.               var img = \$(\"<img>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  6540.               var overlay = \$(\"<div class='favorite-overlay'></div>\");
  6541.         
  6542.               
  6543.               btn.click(function(e) {
  6544.                 e.preventDefault();
  6545.                 e.stopPropagation();
  6546.                 removeFavorite(fav.id);
  6547.               });
  6548.               
  6549.               overlay.append(btn);
  6550.               item.append(img).append(overlay);
  6551.               \$(\"#favorites-grid\").append(item);
  6552.             });
  6553.             
  6554.             \$(\"#favorites-counter\").text(data.data.length);
  6555.             var percentage = (data.data.length / 10) * 100;
  6556.             \$(\"#favorites-progress\").css(\"width\", percentage + \"%\");
  6557.             
  6558.           } else {
  6559.             \$(\"#favorites-empty-state\").show();
  6560.             \$(\"#favorites-counter\").text(\"0\");
  6561.             \$(\"#favorites-progress\").css(\"width\", \"0%\");
  6562.           }
  6563.         },
  6564.         error: function() {
  6565.           \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center'>Erreur de chargement</div>\");
  6566.         }
  6567.       });
  6568.     }
  6569.     
  6570.     // Supprimer un favori
  6571.     function removeFavorite(id) {
  6572.       \$.ajax({
  6573.         url: \"/Parent/remove-favorite/\" + id,
  6574.         type: \"POST\",
  6575.         success: function() {
  6576.           loadFavorites();
  6577.           
  6578.           // Mettre à jour le compteur global
  6579.           var count = parseInt(\$(\"#likeCount\").text());
  6580.           if (!isNaN(count)) {
  6581.             \$(\"#likeCount\").text(count - 1);
  6582.           }
  6583.           
  6584.           var countFav = parseInt(\$(\"#mesFavCount\").text());
  6585.           if (!isNaN(countFav)) {
  6586.             \$(\"#mesFavCount\").text(countFav - 1);
  6587.           }
  6588.         },
  6589.         error: function() {
  6590.           alert(\"Erreur lors de la suppression du favori\");
  6591.         }
  6592.       });
  6593.     }
  6594.   });
  6595. </script>
  6596. <!-- Script pour la sidebar des favoris -->
  6597. <script>
  6598. \$(document).ready(function() {
  6599.     // Fonctions pour ouvrir/fermer la sidebar
  6600.     \$(\"#openFavoritesSidebar\").click(function() {
  6601.         \$(\"#favorites-sidebar\").css(\"right\", \"0\");
  6602.         loadFavorites();
  6603.     });
  6604.     
  6605.     \$(\"#close-favorites-btn\").click(function() {
  6606.         \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  6607.     });
  6608.     
  6609.     // Fermer en cliquant en dehors
  6610.     \$(document).click(function(event) {
  6611.         if (!\$(event.target).closest(\"#favorites-sidebar\").length && 
  6612.             !\$(event.target).closest(\"#openFavoritesSidebar\").length && 
  6613.             \$(\"#favorites-sidebar\").css(\"right\") === \"0px\") {
  6614.             \$(\"#favorites-sidebar\").css(\"right\", \"-400px\");
  6615.         }
  6616.     });
  6617.     
  6618.    // Variables globales
  6619. let selectedFavorites = [];
  6620. let allFavorites = [];
  6621. let coverPhotoId = null; // ID de la photo de couverture
  6622. // Fonction pour mettre à jour la sidebar
  6623. function loadFavorites() {
  6624.     \$(\"#favorites-grid\").html(\"<div style='text-align:center;padding:20px;'>Chargement...</div>\");
  6625.     
  6626.     \$.ajax({
  6627.         url: \"/Parent/mes-favoris\",
  6628.         type: \"GET\",
  6629.         dataType: \"json\",
  6630.         success: function(data) {
  6631.             \$(\"#favorites-grid\").empty();
  6632.             allFavorites = data.data || [];
  6633.             
  6634.             if (allFavorites.length > 0) {
  6635.                 \$(\"#favorites-empty-state\").hide();
  6636.                 
  6637.                 // Ajouter l'option de photo de couverture au-dessus de la grille
  6638.                 if (!\$(\"#cover-photo-section\").length) {
  6639.                     const coverSection = \$(`
  6640.                         <div id=\"cover-photo-section\" style=\"margin-bottom:15px;\">
  6641.                             <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;\">
  6642.                                 <h4 style=\"margin:0;font-size:15px;color:#333;\">Photo de couverture</h4>
  6643.                                 <span style=\"font-size:12px;color:#777;\">Pour la personnalisation des produits</span>
  6644.                             </div>
  6645.                             <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;\">
  6646.                                 <div id=\"cover-photo-placeholder\" style=\"text-align:center;padding:15px;color:#777;\">
  6647.                                     <i class=\"bi bi-image\" style=\"font-size:24px;display:block;margin-bottom:8px;\"></i>
  6648.                                     <p style=\"margin:0;font-size:13px;\">Sélectionnez une photo comme couverture</p>
  6649.                                 </div>
  6650.                                 <div id=\"cover-photo-preview\" style=\"display:none;width:100%;height:100%;position:relative;\">
  6651.                                     <img src=\"\" style=\"width:100%;height:100%;object-fit:cover;\" />
  6652.                                     <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;\">
  6653.                                         <i class=\"bi bi-x\"></i>
  6654.                                     </button>
  6655.                                 </div>
  6656.                             </div>
  6657.                         </div>
  6658.                     `);
  6659.                     
  6660.                     \$(\"#photos-content\").prepend(coverSection);
  6661.                     
  6662.                     // Événement pour retirer la photo de couverture
  6663.                     \$(\"#remove-cover-photo\").click(function(e) {
  6664.                         e.stopPropagation();
  6665.                         setCoverPhoto(null);
  6666.                     });
  6667.                 }
  6668.                 
  6669.                 // Mettre à jour l'affichage de la photo de couverture
  6670.                 updateCoverPhotoDisplay();
  6671.                 
  6672.                 // Générer la grille de photos
  6673.                 \$.each(allFavorites, function(i, fav) {
  6674.                     var isSelected = selectedFavorites.includes(fav.id);
  6675.                     var isCoverPhoto = (coverPhotoId === fav.id);
  6676.                     
  6677.                     // Conteneur principal avec styles conditionnels
  6678.                     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>\");
  6679.                     
  6680.                     var img = \$(\"<img style='width:100%;height:100%;object-fit:cover;'>\").attr(\"src\", fav.path).attr(\"alt\", fav.descreption || \"Photo favorite\");
  6681.                     
  6682.                     // Badge de sélection
  6683.                     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>\");
  6684.                     
  6685.                     // Badge de photo de couverture
  6686.                     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>\");
  6687.                     
  6688.                     // Overlay simple pour effet au survol
  6689.                     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>\");
  6690.                     
  6691.                     // Actions sur hover
  6692.                     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>\");
  6693.                     
  6694.                     // Bouton pour définir comme photo de couverture
  6695.                     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>\");
  6696.                     
  6697.                     setCoverBtn.click(function(e) {
  6698.                         e.stopPropagation();
  6699.                         if (isCoverPhoto) {
  6700.                             setCoverPhoto(null);
  6701.                         } else {
  6702.                             setCoverPhoto(fav.id);
  6703.                         }
  6704.                     });
  6705.                     
  6706.                     actionsOverlay.append(setCoverBtn);
  6707.                     
  6708.                     // Ajouter effet de survol
  6709.                     item.hover(
  6710.                         function() { 
  6711.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"1\");
  6712.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"1\");
  6713.                         },
  6714.                         function() { 
  6715.                             \$(this).find(\".hover-overlay\").css(\"opacity\", \"0\");
  6716.                             \$(this).find(\".actions-overlay\").css(\"opacity\", \"0\");
  6717.                         }
  6718.                     );
  6719.                     
  6720.                     // Gérer le clic pour la sélection
  6721.                     item.click(function(e) {
  6722.                         e.stopPropagation();
  6723.                         toggleSelection(\$(this).data('id'));
  6724.                     });
  6725.                     
  6726.                     item.append(img).append(hoverOverlay).append(selectionBadge).append(coverBadge).append(actionsOverlay);
  6727.                     
  6728.                     // Ajouter explicitement une classe pour le style
  6729.                     item.addClass(\"no-trash-button\");
  6730.                     
  6731.                     \$(\"#favorites-grid\").append(item);
  6732.                 });
  6733.                 
  6734.                 // Supprimer tout bouton de suppression qui pourrait être ajouté dynamiquement
  6735.                 setTimeout(function() {
  6736.                     \$(\".favorite-item .remove-favorite, .favorite-item button:has(.bi-trash), .favorite-overlay button\").remove();
  6737.                 }, 100);
  6738.                 
  6739.                 \$(\"#favorites-counter\").text(allFavorites.length);
  6740.                 \$(\"#openFavoritesSidebar span\").text(allFavorites.length);
  6741.                 updateProductsView();
  6742.                 
  6743.             } else {
  6744.                 \$(\"#favorites-empty-state\").show();
  6745.                 \$(\"#favorites-counter\").text(\"0\");
  6746.                 \$(\"#openFavoritesSidebar span\").text(\"0\");
  6747.                 \$(\"#selection-count\").text(\"0\");
  6748.                 updateProductsView();
  6749.             }
  6750.         },
  6751.         error: function() {
  6752.             \$(\"#favorites-grid\").html(\"<div style='color:red;text-align:center;padding:20px;'>Erreur de chargement</div>\");
  6753.         }
  6754.     });
  6755. }
  6756. // Fonction pour définir la photo de couverture
  6757. function setCoverPhoto(id) {
  6758.     coverPhotoId = id;
  6759.     
  6760.     // Mettre à jour l'affichage
  6761.     updateCoverPhotoDisplay();
  6762.     
  6763.     // Mettre à jour le style des photos dans la grille
  6764.     \$(\".favorite-item\").each(function() {
  6765.         const itemId = \$(this).data('id');
  6766.         const isSelected = selectedFavorites.includes(itemId);
  6767.         const isCover = (itemId === coverPhotoId);
  6768.         
  6769.         // Mettre à jour la bordure
  6770.         \$(this).css(\"border\", \"3px solid \" + (isSelected ? \"#F56040\" : (isCover ? \"#4CAF50\" : \"transparent\")));
  6771.         
  6772.         // Mettre à jour le badge de couverture
  6773.         \$(this).find(\".cover-badge\").css(\"display\", isCover ? \"block\" : \"none\");
  6774.         
  6775.         // Mettre à jour le bouton de couverture
  6776.         const coverBtn = \$(this).find(\".actions-overlay button:first\");
  6777.         coverBtn.css({
  6778.             \"background\": isCover ? \"#4CAF50\" : \"rgba(255,255,255,0.8)\",
  6779.             \"color\": isCover ? \"white\" : \"#333\"
  6780.         });
  6781.         coverBtn.find(\"i\").attr(\"class\", \"bi bi-star\" + (isCover ? \"-fill\" : \"\"));
  6782.     });
  6783.     
  6784.     // Enregistrer l'ID de la photo de couverture (si nécessaire pour le backend)
  6785.     if (id) {
  6786.         console.log(\"Photo de couverture définie avec l'ID:\", id);
  6787.         // Ici vous pouvez ajouter une requête AJAX pour enregistrer ce choix sur le serveur
  6788.         
  6789.         // Ajouter automatiquement la photo de couverture à la sélection si elle n'y est pas déjà
  6790.         if (!selectedFavorites.includes(id)) {
  6791.             toggleSelection(id);
  6792.         }
  6793.     } else {
  6794.         console.log(\"Photo de couverture supprimée\");
  6795.     }
  6796. }
  6797. // Mettre à jour l'affichage de la photo de couverture
  6798. function updateCoverPhotoDisplay() {
  6799.     if (coverPhotoId) {
  6800.         // Trouver la photo correspondante
  6801.         const coverPhoto = allFavorites.find(fav => fav.id === coverPhotoId);
  6802.         if (coverPhoto) {
  6803.             \$(\"#cover-photo-placeholder\").hide();
  6804.             \$(\"#cover-photo-preview\").show();
  6805.             \$(\"#cover-photo-preview img\").attr(\"src\", coverPhoto.path);
  6806.         } else {
  6807.             // Si l'ID ne correspond à aucune photo (cas rare)
  6808.             coverPhotoId = null;
  6809.             \$(\"#cover-photo-placeholder\").show();
  6810.             \$(\"#cover-photo-preview\").hide();
  6811.         }
  6812.     } else {
  6813.         \$(\"#cover-photo-placeholder\").show();
  6814.         \$(\"#cover-photo-preview\").hide();
  6815.     }
  6816. }
  6817. // Modifier la fonction updateProductsView pour tenir compte de la photo de couverture
  6818. function updateProductsView() {
  6819.     const current = selectedFavorites.length;
  6820.     const hasCoverPhoto = coverPhotoId !== null;
  6821.     
  6822.     \$(\"#product-photo-count\").text(current);
  6823.     
  6824.     let remainingForAlbum = Math.max(0, 20 - current);
  6825.     let remainingForPochette = Math.max(0, 12 - current);
  6826.     let remainingForPack = Math.max(0, 12 - current);
  6827.     const progressBar = (count, total, color) => `
  6828.         <div style=\"margin: 5px 0;\">
  6829.             <div style=\"background-color: #e9ecef; border-radius: 5px; overflow: hidden; height: 8px;\">
  6830.                 <div style=\"width: \${(count / total) * 100}%; background-color: \${color}; height: 100%;\"></div>
  6831.             </div>
  6832.             <small style=\"font-size: 12px;\">\${count}/\${total} photos</small>
  6833.         </div>
  6834.     `;
  6835.     // Liste des produits
  6836.     const products = [
  6837.         {
  6838.             name: \"Pochette photo (12 photos)\",
  6839.             required: 12,
  6840.             remaining: Math.max(0, 12 - current),
  6841.             image: \"/images/produit/PochettePhoto5sur5-2.jpg\",
  6842.             color: \"#2196f3\",
  6843.             link: \"{{ path('AjoutPochettePhotos_Favoris', {'nbr': 12}) }}\",
  6844.             needsCover: true
  6845.         },
  6846.         {
  6847.             name: \"Pack numérique (20 photos)\",
  6848.             required: 20,
  6849.             remaining: Math.max(0, 20 - current),
  6850.             image: \"/images/produit/photoNumerique.jpg\",
  6851.             color: \"#4caf50\",
  6852.             link: \"{{ path('PackPhotosNumerique_Favoris', {'nbr': 20}) }}\",
  6853.             needsCover: false
  6854.         },
  6855.        
  6856.       
  6857.     ].sort((a, b) => a.remaining - b.remaining);
  6858.     const productList = products
  6859.         .map((product) => {
  6860.             const count = current;
  6861.             const total = product.required;
  6862.             const remaining = product.remaining;
  6863.             const coverRequired = product.needsCover && !hasCoverPhoto;
  6864.             return `
  6865.                 <li style=\"margin-bottom: 20px; position: relative;\">
  6866.                     \${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;\">
  6867.                         <i class=\"bi bi-exclamation-triangle\"></i> Photo de couverture requise
  6868.                     </div>` : ''}
  6869.                     <div style=\"display: flex; align-items: center; gap: 10px;\">
  6870.                         <img src=\"\${product.image}\" alt=\"\${product.name}\" style=\"width: 70px; height: 70px; border-radius: 5px; object-fit: cover;\" />
  6871.                         <div style=\"flex: 1;\">
  6872.                             <strong style=\"font-size: 14px;\">\${product.name}</strong>
  6873.                             \${progressBar(count, total, product.color)}
  6874.                             \${
  6875.                                 remaining > 0
  6876.                                 ? `<small style=\"color: \${product.color}; font-size: 12px;\">
  6877.                                     Encore \${remaining} photos pour compléter \${product.name.toLowerCase()}
  6878.                                 </small>`
  6879.                                 : coverRequired
  6880.                                 ? `<button
  6881.                                     style=\"
  6882.                                         margin-top: 5px;
  6883.                                         padding: 6px 12px;
  6884.                                         background-color: #FFC107;
  6885.                                         color: #333;
  6886.                                         border: none;
  6887.                                         border-radius: 5px;
  6888.                                         font-size: 13px;
  6889.                                         cursor: pointer;
  6890.                                     \"
  6891.                                     onclick=\"\$('#tab-photos').click(); /* Rediriger vers l'onglet photos */\"
  6892.                                 >
  6893.                                     Choisir une couverture
  6894.                                 </button>`
  6895.                                 : `<button
  6896.                                     style=\"
  6897.                                         margin-top: 5px;
  6898.                                         padding: 6px 12px;
  6899.                                         background-color: \${product.color};
  6900.                                         color: white;
  6901.                                         border: none;
  6902.                                         border-radius: 5px;
  6903.                                         font-size: 13px;
  6904.                                         cursor: pointer;
  6905.                                     \"
  6906.                                     onclick=\"window.location.href='\${product.link}'\"
  6907.                                 >
  6908.                                     Commander
  6909.                                 </button>`
  6910.                             }
  6911.                         </div>
  6912.                     </div>
  6913.                 </li>
  6914.             `;
  6915.         })
  6916.         .join(\"\");
  6917.     const boutiqueButton = `
  6918.         <li style=\"margin-top: 25px; text-align: center;\">
  6919.             <button
  6920.                 style=\"
  6921.                     padding: 8px 15px;
  6922.                     background-color: #F56040;
  6923.                     color: white;
  6924.                     border: none;
  6925.                     border-radius: 5px;
  6926.                     font-size: 14px;
  6927.                     width: 170px;
  6928.                     height: 40px;
  6929.                     cursor: pointer;
  6930.                 \"
  6931.                 onclick=\"window.location.href='{{ path('boutique5sur5') }}'\"
  6932.             >
  6933.                 Voir toute la boutique
  6934.             </button>
  6935.         </li>
  6936.     `;
  6937.     \$(\"#product-list\").html(productList + boutiqueButton);
  6938. }
  6939. });
  6940. </script>
  6941. {% endblock %}
  6942. ""Parent/DetailsSejour.html.twig""/var/www/5sur5sejour/templates/Parent/DetailsSejour.html.twig");
  6943.     }
  6944. }