export function makeItFloat(target){
    let startTarget = target.querySelector('.title');

    console.log('selected target :', startTarget);

    let startX, startY;
    let clicked = false;

    startTarget.addEventListener('mousedown', (event) => {
    startX = event.pageX;
    startY = event.pageY;
    clicked = true;
    console.log('clicking...')
    })

    document.addEventListener('mousemove', (event) => {
    if(clicked){
        console.log('moving...')
        let currentX = event.pageX;
        let currentY = event.pageY;
        let moveX = target.offsetLeft + currentX - startX;
        target.style.left =  moveX + 'px';
        let moveY = target.offsetTop + currentY - startY;
        target.style.top = moveY + 'px';
        startX = currentX;
        startY = currentY;
    }
    });

    document.addEventListener('mouseup', () => {
    console.log('STOP !')
    clicked = false;
    })
}