import EventEmitter from 'eventemitter3' /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 14:53:09 * @Desc: 事件类 */ class Event extends EventEmitter { /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 14:53:25 * @Desc: 构造函数 */ constructor(opt = {}) { super() this.opt = opt this.mindMap = opt.mindMap this.isMousedown = false this.mousedownPos = { x: 0, y: 0 } this.mousemovePos = { x: 0, y: 0 } this.mousemoveOffset = { x: 0, y: 0 } this.bindFn() this.bind() } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:52:24 * @Desc: 绑定函数上下文 */ bindFn() { this.onDrawClick = this.onDrawClick.bind(this) this.onMousedown = this.onMousedown.bind(this) this.onMousemove = this.onMousemove.bind(this) this.onMouseup = this.onMouseup.bind(this) this.onMousewheel = this.onMousewheel.bind(this) this.onContextmenu = this.onContextmenu.bind(this) } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 14:53:43 * @Desc: 绑定事件 */ bind() { this.mindMap.svg.on('click', this.onDrawClick) this.mindMap.el.addEventListener('mousedown', this.onMousedown) window.addEventListener('mousemove', this.onMousemove) window.addEventListener('mouseup', this.onMouseup) // 兼容火狐浏览器 if(window.navigator.userAgent.toLowerCase().indexOf("firefox") != -1){ this.mindMap.el.addEventListener('DOMMouseScroll', this.onMousewheel) } else { this.mindMap.el.addEventListener('mousewheel', this.onMousewheel) } this.mindMap.svg.on('contextmenu', this.onContextmenu) } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:40:51 * @Desc: 解绑事件 */ unbind() { this.mindMap.svg.off('click', this.onDrawClick) this.mindMap.el.removeEventListener('mousedown', this.onMousedown) window.removeEventListener('mousemove', this.onMousemove) window.removeEventListener('mouseup', this.onMouseup) this.mindMap.el.removeEventListener('mousewheel', this.onMousewheel) this.mindMap.svg.off('contextmenu', this.onContextmenu) } /** * @Author: 王林 * @Date: 2021-04-24 13:19:39 * @Desc: 画布的单击事件 */ onDrawClick(e) { this.emit('draw_click', e) } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:17:35 * @Desc: 鼠标按下事件 */ onMousedown(e) { if (e.which !== this.mindMap.opt.dragButton) { return; } e.preventDefault() this.isMousedown = true this.mousedownPos.x = e.clientX this.mousedownPos.y = e.clientY this.emit('mousedown', e, this) } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:18:32 * @Desc: 鼠标移动事件 */ onMousemove(e) { e.preventDefault() this.mousemovePos.x = e.clientX this.mousemovePos.y = e.clientY this.mousemoveOffset.x = e.clientX - this.mousedownPos.x this.mousemoveOffset.y = e.clientY - this.mousedownPos.y this.emit('mousemove', e, this) if (this.isMousedown) { this.emit('drag', e, this) } } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:18:57 * @Desc: 鼠标松开事件 */ onMouseup(e) { this.isMousedown = false this.emit('mouseup', e, this) } /** * javascript comment * @Author: 王林25 * @Date: 2021-04-07 15:46:27 * @Desc: 鼠标滚动 */ onMousewheel(e) { e.stopPropagation() e.preventDefault() let dir if ((e.wheelDeltaY || e.detail) > 0) { dir = 'up' } else { dir = 'down' } this.emit('mousewheel', e, dir, this) } /** * @Author: 王林 * @Date: 2021-07-10 22:34:13 * @Desc: 鼠标右键菜单事件 */ onContextmenu(e) { e.preventDefault() this.emit('contextmenu', e) } } export default Event