From 0f13445d5194de7cdb874911f2849d2628d3695b Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Sat, 31 Dec 2022 13:56:07 +0400 Subject: [PATCH] Fix block events inconsistency. Closes #4791 --- src/block_manager/index.ts | 10 ++++--- src/block_manager/view/BlockView.ts | 3 ++- src/block_manager/view/BlocksView.ts | 40 ++++++++++------------------ src/editor/model/Editor.ts | 5 ++++ 4 files changed, 28 insertions(+), 30 deletions(-) diff --git a/src/block_manager/index.ts b/src/block_manager/index.ts index b8864c543..6a5ffa08d 100644 --- a/src/block_manager/index.ts +++ b/src/block_manager/index.ts @@ -53,6 +53,7 @@ import Categories from './model/Categories'; import BlocksView from './view/BlocksView'; import { ItemManagerModule } from '../abstract/Module'; import EditorModel from '../editor/model/Editor'; +import Component from '../dom_components/model/Component'; export const evAll = 'block'; export const evPfx = `${evAll}:`; @@ -141,10 +142,10 @@ export default class BlockManager extends ItemManagerModule i.trigger(events.drag, block, ev)); } - __endDrag() { + __endDrag(opts: { component?: Component } = {}) { const { em, events, blocks } = this; const block = this._dragBlock; - const cmp = em.get('dragResult'); + const cmp = opts.component || em.get('dragResult'); delete this._dragBlock; if (cmp && block) { @@ -169,7 +170,10 @@ export default class BlockManager extends ItemManagerModule i.trigger(events.dragEnd, cmp, block)); + + if (block) { + [em, blocks].map(i => i.trigger(events.dragEnd, cmp, block)); + } } __getFrameViews() { diff --git a/src/block_manager/view/BlockView.ts b/src/block_manager/view/BlockView.ts index 26e85eea9..d76edf4de 100644 --- a/src/block_manager/view/BlockView.ts +++ b/src/block_manager/view/BlockView.ts @@ -39,7 +39,7 @@ export default class BlockView extends View { } __getModule() { - return this.em.get('BlockManager'); + return this.em.Blocks; } handleClick(ev: Event) { @@ -98,6 +98,7 @@ export default class BlockView extends View { if (e.button !== 0 || !config.getSorter || this.el.draggable || disable) return; em.refreshCanvas(); const sorter = config.getSorter(); + sorter.__currentBlock = model; sorter.setDragHelper(this.el, e); sorter.setDropContent(this.model.get('content')); sorter.startSort(this.el); diff --git a/src/block_manager/view/BlocksView.ts b/src/block_manager/view/BlocksView.ts index 4f1e9eac0..38b86f7ba 100644 --- a/src/block_manager/view/BlocksView.ts +++ b/src/block_manager/view/BlocksView.ts @@ -1,5 +1,6 @@ import { isString, isObject, bindAll } from 'underscore'; import { View } from '../../common'; +import Component from '../../dom_components/model/Component'; import EditorModel from '../../editor/model/Editor'; import Block from '../model/Block'; import Categories from '../model/Categories'; @@ -48,6 +49,10 @@ export default class BlocksView extends View { } } + __getModule() { + return this.em.Blocks; + } + updateConfig(opts = {}) { this.config = { ...this.config, @@ -88,37 +93,20 @@ export default class BlocksView extends View { return this.sorter; } - /** - * Callback when block is on drag - * @private - */ - onDrag(e: Event) { + onDrag(ev: Event) { this.em.stopDefault(); - this.em.trigger('block:drag:start', e); + this.__getModule().__startDrag(this.sorter.__currentBlock, ev); } - onMove(e: Event) { - this.em.trigger('block:drag:move', e); + onMove(ev: Event) { + this.__getModule().__drag(ev); + this.em.trigger('block:drag:move', ev); // old event } - /** - * Callback when block is dropped - * @private - */ - onDrop(model: Block) { - const { em } = this; - em.runDefault(); - - if (model && model.get) { - const oldActive = 'activeOnRender'; - - if (model.get(oldActive)) { - model.trigger('active'); - model.unset(oldActive); - } - - em.trigger('block:drag:stop', model); - } + onDrop(component?: Component) { + this.em.runDefault(); + this.__getModule().__endDrag({ component }); + delete this.sorter.__currentBlock; } /** diff --git a/src/editor/model/Editor.ts b/src/editor/model/Editor.ts index 8437c06f6..777a13c75 100644 --- a/src/editor/model/Editor.ts +++ b/src/editor/model/Editor.ts @@ -14,6 +14,7 @@ import ComponentManager from '../../dom_components'; import CssComposer from '../../css_composer'; import { EditorConfig, EditorConfigKeys } from '../config/config'; import Component from '../../dom_components/model/Component'; +import BlockManager from '../../block_manager'; //@ts-ignore Backbone.$ = $; @@ -121,6 +122,10 @@ export default class EditorModel extends Model { return this.get('CssComposer'); } + get Blocks(): BlockManager { + return this.get('BlockManager'); + } + constructor(conf: EditorConfig = {}) { super(); this._config = conf;