{{ encore_entry_script_tags('frontend') }}
        <!-- jQuery-V1.12.4 -->
        <script src="{{asset('themes/ilaveu/js/vendor/jquery-1.12.4.min.js')}}"></script>
        <!-- Popper js -->
        <script src="{{asset('themes/ilaveu/js/vendor/popper.min.js')}}"></script>
        <!-- Bootstrap V4.1.3 Fremwork js -->
        <script src="{{asset('themes/ilaveu/js/bootstrap.min.js')}}"></script>
        <!-- Ajax Mail js -->
        <script src="{{asset('themes/ilaveu/js/ajax-mail.js')}}"></script>
        <!-- Meanmenu js -->
        <script src="{{asset('themes/ilaveu/js/jquery.meanmenu.min.js')}}"></script>
        <!-- Wow.min js -->
        <script src="{{asset('themes/ilaveu/js/wow.min.js')}}"></script>
        <!-- Slick Carousel js -->
        <script src="{{asset('themes/ilaveu/js/slick.min.js')}}"></script>
        <!-- Owl Carousel-2 js -->
        <script src="{{asset('themes/ilaveu/js/owl.carousel.min.js')}}"></script>
        <!-- Magnific popup js -->
        <script src="{{asset('themes/ilaveu/js/jquery.magnific-popup.min.js')}}"></script>
        <!-- Isotope js -->
        <script src="{{asset('themes/ilaveu/js/isotope.pkgd.min.js')}}"></script>
        <!-- Imagesloaded js -->
        <script src="{{asset('themes/ilaveu/js/imagesloaded.pkgd.min.js')}}"></script>
        <!-- Mixitup js -->
        <script src="{{asset('themes/ilaveu/js/jquery.mixitup.min.js')}}"></script>
        <!-- Countdown -->
        <script src="{{asset('themes/ilaveu/js/jquery.countdown.min.js')}}"></script>
        <!-- Counterup -->
        <script src="{{asset('themes/ilaveu/js/jquery.counterup.min.js')}}"></script>
        <!-- Waypoints -->
        <script src="{{asset('themes/ilaveu/js/waypoints.min.js')}}"></script>
        <!-- Barrating -->
        <script src="{{asset('themes/ilaveu/js/jquery.barrating.min.js')}}"></script>
        <!-- Jquery-ui -->
        <script src="{{asset('themes/ilaveu/js/jquery-ui.min.js')}}"></script>
        <!-- Venobox -->
        <script src="{{asset('themes/ilaveu/js/venobox.min.js')}}"></script>
        <!-- Nice Select js -->
        <script src="{{asset('themes/ilaveu/js/jquery.nice-select.min.js')}}"></script>
        

        <script src="{{asset('themes/ilaveu/js/price-range/price_range_script.js')}}" type="text/javascript"></script>

        <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
        <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>

        <!-- LocalStorage cart -->

        <script src="{{asset('flexy/js/cart-localstorage.js')}}" defer></script>
        <!-- Main/Activator js -->


   
    
    <script async src="{{asset('themes/ilaveu/laundry/js/bundle.js')}}"></script>

        <script src="{{asset('themes/ilaveu/js/main.js')}}"></script>




        <script>


            document.addEventListener("turbo:load",function(){

            
            $(document).ready(function(){

                


                            $(".sidebar-categores-box input[type='checkbox']").change(function(){
                                $(".form-filter-sidebar").submit();
                            });

                            $.extend($.validator.messages, {
                                required: "Ce champs est obligatoire",
                            });
                           





                //$("a").not(".menu-item a,.li-product-menu a").attr("href","#");// Disable Links temporary



               

            });

            });
        </script>





<script>



    var total= 0;
    var difference= 0;
    var amount=0;
    var reduction=0;
    var reductionCoupon=0;
    var cash = 0;
    var shippingFees = 0;
    var shippingTips = 0
    var walletPayment = 0;
document.addEventListener("turbo:load",function(){
$(document).ready(function(){

    
    difference= cartLS.total()+ shippingFees + shippingTips;
    total= cartLS.total();


function renderCart(items) {


      const $cart = document.querySelector(".cart")
      const $total = document.querySelector(".total")


        const $cartCheckout = document.querySelector(".cart-checkout")
        const $totalCheckout = document.querySelector(" .total-checkout")

        const $cartDevis = document.querySelector(".cart-devis")
        const $totalDevis = document.querySelector(" .total-devis")


                                            

    const $miniCart = document.querySelector(".minicart-product-list");
    const $miniCartTotal = document.querySelector(".minicart-total span");
    const $singleProductArea = document.querySelector(".single-product-area");

        
        
            var prefixUrl = "{{settings.get.rootUrl}}";

  $miniCart.innerHTML = items.map((item) => `


                                                        <li data-id="${item.id}">
                                                        <a href="${item.url}" class="minicart-product-image">
                                                            <img src="${item.image}" alt="cart products">
                                                        </a>
                                                        <div class="minicart-product-details">
                                                            <h6><a href="#">${item.name}</a></h6>
                                                            <button data-id="${item.id}" type="button" class="btn   btn-block btn-sm  decrease-quantite-to-cart"
            ><i class="fas fa-minus"></i></button>
                                                            <span class="pl-3 pr-3" > ${item.quantity} x ${item.price} MAD</span>

                                                            
          
        
        
          <button data-id="${item.id}" type="button" class="btn   btn-block btn-sm  increase-quantite-to-cart"
            ><i class="fas fa-plus"></i></button>
        
                                                        </div>
                                                        <button data-id="${item.id}" class="close delete-product-from-cart " title="Supprimer">
                                                            <i class="fa fa-close"></i>
                                                        </button>
                                                    </li>
`).join("");

  $miniCartTotal.innerHTML =  cartLS.total() + " MAD";


/*

  const $cart = document.querySelector(".cart")
  const $total = document.querySelector(".total")

  $cart.innerHTML = items.map((item) => `
      <tr data-id="${item.id}">
        <td>${item.name}</td>
        <td style="width: 60px;"> 
          <button data-id="${item.id}" type="button" class="btn   btn-block btn-sm  decrease-quantite-to-cart"
            ><i class="fas fa-minus"></i></button>
        </td>
        <td style="width: 60px;"> 
          <button data-id="${item.id}" type="button" class="btn   btn-block btn-sm  increase-quantite-to-cart"
            ><i class="fas fa-plus"></i></button>
        </td>
        <td style="white-space:nowrap;" class="text-right">${item.quantity} x ${item.price} MAD</td>
        <td  class="text-right">${item.price * item.quantity}  MAD</td>
        <td class="text-right"><Button data-id="${item.id}" class="btn btn-danger  delete-product-from-cart" ><i class="fas fa-trash-alt"></i></Button></td>
      </tr>`).join("");

  $total.innerHTML =  cartLS.total() + "MAD";


*/



if($cart){
 $cart.innerHTML = items.map((item) => `
                                            <tr data-id="${item.id}" >
                                                <td data-id="${item.id}" class="li-product-remove delete-product-from-cart"><a onclick="return false;" href="#">x</a></td>
                                                <td class="li-product-thumbnail"><img height="50" src="../../${item.image}" alt="${item.name}"></td>
                                                <td class="li-product-name">${item.name}</td>
                                                <td class="li-product-price"><span class="amount">MAD ${item.price}</span></td>
                                                <td class="quantity">
                                                    <label>Quantité</label>
                                                    <div class="cart-plus-minus">
                                                        <input readonly class="cart-plus-minus-box" value="${item.quantity}" type="text">
                                                        <div data-id="${item.id}" class="dec qtybutton decrease-quantite-to-cart"><i class="fa fa-angle-down"></i></div>
                                                        <div data-id="${item.id}" class="inc qtybutton increase-quantite-to-cart"><i class="fa fa-angle-up"></i></div>
                                                    </div>
                                                </td>
                                                <td class="product-subtotal"><span class="amount">MAD ${item.price * item.quantity}</span></td>
                                            </tr>
`).join("");
$total.innerHTML =  cartLS.total() + "MAD";


}

if($cartDevis){
 $cartDevis.innerHTML = items.map((item) => `

  <tr>
                            <td data-id="${item.id}" class="no">${item.id}</td>
                            <td class="text-left">
                            <p>
                               ${item.name}
                            </p>
                            </td>
                            <td class="unit"> ${item.price} MAD</td>
                            <td class="qty">${item.quantity} </td>
                            <td class="total">${item.price * item.quantity} MAD</td>
                        </tr>
                                           
`).join("");
$totalDevis.innerHTML =  cartLS.total() + "MAD";


}


if($cartCheckout){
 $cartCheckout.innerHTML = items.map((item) => `
                                              <tr class="cart_item">
                                              <td class="cart-product-name"> ${item.name}<strong class="product-quantity"> × ${item.quantity}</strong></td>
                                              <td class="cart-product-total"><span class="amount">${item.price * item.quantity} MAD</span></td>  
                                            </tr>
`).join("");
$totalCheckout.innerHTML =  cartLS.total() + "MAD";


}



 $(".hm-minicart-trigger .item-text span").text(cartLS.total() + " MAD");
 $(".total-checkout").text(cartLS.total() + " MAD");
$(".hm-minicart .cart-item-count").text(cartLS.list().length);
  

                                            


}
renderCart(cartLS.list());


cartLS.onChange(renderCart);


$(".add-product-to-cart").click(function(){

var id = "p-"+$(this).attr("data-id");
var idProduct = $(this).attr("data-id");
var name = $(this).attr("data-name");
var price = $(this).attr("data-price");
var image = $(this).attr("data-image");
var productType = $(this).attr("data-product-type");
var url = $(this).attr("data-url");
var attributes = $(this).attr("data-attribute");
var quantity = 1;




if(attributes == "true"){

    var quantityAttribut = $($(this).attr("data-container-id")).find("input[name='quantity-attribut']").val();
    var dimensionAttribut = $($(this).attr("data-container-id")).find("input[name='dimension-attribut']").val();
    var pricePerAttribut = $($(this).attr("data-container-id")).find("select[name='attribute-option-price'] option:selected").val();
    
    
    var attributName = $($(this).attr("data-container-id")).find("select[name='attribute-option-price'] option:selected").text();

    price = (parseFloat(pricePerAttribut) * parseFloat(dimensionAttribut) );
    quantity = parseFloat(quantityAttribut);
    var replacedStrDimensionAttribut = dimensionAttribut.replace(/,/g, "-");
    id = "pv-" + $(this).attr("data-id")+replacedStrDimensionAttribut;

    name = name + "("+dimensionAttribut+" "+  attributName +" )";
}


//To Review
 if(productType == "pack"){
    cartLS.destroy();
} 

cartLS.add({
  id: id,
  idProduct: idProduct,
  image:image,
  name: name, 
  price: price,
  productType:productType,
  quantity:quantity,
  notes:[
    {
    id:id,
    noteId:1,
    note:"",
  }
  ],
  attributes:[],
  client:{
      name:"Adil",
      type:"Client Fidele",
  }
});
cartLS.onChange(renderCart);
console.log(cartLS.list());
if(cartLS.exists(id)){
$("#qty-"+id).text(cartLS.get(id).quantity);
}else{
        $("#qty-"+id).text(0);
    }

});

function updateCartNotes(id,updateMethod="add"){


    var currentLigneCart =  cartLS.get(id);

    

        // this will be executed at the end of the loop
            if(updateMethod=="add"){
                    
                        cartLS.quantity(id, 1);

                        cartLS.onChange(renderCart);
                }
                else if(updateMethod=="remove") {
                    
                        cartLS.quantity(id, -1);
                    
                        cartLS.onChange(renderCart);
                }

                
                
             
            
    
    
    


    

    
   

    

}

$("body").on("click",".increase-quantite-to-cart",function(){

    console.log(cartLS.list());
   var id = $(this).attr("data-id");

    updateCartNotes(id,"add");
    cartLS.onChange(renderCart);
    if(cartLS.exists(id)){
        $("#qty-"+id).text(cartLS.get(id).quantity);
    }else{
        $("#qty-"+id).text(0);
    }
});

$("body").on("click",".decrease-quantite-to-cart",function(){

    var id = $(this).attr("data-id");
    

    updateCartNotes(id,"remove");
    cartLS.onChange(renderCart);
    if(cartLS.exists(id)){
        $("#qty-"+id).text(cartLS.get(id).quantity);
    }else{
        $("#qty-"+id).text(0);
    }
   
});

$(".decrease-product-from-cart").click(function(){

    var id = $(this).attr("data-id");
    cartLS.quantity(id, -1);
    cartLS.onChange(renderCart);
   
});



$(".cart, .minicart-product-list,.Shopping-cart-area").on("click",".delete-product-from-cart",function(){

    var id = $(this).attr("data-id");

    cartLS.remove(id);
    cartLS.onChange(renderCart);

    if(cartLS.list().length == 0){
        $(".checkout-area").html($(".cart-is-empty").html());
    }
});

$(".destroy-cart").click(function(){
    cartLS.destroy();
});

$("#cash").keyup(function(){
    var total = cartLS.total();
    var cash = $(this).val();
    var difference = cash-total;
    $(".difference-cash").html(difference+ " MAD");
});




});


 $(document).ready(function() {
   
 
    $(".alert-success").fadeTo(2000, 500).slideUp(500, function() {
     $(".alert-success").hide();
    });


    $(".copy-minicart").html($(".minicart").html())
  
});
    
$(function() {
    /**
    * Smooth scrolling to page anchor on click
    **/
    $("a.smoothlink[href*='#']:not([href='#'])").click(function() {
        if (
            location.hostname == this.hostname
            && this.pathname.replace(/^\//,"") == location.pathname.replace(/^\//,"")
        ) {
            var anchor = $(this.hash);
            anchor = anchor.length ? anchor : $("[name=" + this.hash.slice(1) +"]");
            if ( anchor.length ) {
                $("html, body").animate( { scrollTop: anchor.offset().top - 200 }, 1000);
            }
        }
    });


    
});
});

</script>

    <script>
      ;(function ($) {

        var targetOffset = 150;

        var $w = $(window).scroll(function(){
            if ( $w.scrollTop() > targetOffset ) {   
                $('.tt-logo ').css({"width":"100px"});
                $("#tt-header").css({
                    "position":"fixed",
                    "top":0,
                    "right":0,
                    "width": "100%",
                    "box-shadow":" 0px 2px 6px #00000016"
                    });
            } else {
                $('.tt-logo ').css({
                    "width":"130px"
                    });
                $("#tt-header").css({"position":"relative","box-shadow":"none"});
            }
        });

        $('.tt-colorswatch-btn').on('click', function (e) {
          $(this).closest('.tt-colorswatch').toggleClass('tt-open-swatch')
          return false
        })
        $('.js-swatch-color').on('click', function (e) {
          var color = $(this).attr('data-color'),
            imgSrc = $(this).attr('data-img'),
            objImg = $('#js-stepbox__nav .stepbox-dots__line02')

          objImg.css('background-image', 'url(images/' + imgSrc + ')')

          if (color != undefined) {
            $('link[href*="css/style"]').attr(
              'href',
              'css/style-color-0' + color + '.css',
            )
          } else {
            $('link[href*="css/style"]').attr('href', 'css/style.css')
          }
          $('.js-swatch-color').removeClass('active')
          $(this).toggleClass('active')

          e.preventDefault()
        })
      })(jQuery)
    </script>