$(document).ready(function(){
    //THIS IS TOP MENU
    const slider = document.querySelector('#top-menu');
    let isDown = false;
    let startX;
    let scrollLeft;
    slider.addEventListener('mousedown', (e) => {
      isDown = true;
      startX = e.pageX - slider.offsetLeft;
      scrollLeft = slider.scrollLeft;
    });
    slider.addEventListener('mouseleave', () => {
      isDown = false;
    });
    slider.addEventListener('mouseup', () => {
      isDown = false;
    });
    slider.addEventListener('mousemove', (e) => {
      if(!isDown) return;
      e.preventDefault();
      const x = e.pageX - slider.offsetLeft;
      const walk = (x - startX) * 1; 
      slider.scrollLeft = scrollLeft - walk;
    });

    //THIS IS BODY
    let isDownY = false;
    let startY;
    let scrollTop;
    const slider2 = document.querySelector('.bgh-body-container');
    slider2.addEventListener('mousedown', (e) => {
      isDownY = true;
      startY = e.pageY - slider2.offsetTop;
      scrollTop = slider2.scrollTop;
    });
    slider2.addEventListener('mouseleave', () => {
      isDownY = false;
      BODY_AFTER_DRAG = false;
    });
    slider2.addEventListener('mouseup', () => {
      isDownY = false;
      BODY_AFTER_DRAG = false;
    });
    slider2.addEventListener('mousemove', (e) => {
      if(!isDownY){
        return;
      }
      BODY_AFTER_DRAG = true;
      console.log("NGEDRAGGG..................");
      e.preventDefault();
      const x = e.pageY - slider2.offsetTop;
      const walk = (x - startY) * 1; 
      slider2.scrollTop = scrollTop - walk;
    });


    //THIS IS CART
    let isDownY3 = false;
    let startY3;
    let scrollTop3;
    const slider3 = document.querySelector('#bgh-body-cart');
    slider3.addEventListener('mousedown', (e) => {
      isDownY3 = true;
      startY3 = e.pageY - slider3.offsetTop;
      scrollTop3 = slider3.scrollTop;
      console.log("Mouse Down STARTY3 "+startY3+" : SCROLTOP3 "+scrollTop3)

    });
    slider3.addEventListener('mouseleave', () => {
      console.log("Mouse LEAVE STARTY3 "+startY3+" : SCROLTOP3 "+scrollTop3)
      isDownY3 = false;
      IS_CART_DRAGGED = false;
    });
    slider3.addEventListener('mouseup', () => {
      console.log("Mouse UP STARTY3 "+startY3+" : SCROLTOP3 "+scrollTop3)
      isDownY3 = false;
      IS_CART_DRAGGED = false;
    });
    slider3.addEventListener('mousemove', (e) => {
      if(!isDownY3) {
        return
      };
      IS_CART_DRAGGED = true;
      e.preventDefault();
      console.log("Mouse MOVE STARTY3 "+startY3+" : SCROLTOP3 "+scrollTop3)

      const x3 = e.pageY - slider3.offsetTop;
      const walk3 = (x3 - startY3) * 1;
      console.log(x3+" : "+scrollTop3+" - "+walk3); 
      if(Math.abs(walk3)>10){
        slider3.scrollTop = scrollTop3 - walk3;
      }
    });
});