var/cache/dev/twig/e5/e556f7b94b4d4f3e761909d6146d9b2389859efe886ecb159aa9c25eec82afe4.php line 91

Open in your IDE?
  1. <?php
  3. use Twig\Environment;
  4. use Twig\Error\LoaderError;
  5. use Twig\Error\RuntimeError;
  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;
  15. /* project.html.twig */
  16. class __TwigTemplate_13f70910f050a903c91d2cc0b7d3a762f174758d7f6b6d653c908236a1984926 extends Template
  17. {
  18.     private $source;
  19.     private $macros = [];
  21.     public function __construct(Environment $env)
  22.     {
  23.         parent::__construct($env);
  25.         $this->source = $this->getSourceContext();
  27.         $this->blocks = [
  28.             'title' => [$this, 'block_title'],
  29.             'body' => [$this, 'block_body'],
  30.         ];
  31.     }
  33.     protected function doGetParent(array $context)
  34.     {
  35.         // line 1
  36.         return "base.html.twig";
  37.     }
  39.     protected function doDisplay(array $context, array $blocks = [])
  40.     {
  41.         $macros = $this->macros;
  42.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  43.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "project.html.twig"));
  45.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  46.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "project.html.twig"));
  48.         $this->parent = $this->loadTemplate("base.html.twig", "project.html.twig", 1);
  49.         $this->parent->display($context, array_merge($this->blocks, $blocks));
  50.         
  51.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
  53.         
  54.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
  56.     }
  58.     // line 3
  59.     public function block_title($context, array $blocks = [])
  60.     {
  61.         $macros = $this->macros;
  62.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  63.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  65.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  66.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  68.         echo "Projets";
  69.         
  70.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
  72.         
  73.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
  75.     }
  77.     // line 5
  78.     public function block_body($context, array $blocks = [])
  79.     {
  80.         $macros = $this->macros;
  81.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  82.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  84.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  85.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  87.         // line 6
  88.         echo "
  89.     ";
  90.         // line 7
  91.         $context["headerContent"] = $this->extensions['App\Twig\ContentExtension']->Content("Projets", "Header");
  92.         // line 8
  93.         echo "
  94.     ";
  95.         // line 9
  96.         if ((twig_get_attribute($this->env, $this->source, ($context["headerContent"] ?? null), "picture", [], "any", true, true, false, 9) &&  !twig_test_empty(twig_get_attribute($this->env, $this->source, (isset($context["headerContent"]) || array_key_exists("headerContent", $context) ? $context["headerContent"] : (function () { throw new RuntimeError('Variable "headerContent" does not exist.', 9, $this->source); })()), "picture", [], "any", false, false, false, 9)))) {
  97.             // line 10
  98.             echo "        ";
  99.             $context["backgroundImage"] = twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["headerContent"]) || array_key_exists("headerContent", $context) ? $context["headerContent"] : (function () { throw new RuntimeError('Variable "headerContent" does not exist.', 10, $this->source); })()), "picture", [], "any", false, false, false, 10), 0, [], "array", false, false, false, 10), "path", [], "any", false, false, false, 10);
  100.             // line 11
  101.             echo "    ";
  102.         } else {
  103.             // line 12
  104.             echo "        ";
  105.             $context["backgroundImage"] = "empty";
  106.             // line 13
  107.             echo "    ";
  108.         }
  109.         // line 14
  110.         echo "    <header class=\"header-tracol col-lg-8 mx-auto\" style=\"background-image: url(";
  111.         if ((0 !== twig_compare((isset($context["backgroundImage"]) || array_key_exists("backgroundImage", $context) ? $context["backgroundImage"] : (function () { throw new RuntimeError('Variable "backgroundImage" does not exist.', 14, $this->source); })()), "empty"))) {
  112.             echo "'/uploads/images/";
  113.             echo twig_escape_filter($this->env, (isset($context["backgroundImage"]) || array_key_exists("backgroundImage", $context) ? $context["backgroundImage"] : (function () { throw new RuntimeError('Variable "backgroundImage" does not exist.', 14, $this->source); })()), "html", null, true);
  114.             echo "'";
  115.         } else {
  116.             echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("img/projets_header.jpg"), "html", null, true);
  117.         }
  118.         echo ");\">
  119.         <div class=\"col-lg-8 mx-auto div-svg-header\">
  120.             <div id=\"header-project\" class=\"header-habiter-div\">
  121.                 <svg id=\"svg-habiter\" width=\"10\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xmlns:avocode=\"https://avocode.com/\" viewBox=\"0 0 10 16\"><defs></defs><desc>Generated with Avocode.</desc><g><g><title>Tracé 76</title><path d=\"M9.08929,0.51465v0h-9.08929v0v14.77002v0l9.08929,-1.93109v0z\" fill=\"#f6a400\" fill-opacity=\"1\"></path></g></g></svg>
  122.                 <h2 class=\"header-habiter-title col-lg-6\">";
  123.         // line 18
  124.         if (twig_get_attribute($this->env, $this->source, ($context["headerContent"] ?? null), "name", [], "any", true, true, false, 18)) {
  125.             echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, (isset($context["headerContent"]) || array_key_exists("headerContent", $context) ? $context["headerContent"] : (function () { throw new RuntimeError('Variable "headerContent" does not exist.', 18, $this->source); })()), "name", [], "any", false, false, false, 18), "html", null, true);
  126.         } else {
  127.             echo "Nos projets";
  128.         }
  129.         echo "</h2>
  130.                 <div class=\"col-lg-8 header-content\">
  131.                     ";
  132.         // line 20
  133.         if (twig_get_attribute($this->env, $this->source, ($context["headerContent"] ?? null), "content", [], "any", true, true, false, 20)) {
  134.             echo twig_get_attribute($this->env, $this->source, (isset($context["headerContent"]) || array_key_exists("headerContent", $context) ? $context["headerContent"] : (function () { throw new RuntimeError('Variable "headerContent" does not exist.', 20, $this->source); })()), "content", [], "any", false, false, false, 20);
  135.             echo " ";
  136.         } else {
  137.             echo "L’immobilier ayant un fort impact, Tracol Immobilier a pour ambition de répondre aux grands enjeux urbains du Luxembourg, tout en développant des projets environnementaux et sociétaux.";
  138.         }
  139.         // line 21
  140.         echo "                </div>
  141.             </div>
  142.         </div>
  143.     </header>
  145.     <div class=\"container-fluid\">
  146.         ";
  147.         // line 27
  148.         $context["sectionContent1"] = $this->extensions['App\Twig\ContentExtension']->Content("Projets", "Section-1");
  149.         // line 28
  150.         echo "        <div class=\"col-lg-8 mx-auto div-svg-header pre-section\">
  151.             <div class=\"col-lg-4\" style=\"font-size: 2.3em;display: flex;flex-direction: column;margin-left: 10px;\">
  152.                 <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"9.089\" height=\"14.77\" viewBox=\"0 0 9.089 14.77\">
  153.                     <path id=\"Tracé_76\" data-name=\"Tracé 76\" d=\"M682.759,232.441h-9.089v14.77l9.089-1.931Z\" transform=\"translate(-673.669 -232.441)\" fill=\"#f6a400\"/>
  154.                 </svg>
  155.                 ";
  156.         // line 33
  157.         if ((0 === twig_compare(twig_length_filter($this->env, (isset($context["projects"]) || array_key_exists("projects", $context) ? $context["projects"] : (function () { throw new RuntimeError('Variable "projects" does not exist.', 33, $this->source); })())), 0))) {
  158.             // line 34
  159.             echo "                    <h1 class=\"project-title\">pas de projet</h1>
  160.                 ";
  161.         } elseif ((0 === twig_compare(twig_length_filter($this->env,         // line 35
  162. (isset($context["projects"]) || array_key_exists("projects", $context) ? $context["projects"] : (function () { throw new RuntimeError('Variable "projects" does not exist.', 35, $this->source); })())), 1))) {
  163.             // line 36
  164.             echo "                    <h1 class=\"project-title\">";
  165.             echo twig_escape_filter($this->env, twig_length_filter($this->env, (isset($context["projects"]) || array_key_exists("projects", $context) ? $context["projects"] : (function () { throw new RuntimeError('Variable "projects" does not exist.', 36, $this->source); })())), "html", null, true);
  166.             echo " projet</h1>
  167.                 ";
  168.         } else {
  169.             // line 38
  170.             echo "                    <h1 class=\"project-title\">";
  171.             echo twig_escape_filter($this->env, twig_length_filter($this->env, (isset($context["projects"]) || array_key_exists("projects", $context) ? $context["projects"] : (function () { throw new RuntimeError('Variable "projects" does not exist.', 38, $this->source); })())), "html", null, true);
  172.             echo " projets</h1>
  173.                 ";
  174.         }
  175.         // line 40
  176.         echo "            </div>
  177.             <div class=\"separator\"></div>
  178.             <div id=\"section-1-project\" class=\"col-lg-6 pre-section-content\">
  179.                 ";
  180.         // line 43
  181.         if (twig_get_attribute($this->env, $this->source, ($context["headerContent"] ?? null), "content", [], "any", true, true, false, 43)) {
  182.             echo twig_get_attribute($this->env, $this->source, (isset($context["sectionContent1"]) || array_key_exists("sectionContent1", $context) ? $context["sectionContent1"] : (function () { throw new RuntimeError('Variable "sectionContent1" does not exist.', 43, $this->source); })()), "content", [], "any", false, false, false, 43);
  183.         } else {
  184.             echo "Développer durable, travailler avec des entreprises locales, maximiser nos impacts positifs (régénération urbaine, emploi local, etc.) et réduire nos impacts négatifs (émissions de CO2, biodiversité, ressources, …) pour apporter du mieux-vivre en ville, voilà comment nous imaginons nos projets !";
  185.         }
  186.         // line 44
  187.         echo "            </div>
  188.         </div>
  190.         <section class=\"project filter mt-5\" style=\"margin-bottom: 120px\">
  191.             <div id=\"button-project-page\" class=\"col-lg-8 mx-auto div-svg-header mb-4\" style=\"display: flex; align-items: center; padding-left: 7px\">
  192.                 <div class=\"input-filter\">
  193.                     <label for=\"all-projects\">TOUS</label>
  194.                     <input data-id=\"all\" type=\"radio\" name=\"type\" id=\"all-projects\" class=\"mr-3 projectButton\">
  195.                 </div>
  196.                 <div class=\"input-filter\">
  197.                     <label for=\"futur-projects\">A VENIR</label>
  198.                     <input data-id=\"futur\" type=\"radio\" name=\"type\" id=\"futur-projects\" class=\"mr-3 projectButton\">
  199.                 </div>
  200.                 <div class=\"input-filter\">
  201.                     <label for=\"construction-projects\">EN COURS</label>
  202.                     <input data-id=\"construction\" type=\"radio\" name=\"type\" id=\"construction-projects\" class=\" projectButton\">
  203.                 </div>
  207.                 ";
  208.         // line 69
  209.         echo "            </div>
  210.             <div id=\"button-project-page-mobile\" class=\"col-lg-8 mx-auto div-svg-header\" style=\"display: none; align-items: center\">
  211.                 <div  class=\"flicking-viewport\">
  212.                     <div class=\"flicking-camera\">
  213.                         <div class=\"input-filter\">
  214.                             <label for=\"all-projects-mobile\">TOUS</label>
  215.                             <input data-id=\"all\" type=\"radio\" name=\"type\" id=\"all-projects-mobile\" class=\"mr-3 projectButton\">
  216.                         </div>
  217.                         <div class=\"input-filter\">
  218.                             <label for=\"futur-projects-mobile\">A VENIR</label>
  219.                             <input data-id=\"futur\" type=\"radio\" name=\"type\" id=\"futur-projects-mobile\" class=\"mr-3 projectButton\">
  220.                         </div>
  221.                         <div class=\"input-filter\">
  222.                             <label for=\"construction-projects-mobile\">EN COURS</label>
  223.                             <input data-id=\"construction\" type=\"radio\" name=\"type\" id=\"construction-projects-mobile\" class=\" projectButton\">
  224.                         </div>
  225.                         ";
  226.         // line 90
  227.         echo "
  228.                     </div>
  229.                 </div>
  230.             </div>
  233.             <div class=\"col-lg-8 mx-auto div-svg-header\" style=\"display: flex; justify-content: center; flex-direction: column;\">
  234.                 ";
  235.         // line 117
  236.         echo "
  238.                 ";
  239.         // line 124
  240.         echo "
  241.                 <div id=\"projects\" class=\"row\">
  242.                     ";
  243.         // line 158
  244.         echo "
  245.                     <div class=\"col-lg-12 project-desktop\" style=\"display: flex; flex-wrap: wrap; flex-direction: row\">
  246.                         ";
  247.         // line 160
  248.         $context['_parent'] = $context;
  249.         $context['_seq'] = twig_ensure_traversable(twig_slice($this->env, (isset($context["projects"]) || array_key_exists("projects", $context) ? $context["projects"] : (function () { throw new RuntimeError('Variable "projects" does not exist.', 160, $this->source); })()), 0, 5));
  250.         foreach ($context['_seq'] as $context["key"] => $context["property"]) {
  251.             // line 161
  252.             echo "                            <div  class=\"col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12\" style=\"position:relative;cursor: pointer\">
  253.                                 ";
  254.             // line 162
  255.             if ( !twig_test_empty(twig_get_attribute($this->env, $this->source, $context["property"], "pictures", [], "any", false, false, false, 162))) {
  256.                 // line 163
  257.                 echo "                                    <div class=\"position-relative properties-slide\">
  258.                                             <div class=\"img\" style=\"background-image: url('";
  259.                 // line 164
  260.                 echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["property"], "pictures", [], "any", false, false, false, 164), 0, [], "any", false, false, false, 164), "url", [], "any", false, false, false, 164), "html", null, true);
  261.                 echo "')\"  onclick=\"location.href='";
  262.                 echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("project-detail", ["id" => twig_get_attribute($this->env, $this->source, $context["property"], "id", [], "any", false, false, false, 164)]), "html", null, true);
  263.                 echo "'\">
  264.                                             </div>
  265.                                     </div>
  267.                                 ";
  268.             } else {
  269.                 // line 169
  270.                 echo "                                    <div class=\"img\" style=\"background-image: url('";
  271.                 echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("build/Hudson_Ontario2.png"), "html", null, true);
  272.                 echo "')\"></div>
  273.                                 ";
  274.             }
  275.             // line 171
  276.             echo "                                ";
  277.             // line 183
  278.             echo "
  279.                                 <p class=\"city\">";
  280.             // line 184
  281.             echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["property"], "city", [], "any", false, false, false, 184), "name", [], "any", false, false, false, 184), "html", null, true);
  282.             echo "</p>
  283.                                 <p class=\"project-name\">";
  284.             // line 185
  285.             echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, $context["property"], "reference", [], "any", false, false, false, 185), "html", null, true);
  286.             echo "</p>
  287.                                 <div class=\"tag-ref-projet-2\"><span class=\"text-tag-ref\">";
  288.             // line 186
  289.             echo twig_escape_filter($this->env, $this->extensions['App\Twig\ContentExtension']->typeProject(twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["property"], "construction", [], "any", false, false, false, 186), "construction_step", [], "any", false, false, false, 186)), "html", null, true);
  290.             echo "</span></div>
  291.                             </div>
  292.                         ";
  293.         }
  294.         $_parent = $context['_parent'];
  295.         unset($context['_seq'], $context['_iterated'], $context['key'], $context['property'], $context['_parent'], $context['loop']);
  296.         $context = array_intersect_key($context, $_parent) + $_parent;
  297.         // line 189
  298.         echo "                    </div>
  299.                 </div>
  302.                 <div class=\"text-center text-capitalize more-projects\">
  303.                     <p>AFFICHER PLUS DE PROJETS</p>
  304.                 </div>
  305.             </div>
  306.             ";
  307.         // line 228
  308.         echo "
  309.         </section>
  310.     </div>
  311.     <div id=\"img-property-section\" class=\"container-fluid\" style=\"display: none\">
  312.         <div class=\"col-lg-6 habiter-img\">
  313.             <img style=\"padding: 0px;\" height=\"430px\" class=\"img-100\" ";
  314.         // line 233
  315.         if (twig_get_attribute($this->env, $this->source, ($context["sectionContent1"] ?? null), "picture", [], "any", true, true, false, 233)) {
  316.             echo "src=\"/uploads/images/";
  317.             echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, (isset($context["sectionContent1"]) || array_key_exists("sectionContent1", $context) ? $context["sectionContent1"] : (function () { throw new RuntimeError('Variable "sectionContent1" does not exist.', 233, $this->source); })()), "picture", [], "any", false, false, false, 233), 0, [], "array", false, false, false, 233), "path", [], "any", false, false, false, 233), "html", null, true);
  318.             echo "\"";
  319.         }
  320.         echo ">
  321.         </div>
  322.     </div>
  325.     <script>
  326.         const futurProjects = document.getElementById('projects')
  327.         let buttons = document.getElementsByClassName('projectButton')
  329.         for (const eElement of buttons) {
  330.             eElement.addEventListener('click', function (e) {
  331.                 e.preventDefault()
  333.                 for (let button of buttons) {
  334.                     if (button.classList.contains('all')){
  335.                         button.classList.remove('all')
  336.                         //button.classList.add('come')
  337.                         //button.querySelector('span').classList.replace('span-all', 'span-projects')
  338.                     }
  339.                 }
  341.                 eElement.classList.remove('come')
  342.                 //eElement.classList.add('all')
  343.                 //eElement.querySelector('span').classList.replace('span-projects', 'span-all')
  345.                 fetch('projects/display/'+this.dataset.id, {
  346.                     method: 'GET',
  347.                 })
  348.                     .then(response => response.json())
  349.                     .then(data => {
  350.                         futurProjects.innerHTML = ''
  351.                         futurProjects.innerHTML = data.data
  353.                         _ww = \$(window).width();
  354.                         var lightbox = \$('.lightbox'),
  355.                             item = 0;
  357.                         \$('.lightbox-on').click(function(e){
  358.                             e.stopPropagation();
  359.                             item = 0;
  360.                             console.log('click btn');
  362.                             var id = \$(this).attr('data-id'),
  363.                                 max = 0;
  364.                             \$('#'+id).toggle();
  365.                             \$('#'+id).animate({opacity: 1}, 300);
  366.                             \$('#'+id).find('img').each(function( i ) {
  367.                                 //console.log('h : '+\$(this).height());
  368.                                 //console.log('w : '+\$(this).width());
  369.                                 max = i;
  370.                                 item = 1;
  371.                                 counter(item, max+1);
  372.                                 itemWidth(\$(this));
  373.                             });
  374.                         });
  376.                         lightbox.click(function(e) {
  377.                             e.stopPropagation();
  378.                             \$(this).animate({opacity: 0}, 300, function(){
  379.                                 \$(this).toggle();
  380.                             });
  381.                         });
  383.                         \$('.closer').on('click', function (e) {
  384.                             e.stopPropagation();
  385.                             \$(this).parent().animate(
  386.                                 {opacity: 0},
  387.                                 300,
  388.                                 function(){
  389.                                     \$(this).toggle();
  390.                                 }
  391.                             );
  392.                         });
  394.                         function itemWidth(img){
  395.                             img.closest('.items').width(img.width());
  396.                         }
  398.                         function counter(item, max){
  399.                             \$('.counter').text(item + ' / ' + max);
  400.                         }
  402.                         \$('.item', lightbox).on('click, swipeleft', function (e) {
  403.                             var wd = \$(this).width(),
  404.                                 last = \$(this).parent().find('.item').last(),
  405.                                 img = \$(this).find('.img');
  406.                             itemWidth(img);
  408.                             \$(this).animate(
  409.                                 {marginLeft: -wd, opacity: 0},
  410.                                 500,
  411.                                 'swing',
  412.                                 function(){
  413.                                     \$(this).insertAfter(last);
  414.                                     \$(this).css({marginLeft: 0, opacity: 1});
  415.                                 }
  416.                             );
  417.                         });
  419.                         \$('.item', lightbox).on('swiperight', function (e) {
  420.                             var wd = \$(this).width(),
  421.                                 first = \$(this).parent().find('.item').first(),
  422.                                 last = \$(this).parent().find('.item').last(),
  423.                                 img = \$(this).find('.img');
  424.                             itemWidth(img);
  426.                             \$(last).insertBefore(\$(this));
  427.                             \$(last).css({marginLeft: -wd, opacity: 0});
  428.                             \$(this).parent().find('.item').eq(0).animate(
  429.                                 {marginLeft: 0, opacity: 1},
  430.                                 500,
  431.                                 'swing'
  432.                             );
  433.                         });
  435.                         \$('.arrows', lightbox).on('click', function (e) {
  436.                             e.stopPropagation();
  438.                             var wd = \$(this).siblings('.items').find('.item').eq(0).width(),
  439.                                 max = \$(this)
  440.                                     .siblings('.items').find('.item').length,
  441.                                 first = \$(this).siblings('.items').find('.item').first(),
  442.                                 last = \$(this).siblings('.items').find('.item').last(),
  443.                                 isRight = \$(this).hasClass('right'),
  444.                                 marginL = isRight ? -wd : 0,
  445.                                 marginL0 = isRight ? 0: -wd,
  446.                                 opacOn = isRight ? 1 : 0,
  447.                                 opacOff = isRight ? 0 : 1;
  449.                             if (!isRight){
  450.                                 \$(last).insertBefore(first);
  451.                                 \$(last).css({marginLeft: -wd, opacity: 0});
  452.                                 item++;
  453.                                 if (item == max+1) {item = 1};
  454.                             } else {
  455.                                 item--;
  456.                                 if (item == 0) {item = max};
  457.                             };
  459.                             counter(item, max);
  461.                             var img = \$(this).siblings('.items').find('.item').eq(0).find('.img');
  462.                             itemWidth(img);
  464.                             \$(this).siblings('.items').find('.item').eq(1).animate(
  465.                                 {opacity: opacOn},
  466.                                 500,
  467.                                 'swing');
  469.                             \$(this).siblings('.items').find('.item').eq(0).animate(
  470.                                 {marginLeft: marginL, opacity: 1},
  471.                                 500,
  472.                                 'swing',
  473.                                 function(){
  474.                                     if (isRight){
  475.                                         \$(this).insertAfter(last);
  476.                                         \$(this).css({ marginLeft: 0, opacity: 1});
  477.                                     }
  478.                                 }
  479.                             );
  480.                         });
  483.                         if (_ww > 768){
  484.                             \$('.div-img-hover-2').hover(function (e) {
  485.                                 \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  486.                                 var htext = \$(this).find('.project-content').height();
  487.                                 if (htext == undefined){htext = 0};
  488.                                 \$(this).find('.div-hover-2').animate({height : htext+180}, 150);
  489.                                 \$(this).find('.project-content').css({'visibility': 'visible'});
  490.                                 \$(this).find('.project-content').animate({opacity: 1}, 150);
  491.                             }, function() {
  492.                                 console.log('down');
  493.                                 \$(this).find('.div-hover-2').animate({height : 85}, 150);
  494.                                 \$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  496.                                 \$(this).find('.project-content').animate({opacity: 0}, 150, function(){
  497.                                     \$(this).find('.project-content').css({'visibility': 'hidden'});
  498.                                 });
  499.                             });
  500.                         } else {
  501.                             \$('.div-img-hover-2').on( \"tap\", function( event ) {
  502.                                 console.log('tap tap');
  503.                                 var opened = \$(this).find('.div-hover-2').hasClass('open'),
  504.                                     ht = opened ? 85 : '100%',
  505.                                     vis = opened ? 0 : 1;
  506.                                 \$(this).find('.div-hover-2').toggleClass('open');
  507.                                 \$(this).find('.div-hover-2').animate({height : ht}, 150);
  508.                                 \$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  509.                             });
  510.                         }
  511.                         \$('.div-hover').hover(function (e) {
  512.                             \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  513.                         }, function() {
  514.                             \$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  515.                         });
  516.                     })
  517.                     .catch((error) => {
  518.                         console.error('Error:', error);
  519.                     });
  520.             })
  521.         }
  525.         if (window.matchMedia(\"(max-width: 768px)\").matches) {
  526.             const test = document.getElementsByClassName('select-filter')
  528.             for (const testElement of test) {
  529.                 testElement.addEventListener('click', function (e) {
  530.                     e.preventDefault()
  531.                     testElement.classList.toggle('select-projet-active')
  532.                     const infos = document.querySelector('.projectButton.all')
  533.                     const dataId = []
  534.                     const tests = document.querySelectorAll('.select-filter.select-projet-active')
  535.                     for (const test1 of tests) {
  536.                         dataId.push(parseFloat(test1.dataset.id))
  537.                     }
  538.                     fetch('projects/display/'+infos.dataset.id+'/params/' + JSON.stringify(dataId), {
  539.                         method: 'GET'
  540.                     })
  541.                         .then(response => response.json())
  542.                         .then(data => {
  543.                             futurProjects.innerHTML = data.data
  544.                         })
  545.                         .catch((error) => {
  546.                             console.error('Error:', error);
  547.                         });
  548.                 })
  549.             }
  550.         } else {
  551.             const test = document.getElementsByClassName('select-projet')
  552.             for (const testElement of test) {
  553.                 testElement.addEventListener('click', function (e) {
  554.                     displayLoading()
  555.                     e.preventDefault()
  556.                     testElement.classList.toggle('select-projet-active')
  557.                     const infos = document.querySelector('.projectButton.all')
  558.                     const dataId = []
  559.                     const tests = document.querySelectorAll('.select-projet.select-projet-active')
  560.                     for (const test1 of tests) {
  561.                         dataId.push(parseFloat(test1.dataset.id))
  562.                     }
  564.                     fetch('projects/display/'+infos.dataset.id+'/params/' + JSON.stringify(dataId), {
  565.                         method: 'GET'
  566.                     })
  567.                         .then(response => response.json())
  568.                         .then(data => {
  569.                             hideLoading()
  570.                             futurProjects.innerHTML = data.data
  576.                             _ww = \$(window).width();
  577.                             var lightbox = \$('.lightbox'),
  578.                                 item = 0;
  580.                             \$('.lightbox-on').click(function(e){
  581.                                 e.stopPropagation();
  582.                                 item = 0;
  583.                                 console.log('click btn');
  585.                                 var id = \$(this).attr('data-id'),
  586.                                     max = 0;
  587.                                 \$('#'+id).toggle();
  588.                                 \$('#'+id).animate({opacity: 1}, 300);
  589.                                 \$('#'+id).find('img').each(function( i ) {
  590.                                     //console.log('h : '+\$(this).height());
  591.                                     //console.log('w : '+\$(this).width());
  592.                                     max = i;
  593.                                     item = 1;
  594.                                     counter(item, max+1);
  595.                                     itemWidth(\$(this));
  596.                                 });
  597.                             });
  599.                             lightbox.click(function(e) {
  600.                                 e.stopPropagation();
  601.                                 \$(this).animate({opacity: 0}, 300, function(){
  602.                                     \$(this).toggle();
  603.                                 });
  604.                             });
  606.                             \$('.closer').on('click', function (e) {
  607.                                 e.stopPropagation();
  608.                                 \$(this).parent().animate(
  609.                                     {opacity: 0},
  610.                                     300,
  611.                                     function(){
  612.                                         \$(this).toggle();
  613.                                     }
  614.                                 );
  615.                             });
  617.                             function itemWidth(img){
  618.                                 img.closest('.items').width(img.width());
  619.                             }
  621.                             function counter(item, max){
  622.                                 \$('.counter').text(item + ' / ' + max);
  623.                             }
  625.                             \$('.item', lightbox).on('click, swipeleft', function (e) {
  626.                                 var wd = \$(this).width(),
  627.                                     last = \$(this).parent().find('.item').last(),
  628.                                     img = \$(this).find('.img');
  629.                                 itemWidth(img);
  631.                                 \$(this).animate(
  632.                                     {marginLeft: -wd, opacity: 0},
  633.                                     500,
  634.                                     'swing',
  635.                                     function(){
  636.                                         \$(this).insertAfter(last);
  637.                                         \$(this).css({marginLeft: 0, opacity: 1});
  638.                                     }
  639.                                 );
  640.                             });
  642.                             \$('.item', lightbox).on('swiperight', function (e) {
  643.                                 var wd = \$(this).width(),
  644.                                     first = \$(this).parent().find('.item').first(),
  645.                                     last = \$(this).parent().find('.item').last(),
  646.                                     img = \$(this).find('.img');
  647.                                 itemWidth(img);
  649.                                 \$(last).insertBefore(\$(this));
  650.                                 \$(last).css({marginLeft: -wd, opacity: 0});
  651.                                 \$(this).parent().find('.item').eq(0).animate(
  652.                                     {marginLeft: 0, opacity: 1},
  653.                                     500,
  654.                                     'swing'
  655.                                 );
  656.                             });
  658.                             \$('.arrows', lightbox).on('click', function (e) {
  659.                                 e.stopPropagation();
  661.                                 var wd = \$(this).siblings('.items').find('.item').eq(0).width(),
  662.                                     max = \$(this)
  663.                                         .siblings('.items').find('.item').length,
  664.                                     first = \$(this).siblings('.items').find('.item').first(),
  665.                                     last = \$(this).siblings('.items').find('.item').last(),
  666.                                     isRight = \$(this).hasClass('right'),
  667.                                     marginL = isRight ? -wd : 0,
  668.                                     marginL0 = isRight ? 0: -wd,
  669.                                     opacOn = isRight ? 1 : 0,
  670.                                     opacOff = isRight ? 0 : 1;
  672.                                 if (!isRight){
  673.                                     \$(last).insertBefore(first);
  674.                                     \$(last).css({marginLeft: -wd, opacity: 0});
  675.                                     item++;
  676.                                     if (item == max+1) {item = 1};
  677.                                 } else {
  678.                                     item--;
  679.                                     if (item == 0) {item = max};
  680.                                 };
  682.                                 counter(item, max);
  684.                                 var img = \$(this).siblings('.items').find('.item').eq(0).find('.img');
  685.                                 itemWidth(img);
  687.                                 \$(this).siblings('.items').find('.item').eq(1).animate(
  688.                                     {opacity: opacOn},
  689.                                     500,
  690.                                     'swing');
  692.                                 \$(this).siblings('.items').find('.item').eq(0).animate(
  693.                                     {marginLeft: marginL, opacity: 1},
  694.                                     500,
  695.                                     'swing',
  696.                                     function(){
  697.                                         if (isRight){
  698.                                             \$(this).insertAfter(last);
  699.                                             \$(this).css({ marginLeft: 0, opacity: 1});
  700.                                         }
  701.                                     }
  702.                                 );
  703.                             });
  706.                             if (_ww > 768){
  707.                                 \$('.div-img-hover-2').hover(function (e) {
  708.                                     \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  709.                                     var htext = \$(this).find('.project-content').height();
  710.                                     if (htext == undefined){htext = 0};
  711.                                     \$(this).find('.div-hover-2').animate({height : htext+180}, 150);
  712.                                     \$(this).find('.project-content').css({'visibility': 'visible'});
  713.                                     \$(this).find('.project-content').animate({opacity: 1}, 150);
  714.                                 }, function() {
  715.                                     console.log('down');
  716.                                     \$(this).find('.div-hover-2').animate({height : 85}, 150);
  717.                                     \$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  719.                                     \$(this).find('.project-content').animate({opacity: 0}, 150, function(){
  720.                                         \$(this).find('.project-content').css({'visibility': 'hidden'});
  721.                                     });
  722.                                 });
  723.                             } else {
  724.                                 \$('.div-hover-2').on( \"click\", function( event ) {
  725.                                     console.log('tap tap');
  726.                                     var opened = \$(this).find('.div-hover-2').hasClass('open'),
  727.                                         ht = opened ? 85 : '100%',
  728.                                         vis = opened ? 0 : 1;
  729.                                     \$(this).find('.div-hover-2').toggleClass('open');
  730.                                     \$(this).find('.div-hover-2').animate({height : ht}, 150);
  731.                                     \$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  732.                                 });
  733.                             }
  734.                             \$('.div-hover').hover(function (e) {
  735.                                 \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  736.                             }, function() {
  737.                                 \$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  738.                             });
  741.                         })
  742.                         .catch((error) => {
  743.                             console.error('Error:', error);
  744.                         });
  745.                 })
  746.             }
  747.         }
  749.         const buttonFilter = document.getElementsByClassName('select-projet')
  750.         for (const buttonFilterElement of buttonFilter) {
  751.             buttonFilterElement.addEventListener('click', function () {
  753.             })
  754.         }
  756.         if (window.matchMedia(\"(max-width: 768px)\").matches) {
  757.             new Flicking(\"#flick4\", {
  758.                 moveType: \"freeScroll\",
  759.                 bound: true
  760.             });
  762.         }
  764.         const filter = document.getElementById('filters')
  765.         const filterElement = document.getElementById('form-search-filter-ajax')
  766.         filter.addEventListener('click', function (e) {
  767.             e.preventDefault()
  768.             filterElement.classList.toggle('show')
  769.         })
  772.         const loader = document.querySelector(\"#loading\");
  774.         function displayLoading() {
  775.             loader.classList.add(\"display\");
  776.             // to stop loading after some time
  777.             setTimeout(() => {
  778.                 loader.classList.remove(\"display\");
  779.             }, 5000);
  780.         }
  782.         // hiding loading
  783.         function hideLoading() {
  784.             loader.classList.remove(\"display\");
  785.         }
  786.     </script>
  787. ";
  788.         
  789.         $__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
  791.         
  792.         $__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
  794.     }
  796.     public function getTemplateName()
  797.     {
  798.         return "project.html.twig";
  799.     }
  801.     public function isTraitable()
  802.     {
  803.         return false;
  804.     }
  806.     public function getDebugInfo()
  807.     {
  808.         return array (  315 => 233,  308 => 228,  298 => 189,  289 => 186,  285 => 185,  281 => 184,  278 => 183,  276 => 171,  270 => 169,  260 => 164,  257 => 163,  255 => 162,  252 => 161,  248 => 160,  244 => 158,  240 => 124,  236 => 117,  227 => 90,  209 => 69,  187 => 44,  181 => 43,  176 => 40,  170 => 38,  164 => 36,  162 => 35,  159 => 34,  157 => 33,  150 => 28,  148 => 27,  140 => 21,  133 => 20,  124 => 18,  110 => 14,  107 => 13,  104 => 12,  101 => 11,  98 => 10,  96 => 9,  93 => 8,  91 => 7,  88 => 6,  78 => 5,  59 => 3,  36 => 1,);
  809.     }
  811.     public function getSourceContext()
  812.     {
  813.         return new Source("{% extends 'base.html.twig' %}
  815. {% block title %}Projets{% endblock %}
  817. {% block body %}
  819.     {% set headerContent = content('Projets', 'Header') %}
  821.     {% if headerContent.picture is defined and headerContent.picture is not empty %}
  822.         {% set backgroundImage = headerContent.picture[0].path %}
  823.     {% else %}
  824.         {% set backgroundImage = 'empty' %}
  825.     {% endif %}
  826.     <header class=\"header-tracol col-lg-8 mx-auto\" style=\"background-image: url({% if backgroundImage != 'empty' %}'/uploads/images/{{ backgroundImage }}'{% else %}{{ asset('img/projets_header.jpg') }}{% endif %});\">
  827.         <div class=\"col-lg-8 mx-auto div-svg-header\">
  828.             <div id=\"header-project\" class=\"header-habiter-div\">
  829.                 <svg id=\"svg-habiter\" width=\"10\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xmlns:avocode=\"https://avocode.com/\" viewBox=\"0 0 10 16\"><defs></defs><desc>Generated with Avocode.</desc><g><g><title>Tracé 76</title><path d=\"M9.08929,0.51465v0h-9.08929v0v14.77002v0l9.08929,-1.93109v0z\" fill=\"#f6a400\" fill-opacity=\"1\"></path></g></g></svg>
  830.                 <h2 class=\"header-habiter-title col-lg-6\">{% if headerContent.name is defined %}{{ headerContent.name }}{% else %}Nos projets{% endif %}</h2>
  831.                 <div class=\"col-lg-8 header-content\">
  832.                     {% if headerContent.content is defined %}{{ headerContent.content|raw }} {% else %}L’immobilier ayant un fort impact, Tracol Immobilier a pour ambition de répondre aux grands enjeux urbains du Luxembourg, tout en développant des projets environnementaux et sociétaux.{% endif %}
  833.                 </div>
  834.             </div>
  835.         </div>
  836.     </header>
  838.     <div class=\"container-fluid\">
  839.         {% set sectionContent1 = content('Projets', 'Section-1') %}
  840.         <div class=\"col-lg-8 mx-auto div-svg-header pre-section\">
  841.             <div class=\"col-lg-4\" style=\"font-size: 2.3em;display: flex;flex-direction: column;margin-left: 10px;\">
  842.                 <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"9.089\" height=\"14.77\" viewBox=\"0 0 9.089 14.77\">
  843.                     <path id=\"Tracé_76\" data-name=\"Tracé 76\" d=\"M682.759,232.441h-9.089v14.77l9.089-1.931Z\" transform=\"translate(-673.669 -232.441)\" fill=\"#f6a400\"/>
  844.                 </svg>
  845.                 {% if projects|length == 0 %}
  846.                     <h1 class=\"project-title\">pas de projet</h1>
  847.                 {% elseif projects|length == 1  %}
  848.                     <h1 class=\"project-title\">{{ projects|length }} projet</h1>
  849.                 {% else %}
  850.                     <h1 class=\"project-title\">{{ projects|length }} projets</h1>
  851.                 {% endif %}
  852.             </div>
  853.             <div class=\"separator\"></div>
  854.             <div id=\"section-1-project\" class=\"col-lg-6 pre-section-content\">
  855.                 {% if headerContent.content is defined %}{{ sectionContent1.content|raw }}{% else %}Développer durable, travailler avec des entreprises locales, maximiser nos impacts positifs (régénération urbaine, emploi local, etc.) et réduire nos impacts négatifs (émissions de CO2, biodiversité, ressources, …) pour apporter du mieux-vivre en ville, voilà comment nous imaginons nos projets !{% endif %}
  856.             </div>
  857.         </div>
  859.         <section class=\"project filter mt-5\" style=\"margin-bottom: 120px\">
  860.             <div id=\"button-project-page\" class=\"col-lg-8 mx-auto div-svg-header mb-4\" style=\"display: flex; align-items: center; padding-left: 7px\">
  861.                 <div class=\"input-filter\">
  862.                     <label for=\"all-projects\">TOUS</label>
  863.                     <input data-id=\"all\" type=\"radio\" name=\"type\" id=\"all-projects\" class=\"mr-3 projectButton\">
  864.                 </div>
  865.                 <div class=\"input-filter\">
  866.                     <label for=\"futur-projects\">A VENIR</label>
  867.                     <input data-id=\"futur\" type=\"radio\" name=\"type\" id=\"futur-projects\" class=\"mr-3 projectButton\">
  868.                 </div>
  869.                 <div class=\"input-filter\">
  870.                     <label for=\"construction-projects\">EN COURS</label>
  871.                     <input data-id=\"construction\" type=\"radio\" name=\"type\" id=\"construction-projects\" class=\" projectButton\">
  872.                 </div>
  876.                 {#
  877.                 <button data-id=\"all\" class=\"btn btn-primary all border-radius projectButton\"><span class=\"span-all\">TOUS</span></button>
  878.                 <button data-id=\"futur\" class=\"btn btn-primary come border-radius projectButton\"><span class=\"span-projects\">A VENIR</span></button>
  879.                 <button data-id=\"construction\" class=\"btn btn-primary come border-radius projectButton\"><span class=\"span-projects\">EN COURS</span></button>
  880.                 #}
  881.             </div>
  882.             <div id=\"button-project-page-mobile\" class=\"col-lg-8 mx-auto div-svg-header\" style=\"display: none; align-items: center\">
  883.                 <div  class=\"flicking-viewport\">
  884.                     <div class=\"flicking-camera\">
  885.                         <div class=\"input-filter\">
  886.                             <label for=\"all-projects-mobile\">TOUS</label>
  887.                             <input data-id=\"all\" type=\"radio\" name=\"type\" id=\"all-projects-mobile\" class=\"mr-3 projectButton\">
  888.                         </div>
  889.                         <div class=\"input-filter\">
  890.                             <label for=\"futur-projects-mobile\">A VENIR</label>
  891.                             <input data-id=\"futur\" type=\"radio\" name=\"type\" id=\"futur-projects-mobile\" class=\"mr-3 projectButton\">
  892.                         </div>
  893.                         <div class=\"input-filter\">
  894.                             <label for=\"construction-projects-mobile\">EN COURS</label>
  895.                             <input data-id=\"construction\" type=\"radio\" name=\"type\" id=\"construction-projects-mobile\" class=\" projectButton\">
  896.                         </div>
  897.                         {#
  898.                         <button data-id=\"all\" class=\"btn btn-primary all border-radius projectButton\"><span class=\"span-all\">TOUS</span></button>
  899.                         <button data-id=\"futur\" class=\"btn btn-primary come border-radius projectButton\"><span class=\"span-projects\">A VENIR</span></button>
  900.                         <button data-id=\"construction\" class=\"btn btn-primary come border-radius projectButton\"><span class=\"span-projects\">EN COURS</span></button>
  901.                         #}
  903.                     </div>
  904.                 </div>
  905.             </div>
  908.             <div class=\"col-lg-8 mx-auto div-svg-header\" style=\"display: flex; justify-content: center; flex-direction: column;\">
  909.                 {#
  910.                 <div id=\"filter-project-desktop\">
  911.                     {% for key, subType in getSubTypeProject() %}
  912.                         <button data-id=\"{{ key }}\" class=\"select-projet\">{{ subType }} <i class=\"fas fa-times\"></i></button>
  913.                     {% endfor %}
  914.                 </div>
  916.                 <div id=\"filter-project-mobile\" class=\"col-lg-3 div-form selectSubFilter\" style=\"display: none\">
  917.                     <div class=\"input-group dropdown show\">
  918.                         <label class=\"label-search-filter\" for=\"location\">Filtrer par Type</label>
  919.                         <input style=\"height: 75px; width: 60px;\" type=\"text\" autocomplete=\"off\" name=\"filters\" id=\"filters\"
  920.                                class=\"form-control\" aria-expanded=\"false\">
  921.                         <ul id=\"form-search-filter-ajax\" class=\"dropdown-menu form-search-filter-ajax\" aria-labelledby=\"\">
  922.                             {% for key, subType in getSubTypeProject() %}
  923.                                 <li value=\"{{ key }}\" data-id=\"{{ key }}\" class=\"select-filter\"><i class=\"fas fa-times\"></i>{{ subType }}</li>
  924.                             {% endfor %}
  925.                         </ul>
  926.                     </div>
  927.                 </div>
  928.                 #}
  931.                 {#
  932.                 <div id=\"loading\">
  933.                     <h1 id=\"showOutput\"></h1>
  934.                 </div>
  935.                 #}
  937.                 <div id=\"projects\" class=\"row\">
  938.                     {#
  939.                     {% for key, project in projects|slice(0,5) %}
  940.                         <div onclick=\"location.href='{{ path('project-detail', {'id': project.id}) }}'\" data-id=\"{{ path('project-detail', {'id': project.id}) }}\" class=\"col-lg-12 div-img-hover-2 project-desktop\" style=\"cursor: pointer\">
  941.                             {% if key == 0 %}
  942.                                 <div class=\"div-hover-2\" id=\"div-hover-2\" style=\"position: absolute; bottom: 8px; left: 8px; background-color: #242424; color: white; width: 291px; height: 85px\">
  943.                                     <p class=\"city\">{{ project.city.name }}</p>
  944.                                     <p class=\"project-name\">{{ project.reference }}</p>
  945.                                     {% if project.comments[0].comment is not empty %}
  946.                                         <p class=\"project-content\">
  947.                                             {{ project.comments[0].comment|slice(0, 250) }}</p>
  948.                                         <a  href=\"{{ path('project-detail', {'id': project.id}) }}\" class=\"project-arrow-2\">
  949.                                             <span class=\"galerry-ref\"></span><i class=\"fas fa-arrow-right project-svg-arrow-2\"></i>
  950.                                         </a>
  951.                                     {% else %}
  952.                                         <a style=\"margin-top: 180px\" href=\"{{ path('project-detail', {'id': project.id}) }}\" class=\"project-arrow-2\">
  953.                                             <span class=\"galerry-ref\"></span><i class=\"fas fa-arrow-right project-svg-arrow-2\"></i>
  954.                                         </a>
  955.                                     {% endif %}
  956.                                 </div>
  957.                                 <div class=\"tag-ref-projet-2\"><span class=\"text-tag-ref\">{{ typeProject(project.construction.construction_step) }}</span></div>
  958.                                 {% if project.pictures is not empty %}
  959.                                     {% for picture in project.pictures|slice(0,1) %}
  960.                                         <div class=\"img\" style=\"background-image: url('{{ picture.url }}')\"></div>
  961.                                     {% endfor %}
  962.                                 {% else %}
  963.                                     <div class=\"img\" style=\"background-image: url('{{ asset('build/Hudson_Ontario2.png') }}')\"></div>
  964.                                 {% endif %}
  965.                             {% endif %}
  967.                         </div>
  968.                     {% endfor %}
  969.                     #}
  971.                     <div class=\"col-lg-12 project-desktop\" style=\"display: flex; flex-wrap: wrap; flex-direction: row\">
  972.                         {% for key, property in projects|slice(0,5) %}
  973.                             <div  class=\"col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12\" style=\"position:relative;cursor: pointer\">
  974.                                 {% if property.pictures is not empty %}
  975.                                     <div class=\"position-relative properties-slide\">
  976.                                             <div class=\"img\" style=\"background-image: url('{{ property.pictures.0.url }}')\"  onclick=\"location.href='{{ path('project-detail', {'id': property.id}) }}'\">
  977.                                             </div>
  978.                                     </div>
  980.                                 {% else %}
  981.                                     <div class=\"img\" style=\"background-image: url('{{ asset('build/Hudson_Ontario2.png') }}')\"></div>
  982.                                 {% endif %}
  983.                                 {#
  984.                                 <div class=\"row col-md-12 justify-content-between\">
  985.                                     <ul class=\"col-md-4 items\">
  986.                                         <li class=\"item surface\">
  987.                                             <img src=\"{{ asset('img/surface.svg') }}\" class=\"surface-logo\"> {{ property.area.value == null ? '' : property.area.value ~ areaConversion(property.area.unit) }}
  988.                                         </li>
  989.                                     </ul>
  990.                                     <div class=\"col-md-8 properties-price d-flex justify-content-end\">
  991.                                         {{ property.price.value == null ? '<span style=\"font-size: 14px !important;\">sur demande</span>' : property.price.value|number_format(2, ',', ' ') ~  property.price.currency|replace({\"EUR\": \" €\"})  }}
  992.                                     </div>
  993.                                 </div>
  994.                                 #}
  996.                                 <p class=\"city\">{{ property.city.name }}</p>
  997.                                 <p class=\"project-name\">{{ property.reference }}</p>
  998.                                 <div class=\"tag-ref-projet-2\"><span class=\"text-tag-ref\">{{ typeProject(property.construction.construction_step) }}</span></div>
  999.                             </div>
  1000.                         {% endfor %}
  1001.                     </div>
  1002.                 </div>
  1005.                 <div class=\"text-center text-capitalize more-projects\">
  1006.                     <p>AFFICHER PLUS DE PROJETS</p>
  1007.                 </div>
  1008.             </div>
  1009.             {#
  1010.             <div class=\"col-lg-8 mx-auto div-svg-header content-projet\">
  1011.                 {% set sectionContent1 = content('Projets', 'Section-2') %}
  1012.                 <div id=\"section-2-project\" class=\"col-lg-6 habiter-content\">
  1013.                     <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"9.089\" height=\"14.77\" viewBox=\"0 0 9.089 14.77\">
  1014.                         <path id=\"Tracé_76\" data-name=\"Tracé 76\" d=\"M682.759,232.441h-9.089v14.77l9.089-1.931Z\" transform=\"translate(-673.669 -232.441)\" fill=\"#f6a400\"/>
  1015.                     </svg>
  1016.                     <div class=\"col-lg-9\">
  1017.                         <h1 class=\"habiter-title mb-5\">
  1018.                             {% if sectionContent1.name is defined %}{{ sectionContent1.name }}{% else %}INVESTIR À LUXEMBOURG{% endif %}
  1019.                         </h1>
  1020.                         {% if sectionContent1.content is defined %}{{ sectionContent1.content|raw }}{% else %}La demande locative est très importante au Luxembourg. En choisissant d’investir dans nos projets, vous avez l’assurance de louer très vite votre bien immobilier sans souci de devoir partir à la recherche de locataires potentiels. Votre investissement devient rapidement rentable. De plus, notre service de gestion locative peut vous accompagner dans votre démarche de A à Z.{% endif %}
  1021.                     </div>
  1022.                 </div>
  1023.                 <div id=\"display-none-mobile\" class=\"col-lg-6 habiter-img\" {% if sectionContent1.picture is defined %}style=\"background-image: url('/uploads/images/{{ sectionContent1.picture[0].path }}')\"{% endif %}>
  1024.                 </div>
  1025.             </div>
  1027.             <div class=\"col-lg-12 div-svg-header last-section-project\">
  1028.                 <div id=\"section-projet-margin\" class=\"offset-lg-2 col-lg-2\" style=\"display: flex; justify-content: flex-start;\">
  1029.                     <a id=\"link-more\" class=\"property-span-arrow\" href=\"{{ path('invest') }}\">EN SAVOIR PLUS
  1030.                         <i class=\"fas fa-arrow-right property-arrow\"></i>
  1031.                     </a>
  1032.                 </div>
  1033.                 <div class=\"col-lg-3\" style=\"display: flex;justify-content: flex-start;margin-left: 0;\">
  1034.                     <a href=\"{{ path('location-management') }}\" class=\"property-span-arrow\">LA GESTION LOCATIVE
  1035.                         <i class=\"fas fa-arrow-right property-arrow\"></i>
  1036.                     </a>
  1037.                 </div>
  1038.             </div>
  1039.             #}
  1041.         </section>
  1042.     </div>
  1043.     <div id=\"img-property-section\" class=\"container-fluid\" style=\"display: none\">
  1044.         <div class=\"col-lg-6 habiter-img\">
  1045.             <img style=\"padding: 0px;\" height=\"430px\" class=\"img-100\" {% if sectionContent1.picture is defined %}src=\"/uploads/images/{{ sectionContent1.picture[0].path }}\"{% endif %}>
  1046.         </div>
  1047.     </div>
  1050.     <script>
  1051.         const futurProjects = document.getElementById('projects')
  1052.         let buttons = document.getElementsByClassName('projectButton')
  1054.         for (const eElement of buttons) {
  1055.             eElement.addEventListener('click', function (e) {
  1056.                 e.preventDefault()
  1058.                 for (let button of buttons) {
  1059.                     if (button.classList.contains('all')){
  1060.                         button.classList.remove('all')
  1061.                         //button.classList.add('come')
  1062.                         //button.querySelector('span').classList.replace('span-all', 'span-projects')
  1063.                     }
  1064.                 }
  1066.                 eElement.classList.remove('come')
  1067.                 //eElement.classList.add('all')
  1068.                 //eElement.querySelector('span').classList.replace('span-projects', 'span-all')
  1070.                 fetch('projects/display/'+this.dataset.id, {
  1071.                     method: 'GET',
  1072.                 })
  1073.                     .then(response => response.json())
  1074.                     .then(data => {
  1075.                         futurProjects.innerHTML = ''
  1076.                         futurProjects.innerHTML = data.data
  1078.                         _ww = \$(window).width();
  1079.                         var lightbox = \$('.lightbox'),
  1080.                             item = 0;
  1082.                         \$('.lightbox-on').click(function(e){
  1083.                             e.stopPropagation();
  1084.                             item = 0;
  1085.                             console.log('click btn');
  1087.                             var id = \$(this).attr('data-id'),
  1088.                                 max = 0;
  1089.                             \$('#'+id).toggle();
  1090.                             \$('#'+id).animate({opacity: 1}, 300);
  1091.                             \$('#'+id).find('img').each(function( i ) {
  1092.                                 //console.log('h : '+\$(this).height());
  1093.                                 //console.log('w : '+\$(this).width());
  1094.                                 max = i;
  1095.                                 item = 1;
  1096.                                 counter(item, max+1);
  1097.                                 itemWidth(\$(this));
  1098.                             });
  1099.                         });
  1101.                         lightbox.click(function(e) {
  1102.                             e.stopPropagation();
  1103.                             \$(this).animate({opacity: 0}, 300, function(){
  1104.                                 \$(this).toggle();
  1105.                             });
  1106.                         });
  1108.                         \$('.closer').on('click', function (e) {
  1109.                             e.stopPropagation();
  1110.                             \$(this).parent().animate(
  1111.                                 {opacity: 0},
  1112.                                 300,
  1113.                                 function(){
  1114.                                     \$(this).toggle();
  1115.                                 }
  1116.                             );
  1117.                         });
  1119.                         function itemWidth(img){
  1120.                             img.closest('.items').width(img.width());
  1121.                         }
  1123.                         function counter(item, max){
  1124.                             \$('.counter').text(item + ' / ' + max);
  1125.                         }
  1127.                         \$('.item', lightbox).on('click, swipeleft', function (e) {
  1128.                             var wd = \$(this).width(),
  1129.                                 last = \$(this).parent().find('.item').last(),
  1130.                                 img = \$(this).find('.img');
  1131.                             itemWidth(img);
  1133.                             \$(this).animate(
  1134.                                 {marginLeft: -wd, opacity: 0},
  1135.                                 500,
  1136.                                 'swing',
  1137.                                 function(){
  1138.                                     \$(this).insertAfter(last);
  1139.                                     \$(this).css({marginLeft: 0, opacity: 1});
  1140.                                 }
  1141.                             );
  1142.                         });
  1144.                         \$('.item', lightbox).on('swiperight', function (e) {
  1145.                             var wd = \$(this).width(),
  1146.                                 first = \$(this).parent().find('.item').first(),
  1147.                                 last = \$(this).parent().find('.item').last(),
  1148.                                 img = \$(this).find('.img');
  1149.                             itemWidth(img);
  1151.                             \$(last).insertBefore(\$(this));
  1152.                             \$(last).css({marginLeft: -wd, opacity: 0});
  1153.                             \$(this).parent().find('.item').eq(0).animate(
  1154.                                 {marginLeft: 0, opacity: 1},
  1155.                                 500,
  1156.                                 'swing'
  1157.                             );
  1158.                         });
  1160.                         \$('.arrows', lightbox).on('click', function (e) {
  1161.                             e.stopPropagation();
  1163.                             var wd = \$(this).siblings('.items').find('.item').eq(0).width(),
  1164.                                 max = \$(this)
  1165.                                     .siblings('.items').find('.item').length,
  1166.                                 first = \$(this).siblings('.items').find('.item').first(),
  1167.                                 last = \$(this).siblings('.items').find('.item').last(),
  1168.                                 isRight = \$(this).hasClass('right'),
  1169.                                 marginL = isRight ? -wd : 0,
  1170.                                 marginL0 = isRight ? 0: -wd,
  1171.                                 opacOn = isRight ? 1 : 0,
  1172.                                 opacOff = isRight ? 0 : 1;
  1174.                             if (!isRight){
  1175.                                 \$(last).insertBefore(first);
  1176.                                 \$(last).css({marginLeft: -wd, opacity: 0});
  1177.                                 item++;
  1178.                                 if (item == max+1) {item = 1};
  1179.                             } else {
  1180.                                 item--;
  1181.                                 if (item == 0) {item = max};
  1182.                             };
  1184.                             counter(item, max);
  1186.                             var img = \$(this).siblings('.items').find('.item').eq(0).find('.img');
  1187.                             itemWidth(img);
  1189.                             \$(this).siblings('.items').find('.item').eq(1).animate(
  1190.                                 {opacity: opacOn},
  1191.                                 500,
  1192.                                 'swing');
  1194.                             \$(this).siblings('.items').find('.item').eq(0).animate(
  1195.                                 {marginLeft: marginL, opacity: 1},
  1196.                                 500,
  1197.                                 'swing',
  1198.                                 function(){
  1199.                                     if (isRight){
  1200.                                         \$(this).insertAfter(last);
  1201.                                         \$(this).css({ marginLeft: 0, opacity: 1});
  1202.                                     }
  1203.                                 }
  1204.                             );
  1205.                         });
  1208.                         if (_ww > 768){
  1209.                             \$('.div-img-hover-2').hover(function (e) {
  1210.                                 \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  1211.                                 var htext = \$(this).find('.project-content').height();
  1212.                                 if (htext == undefined){htext = 0};
  1213.                                 \$(this).find('.div-hover-2').animate({height : htext+180}, 150);
  1214.                                 \$(this).find('.project-content').css({'visibility': 'visible'});
  1215.                                 \$(this).find('.project-content').animate({opacity: 1}, 150);
  1216.                             }, function() {
  1217.                                 console.log('down');
  1218.                                 \$(this).find('.div-hover-2').animate({height : 85}, 150);
  1219.                                 \$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  1221.                                 \$(this).find('.project-content').animate({opacity: 0}, 150, function(){
  1222.                                     \$(this).find('.project-content').css({'visibility': 'hidden'});
  1223.                                 });
  1224.                             });
  1225.                         } else {
  1226.                             \$('.div-img-hover-2').on( \"tap\", function( event ) {
  1227.                                 console.log('tap tap');
  1228.                                 var opened = \$(this).find('.div-hover-2').hasClass('open'),
  1229.                                     ht = opened ? 85 : '100%',
  1230.                                     vis = opened ? 0 : 1;
  1231.                                 \$(this).find('.div-hover-2').toggleClass('open');
  1232.                                 \$(this).find('.div-hover-2').animate({height : ht}, 150);
  1233.                                 \$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  1234.                             });
  1235.                         }
  1236.                         \$('.div-hover').hover(function (e) {
  1237.                             \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  1238.                         }, function() {
  1239.                             \$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  1240.                         });
  1241.                     })
  1242.                     .catch((error) => {
  1243.                         console.error('Error:', error);
  1244.                     });
  1245.             })
  1246.         }
  1250.         if (window.matchMedia(\"(max-width: 768px)\").matches) {
  1251.             const test = document.getElementsByClassName('select-filter')
  1253.             for (const testElement of test) {
  1254.                 testElement.addEventListener('click', function (e) {
  1255.                     e.preventDefault()
  1256.                     testElement.classList.toggle('select-projet-active')
  1257.                     const infos = document.querySelector('.projectButton.all')
  1258.                     const dataId = []
  1259.                     const tests = document.querySelectorAll('.select-filter.select-projet-active')
  1260.                     for (const test1 of tests) {
  1261.                         dataId.push(parseFloat(test1.dataset.id))
  1262.                     }
  1263.                     fetch('projects/display/'+infos.dataset.id+'/params/' + JSON.stringify(dataId), {
  1264.                         method: 'GET'
  1265.                     })
  1266.                         .then(response => response.json())
  1267.                         .then(data => {
  1268.                             futurProjects.innerHTML = data.data
  1269.                         })
  1270.                         .catch((error) => {
  1271.                             console.error('Error:', error);
  1272.                         });
  1273.                 })
  1274.             }
  1275.         } else {
  1276.             const test = document.getElementsByClassName('select-projet')
  1277.             for (const testElement of test) {
  1278.                 testElement.addEventListener('click', function (e) {
  1279.                     displayLoading()
  1280.                     e.preventDefault()
  1281.                     testElement.classList.toggle('select-projet-active')
  1282.                     const infos = document.querySelector('.projectButton.all')
  1283.                     const dataId = []
  1284.                     const tests = document.querySelectorAll('.select-projet.select-projet-active')
  1285.                     for (const test1 of tests) {
  1286.                         dataId.push(parseFloat(test1.dataset.id))
  1287.                     }
  1289.                     fetch('projects/display/'+infos.dataset.id+'/params/' + JSON.stringify(dataId), {
  1290.                         method: 'GET'
  1291.                     })
  1292.                         .then(response => response.json())
  1293.                         .then(data => {
  1294.                             hideLoading()
  1295.                             futurProjects.innerHTML = data.data
  1301.                             _ww = \$(window).width();
  1302.                             var lightbox = \$('.lightbox'),
  1303.                                 item = 0;
  1305.                             \$('.lightbox-on').click(function(e){
  1306.                                 e.stopPropagation();
  1307.                                 item = 0;
  1308.                                 console.log('click btn');
  1310.                                 var id = \$(this).attr('data-id'),
  1311.                                     max = 0;
  1312.                                 \$('#'+id).toggle();
  1313.                                 \$('#'+id).animate({opacity: 1}, 300);
  1314.                                 \$('#'+id).find('img').each(function( i ) {
  1315.                                     //console.log('h : '+\$(this).height());
  1316.                                     //console.log('w : '+\$(this).width());
  1317.                                     max = i;
  1318.                                     item = 1;
  1319.                                     counter(item, max+1);
  1320.                                     itemWidth(\$(this));
  1321.                                 });
  1322.                             });
  1324.                             lightbox.click(function(e) {
  1325.                                 e.stopPropagation();
  1326.                                 \$(this).animate({opacity: 0}, 300, function(){
  1327.                                     \$(this).toggle();
  1328.                                 });
  1329.                             });
  1331.                             \$('.closer').on('click', function (e) {
  1332.                                 e.stopPropagation();
  1333.                                 \$(this).parent().animate(
  1334.                                     {opacity: 0},
  1335.                                     300,
  1336.                                     function(){
  1337.                                         \$(this).toggle();
  1338.                                     }
  1339.                                 );
  1340.                             });
  1342.                             function itemWidth(img){
  1343.                                 img.closest('.items').width(img.width());
  1344.                             }
  1346.                             function counter(item, max){
  1347.                                 \$('.counter').text(item + ' / ' + max);
  1348.                             }
  1350.                             \$('.item', lightbox).on('click, swipeleft', function (e) {
  1351.                                 var wd = \$(this).width(),
  1352.                                     last = \$(this).parent().find('.item').last(),
  1353.                                     img = \$(this).find('.img');
  1354.                                 itemWidth(img);
  1356.                                 \$(this).animate(
  1357.                                     {marginLeft: -wd, opacity: 0},
  1358.                                     500,
  1359.                                     'swing',
  1360.                                     function(){
  1361.                                         \$(this).insertAfter(last);
  1362.                                         \$(this).css({marginLeft: 0, opacity: 1});
  1363.                                     }
  1364.                                 );
  1365.                             });
  1367.                             \$('.item', lightbox).on('swiperight', function (e) {
  1368.                                 var wd = \$(this).width(),
  1369.                                     first = \$(this).parent().find('.item').first(),
  1370.                                     last = \$(this).parent().find('.item').last(),
  1371.                                     img = \$(this).find('.img');
  1372.                                 itemWidth(img);
  1374.                                 \$(last).insertBefore(\$(this));
  1375.                                 \$(last).css({marginLeft: -wd, opacity: 0});
  1376.                                 \$(this).parent().find('.item').eq(0).animate(
  1377.                                     {marginLeft: 0, opacity: 1},
  1378.                                     500,
  1379.                                     'swing'
  1380.                                 );
  1381.                             });
  1383.                             \$('.arrows', lightbox).on('click', function (e) {
  1384.                                 e.stopPropagation();
  1386.                                 var wd = \$(this).siblings('.items').find('.item').eq(0).width(),
  1387.                                     max = \$(this)
  1388.                                         .siblings('.items').find('.item').length,
  1389.                                     first = \$(this).siblings('.items').find('.item').first(),
  1390.                                     last = \$(this).siblings('.items').find('.item').last(),
  1391.                                     isRight = \$(this).hasClass('right'),
  1392.                                     marginL = isRight ? -wd : 0,
  1393.                                     marginL0 = isRight ? 0: -wd,
  1394.                                     opacOn = isRight ? 1 : 0,
  1395.                                     opacOff = isRight ? 0 : 1;
  1397.                                 if (!isRight){
  1398.                                     \$(last).insertBefore(first);
  1399.                                     \$(last).css({marginLeft: -wd, opacity: 0});
  1400.                                     item++;
  1401.                                     if (item == max+1) {item = 1};
  1402.                                 } else {
  1403.                                     item--;
  1404.                                     if (item == 0) {item = max};
  1405.                                 };
  1407.                                 counter(item, max);
  1409.                                 var img = \$(this).siblings('.items').find('.item').eq(0).find('.img');
  1410.                                 itemWidth(img);
  1412.                                 \$(this).siblings('.items').find('.item').eq(1).animate(
  1413.                                     {opacity: opacOn},
  1414.                                     500,
  1415.                                     'swing');
  1417.                                 \$(this).siblings('.items').find('.item').eq(0).animate(
  1418.                                     {marginLeft: marginL, opacity: 1},
  1419.                                     500,
  1420.                                     'swing',
  1421.                                     function(){
  1422.                                         if (isRight){
  1423.                                             \$(this).insertAfter(last);
  1424.                                             \$(this).css({ marginLeft: 0, opacity: 1});
  1425.                                         }
  1426.                                     }
  1427.                                 );
  1428.                             });
  1431.                             if (_ww > 768){
  1432.                                 \$('.div-img-hover-2').hover(function (e) {
  1433.                                     \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  1434.                                     var htext = \$(this).find('.project-content').height();
  1435.                                     if (htext == undefined){htext = 0};
  1436.                                     \$(this).find('.div-hover-2').animate({height : htext+180}, 150);
  1437.                                     \$(this).find('.project-content').css({'visibility': 'visible'});
  1438.                                     \$(this).find('.project-content').animate({opacity: 1}, 150);
  1439.                                 }, function() {
  1440.                                     console.log('down');
  1441.                                     \$(this).find('.div-hover-2').animate({height : 85}, 150);
  1442.                                     \$(this).find('.project-arrow-2').animate({opacity: 0}, 150);
  1444.                                     \$(this).find('.project-content').animate({opacity: 0}, 150, function(){
  1445.                                         \$(this).find('.project-content').css({'visibility': 'hidden'});
  1446.                                     });
  1447.                                 });
  1448.                             } else {
  1449.                                 \$('.div-hover-2').on( \"click\", function( event ) {
  1450.                                     console.log('tap tap');
  1451.                                     var opened = \$(this).find('.div-hover-2').hasClass('open'),
  1452.                                         ht = opened ? 85 : '100%',
  1453.                                         vis = opened ? 0 : 1;
  1454.                                     \$(this).find('.div-hover-2').toggleClass('open');
  1455.                                     \$(this).find('.div-hover-2').animate({height : ht}, 150);
  1456.                                     \$(this).find('.project-arrow-2').animate({opacity: vis}, 150);
  1457.                                 });
  1458.                             }
  1459.                             \$('.div-hover').hover(function (e) {
  1460.                                 \$(this).find('.project-arrow-2').animate({opacity: 1}, 150);
  1461.                             }, function() {
  1462.                                 \$(this).find('.project-arrow-2').animate({opacity: 0}, 50);
  1463.                             });
  1466.                         })
  1467.                         .catch((error) => {
  1468.                             console.error('Error:', error);
  1469.                         });
  1470.                 })
  1471.             }
  1472.         }
  1474.         const buttonFilter = document.getElementsByClassName('select-projet')
  1475.         for (const buttonFilterElement of buttonFilter) {
  1476.             buttonFilterElement.addEventListener('click', function () {
  1478.             })
  1479.         }
  1481.         if (window.matchMedia(\"(max-width: 768px)\").matches) {
  1482.             new Flicking(\"#flick4\", {
  1483.                 moveType: \"freeScroll\",
  1484.                 bound: true
  1485.             });
  1487.         }
  1489.         const filter = document.getElementById('filters')
  1490.         const filterElement = document.getElementById('form-search-filter-ajax')
  1491.         filter.addEventListener('click', function (e) {
  1492.             e.preventDefault()
  1493.             filterElement.classList.toggle('show')
  1494.         })
  1497.         const loader = document.querySelector(\"#loading\");
  1499.         function displayLoading() {
  1500.             loader.classList.add(\"display\");
  1501.             // to stop loading after some time
  1502.             setTimeout(() => {
  1503.                 loader.classList.remove(\"display\");
  1504.             }, 5000);
  1505.         }
  1507.         // hiding loading
  1508.         function hideLoading() {
  1509.             loader.classList.remove(\"display\");
  1510.         }
  1511.     </script>
  1512. {% endblock %}
  1513. ", "project.html.twig", "/home/juca-stage/sites/sym/tracol/templates/project.html.twig");
  1514.     }
  1515. }