/*
 * @Autor: Wwh
 * @Date: 2021-08-29 19:55:52
 * @LastEditors: mabo 9086467+mabo19920219@user.noreply.gitee.com
 * @LastEditTime: 2023-01-31 13:34:56
 * @Description: In User Settings Edit
 * @FilePath: \ClientEarth\src\directives\directive.js
 */

const directive = {
    'drag': {
        //当绑定元素插入到 Dom中
        inserted: (el, binding, vnode) => {
            let oDiv = el; // 获取当前元素

            oDiv.onmousedown = (e) => {
                stopDetaultAction(e)
                let parentDiv = e.target.offsetParent
                let offsetX = parseInt(parentDiv.offsetLeft); // 获取当前的x轴距离
                let offsetY = parseInt(parentDiv.offsetTop); // 获取当前的y轴距离

                let innerX = e.clientX - offsetX; // 获取鼠标在方块内的x轴距
                let innerY = e.clientY - offsetY; // 获取鼠标在方块内的y轴距

                // 鼠标移动的时候不停的修改div的left和top值
                document.onmousemove = function(event) {
                    parentDiv.style.left = event.clientX - innerX + "px";
                    parentDiv.style.top = event.clientY - innerY + "px";

                    // 边界判断
                    if (parseInt(parentDiv.offsetLeft) <= 0) {
                        parentDiv.style.left = "0px";
                    }
                    if (parseInt(parentDiv.offsetTop) <= 0) {
                        parentDiv.style.top = "0px";
                    }
                    if (parseInt(parentDiv.offsetLeft) >= window.innerWidth - parseInt(parentDiv.offsetWidth)) {
                        parentDiv.style.left = window.innerWidth - parseInt(parentDiv.offsetWidth) + "px";
                    }
                    if (parseInt(parentDiv.style.top) >= window.innerHeight - parseInt(parentDiv.offsetHeight)) {
                        parentDiv.style.top = window.innerHeight - parseInt(parentDiv.offsetHeight) + "px";
                    }
                }
                document.onmouseup = function() {
                    document.onmousemove = null;
                    document.onmouseup = null;

                }
            }
        }
    }
}

function stopDetaultAction(ev) {
    if (ev && ev.stopPropagation) {
        ev.stopPropagation();
    } else {
        ev.cancelBubble = true;
    }
    if (ev && ev.preventDefault) {
        ev.preventDefault();
    } else {
        window.event.returnValue = false;
    }
}
//自定义指令添加监听事件

// domEl.add





export { directive };