Elgato_dark/idraw
1
0
Fork 0
mirror of https://github.com/idrawjs/idraw synced 2026-05-24 10:08:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add event screenClickELement

Browse source
This commit is contained in:
chenshenhai 2021-08-09 22:41:02 +08:00
parent 24c594bd08
commit ed95dc2f73
4 changed files with 33 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
packages/core/examples/features/lib/main.js
View file

@ -47,6 +47,9 @@ core.on('changeScreen', (data) => {
core.on('screenSelectElement', (data) => {
console.log('screenSelectElement: ', data);
});
core.on('screenClickElement', (data) => {
console.log('screenClickElement: ', data);
})
core.on('mouseOverElement', (data) => {
console.log('mouseOverElement: ', data);
});

29
packages/core/src/index.ts
View file

@ -18,7 +18,7 @@ import { TempData } from './lib/temp';
import {
_board, _data, _opts, _config, _renderer, _element, _helper, _hasInited,
_mode, _tempData, _prevPoint, _draw,
_selectedDotDirection, _coreEvent, _mapper, _initEvent, _handlePoint,
_selectedDotDirection, _coreEvent, _mapper, _initEvent, _handlePoint, _handleClick,
_handleMoveStart, _handleMove, _handleMoveEnd, _handleHover, _dragElements,
_transfromElement, _emitChangeScreen, _emitChangeData, _onlyRender, _cursorStatus,
} from './names';
@ -257,6 +257,8 @@ class Core {
}
this[_board].on('hover', time.throttle(this[_handleHover].bind(this), 32));
this[_board].on('point', time.throttle(this[_handleClick].bind(this), 16));
if (this[_onlyRender] === true) {
return;
}
@ -266,6 +268,17 @@ class Core {
this[_board].on('moveEnd', this[_handleMoveEnd].bind(this));
}
private [_handleClick](point: TypePoint): void {
const [index, uuid] = this[_element].isPointInElement(point, this[_data]);
if (index >= 0 && uuid) {
this[_coreEvent].trigger(
'screenClickElement',
{ index, uuid, element: deepClone(this[_data].elements?.[index])}
);
}
this[_draw]();
}
private [_handlePoint](point: TypePoint): void {
if (!this[_mapper].isEffectivePoint(point)) {
return;
@ -399,8 +412,18 @@ class Core {
const index: number | null = this[_helper].getElementIndexByUUID(elementUUID);
if (index !== null && index >= 0) {
const elem = this[_data].elements[index];
if (this[_tempData].get('hoverUUID') !== elem.uuid) {
const preIndex = this[_helper].getElementIndexByUUID(this[_tempData].get('hoverUUID') || '');
if (preIndex !== null && this[_data].elements[preIndex]) {
this[_coreEvent].trigger('mouseLeaveElement', {
uuid: this[_tempData].get('hoverUUID'),
index: preIndex,
element: this[_data].elements[preIndex]
});
}
}
if (elem) {
this[_coreEvent].trigger('mouseOverElement', { index, uuid: elem.uuid, element: elem, });
this[_coreEvent].trigger('mouseOverElement', { uuid: elem.uuid, index, element: elem, });
this[_tempData].set('hoverUUID', elem.uuid);
isMouseOverElement = true;
}
@ -410,7 +433,7 @@ class Core {
if (isMouseOverElement !== true && this[_tempData].get('hoverUUID') !== null) {
const uuid = this[_tempData].get('hoverUUID');
const index: number | null = this[_helper].getElementIndexByUUID(uuid || '');
this[_coreEvent].trigger('mouseLeaveElement', { uuid, index })
if (index !== null) this[_coreEvent].trigger('mouseLeaveElement', { uuid, index, element: this[_data].elements[index] })
this[_tempData].set('hoverUUID', null);
}
}

3
packages/core/src/lib/core-event.ts
View file

@ -14,7 +14,8 @@ export type TypeCoreEventSelectBaseArg = {
export type TypeCoreEventArgMap = {
'error': any;
'mouseOverElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
'mouseLeaveElement': TypeCoreEventSelectBaseArg;
'mouseLeaveElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
'screenClickElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
'screenSelectElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
'screenMoveElementStart': TypeCoreEventSelectBaseArg & TypePoint,
'screenMoveElementEnd': TypeCoreEventSelectBaseArg & TypePoint,

3
packages/core/src/names.ts
View file

@ -14,6 +14,7 @@ const _selectedDotDirection = Symbol('_selectedDotDirection');
const _coreEvent = Symbol('_coreEvent');
const _mapper = Symbol('_mapper');
const _initEvent = Symbol('_initEvent');
const _handleClick = Symbol('_handleClick');
const _handlePoint = Symbol('_handlePoint');
const _handleMoveStart = Symbol('_handleMoveStart');
const _handleMove = Symbol('_handleMove');
@ -29,7 +30,7 @@ const _cursorStatus = Symbol('_cursorStatus');
export {
_board, _data, _opts, _config, _renderer, _element, _helper, _hasInited,
_mode, _tempData, _prevPoint, _draw,
_selectedDotDirection, _coreEvent, _mapper, _initEvent, _handlePoint,
_selectedDotDirection, _coreEvent, _mapper, _initEvent, _handlePoint, _handleClick,
_handleMoveStart, _handleMove, _handleMoveEnd, _handleHover, _dragElements,
_transfromElement, _emitChangeScreen, _emitChangeData, _onlyRender, _cursorStatus,
};