//---元素拖动插件
const dragging = (data) => {
	var $this = data.dom;
	var xPage;
	var yPage;
	var X; //
	var Y; //
	var xRand = 0; //
	var yRand = 0; //
	var father = getParent($this);
	var defaults = {
		move: 'both',
		randomPosition: true,
		hander: 1,
		notelement: '.bf-container',
	};
	var opt = Object.assign(defaults, data);
	var movePosition = opt.move;
	var random = opt.randomPosition;

	var hander = opt.hander;
	var notelement = opt.notelement;
	if (hander == 1) {
		hander = $this;
	} else {
		hander = document.querySelectorAll('.hander')[0];
	}
	// hander.setAttribute('style', 'cursor: move');
	//---初始化
	father.style.position = 'relative';
	father.style.overflow = 'hidden';
	$this.style.position = 'absolute';
	hander.style.cursor = 'move';
	var faWidth = father.clientWidth;
	var faHeight = father.clientHeight;
	var computedStyle = getComputedStyle($this);
	var thisWidth = $this.clientWidth + parseInt(computedStyle.paddingLeft) + parseInt(computedStyle.paddingRight);
	var thisHeight = $this.clientHeight + parseInt(computedStyle.paddingTop) + parseInt(computedStyle.paddingBottom);

	var mDown = false; //
	var positionX;
	var positionY;
	var moveX;
	var moveY;

	if (random) {
		thisRandom();
	}
	function thisRandom() {
		//随机函数
		this.forEach(function (elem) {
			var randY = Math.floor(Math.random() * (faHeight - thisHeight));
			var randX = Math.floor(Math.random() * (faWidth - thisWidth));
			if (movePosition.toLowerCase() === 'x') {
				elem.style.left = randX + 'px';
			} else if (movePosition.toLowerCase() === 'y') {
				elem.style.top = randY + 'px';
			} else if (movePosition.toLowerCase() === 'both') {
				elem.style.top = randY + 'px';
				elem.style.left = randX + 'px';
			}
		});
	}
	hander.addEventListener('mousedown', function (e) {
		// 假设 father 是你的父元素的 ID
		var children = father.children; // 获取所有子元素
		for (var i = 0; i < children.length; i++) {
			if (children[i] !== notelement) {
				children[i].style.zIndex = '1';
			}
		}

		$this.style.zIndex = '2';
		mDown = true;
		X = e.pageX;
		Y = e.pageY;
		var rect = $this.getBoundingClientRect();
		positionX = rect.left;
		positionY = rect.top;
		return false;
	});
	document.addEventListener('mouseup', function (e) {
		mDown = false;
	});

	document.addEventListener('mousemove', function (e) {
		xPage = e.pageX; //--
		moveX = positionX + xPage - X;

		yPage = e.pageY; //--
		moveY = positionY + yPage - Y;

		const thisXMove = () => {
			//x轴移动
			if (mDown) {
				$this.style.left = moveX + 'px';
			} else {
				return;
			}

			if (moveX < 0) {
				$this.style.left = '0';
			}
			if (moveX > faWidth - thisWidth) {
				$this.style.left = faWidth - thisWidth + 'px';
			}

			return moveX;
		};

		const thisYMove = () => {
			//y轴移动
			if (mDown) {
				$this.style.top = moveY + 'px';
			} else {
				return;
			}

			if (moveY < 0) {
				$this.style.top = '0';
			}
			if (moveY > faHeight - thisHeight) {
				$this.style.top = faHeight - thisHeight + 'px';
			}

			return moveY;
		};

		const thisAllMove = () => {
			//全部移动
			if (mDown) {
				$this.style.left = moveX - thisWidth + 'px';
				$this.style.top = moveY - thisHeight + 'px';
			} else {
				return;
			}

			if (moveX < 0) {
				$this.style.left = '0';
			}
			if (moveX > faWidth - thisWidth) {
				$this.style.left = faWidth - thisWidth + 'px';
			}

			if (moveY < 0) {
				$this.style.top = '0';
			}
			if (moveY > faHeight - thisHeight) {
				$this.style.top = faHeight - thisHeight + 'px';
			}
		};
		if (movePosition.toLowerCase() == 'x') {
			thisXMove();
		} else if (movePosition.toLowerCase() == 'y') {
			thisYMove();
		} else if (movePosition.toLowerCase() == 'both') {
			thisAllMove();
		}
	});
};

const getParent = (dom) => {
	return dom.parentNode;
};
export default dragging;