2021-07-16 16:41:58 +02:00
|
|
|
/*
|
2021-12-25 23:39:34 +01:00
|
|
|
* Copyright [2021] [wisemapping]
|
2021-07-16 16:41:58 +02:00
|
|
|
*
|
|
|
|
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
|
|
|
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
|
|
|
* "powered by wisemapping" text requirement on every single page;
|
|
|
|
* you may not use this file except in compliance with the License.
|
|
|
|
* You may obtain a copy of the license at
|
|
|
|
*
|
|
|
|
* http://www.wisemapping.org/license
|
|
|
|
*
|
|
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
* See the License for the specific language governing permissions and
|
|
|
|
* limitations under the License.
|
|
|
|
*/
|
2022-03-01 01:12:45 +01:00
|
|
|
import { $assert } from '@wisemapping/core-js';
|
2022-02-24 02:37:56 +01:00
|
|
|
import { Point, ElementClass } from '@wisemapping/web2d';
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2021-12-02 01:41:56 +01:00
|
|
|
import ActionDispatcher from './ActionDispatcher';
|
|
|
|
import DragPivot from './DragPivot';
|
2022-02-24 02:37:56 +01:00
|
|
|
import LayoutManager from './layout/LayoutManager';
|
|
|
|
import NodeGraph from './NodeGraph';
|
|
|
|
import Topic from './Topic';
|
|
|
|
import Workspace from './Workspace';
|
2021-07-16 16:41:58 +02:00
|
|
|
|
2021-12-05 00:39:20 +01:00
|
|
|
class DragTopic {
|
2022-02-24 02:37:56 +01:00
|
|
|
private _elem2d: ElementClass;
|
2022-03-01 01:12:45 +01:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
private _order: number | null;
|
2022-03-01 01:12:45 +01:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
private _draggedNode: NodeGraph;
|
2022-03-01 01:12:45 +01:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
private _layoutManager: LayoutManager;
|
2022-03-01 01:12:45 +01:00
|
|
|
|
|
|
|
private _position: Point;
|
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
private _isInWorkspace: boolean;
|
2022-03-01 01:12:45 +01:00
|
|
|
|
|
|
|
static _dragPivot: DragPivot = new DragPivot();
|
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
constructor(dragShape: ElementClass, draggedNode: NodeGraph, layoutManger: LayoutManager) {
|
2021-10-05 02:05:34 +02:00
|
|
|
$assert(dragShape, 'Rect can not be null.');
|
|
|
|
$assert(draggedNode, 'draggedNode can not be null.');
|
|
|
|
$assert(layoutManger, 'layoutManger can not be null.');
|
|
|
|
|
|
|
|
this._elem2d = dragShape;
|
|
|
|
this._order = null;
|
|
|
|
this._draggedNode = draggedNode;
|
|
|
|
this._layoutManager = layoutManger;
|
2021-12-19 17:31:29 +01:00
|
|
|
this._position = new Point();
|
2021-10-05 02:05:34 +02:00
|
|
|
this._isInWorkspace = false;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-03-01 01:12:45 +01:00
|
|
|
setOrder(order: number): void {
|
2021-10-05 02:05:34 +02:00
|
|
|
this._order = order;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-03-01 01:12:45 +01:00
|
|
|
setPosition(x: number, y: number): void {
|
2021-10-05 02:05:34 +02:00
|
|
|
// Update drag shadow position ....
|
2022-03-01 01:12:45 +01:00
|
|
|
const position = { x, y };
|
2021-10-05 02:05:34 +02:00
|
|
|
this._position.setValue(position.x, position.y);
|
|
|
|
|
|
|
|
// Elements are positioned in the center.
|
|
|
|
// All topic element must be positioned based on the innerShape.
|
|
|
|
const draggedNode = this._draggedNode;
|
|
|
|
const size = draggedNode.getSize();
|
|
|
|
const cx = position.x - (position.x > 0 ? 0 : size.width);
|
2021-12-02 01:41:56 +01:00
|
|
|
const cy = Math.ceil(position.y - size.height / 2);
|
2021-10-05 02:05:34 +02:00
|
|
|
this._elem2d.setPosition(cx, cy);
|
|
|
|
|
|
|
|
// In case is not free, pivot must be draw ...
|
|
|
|
if (this.isConnected() && !this.isFreeLayoutOn()) {
|
|
|
|
const parent = this.getConnectedToTopic();
|
2021-12-02 01:41:56 +01:00
|
|
|
const predict = this._layoutManager.predict(
|
|
|
|
parent.getId(),
|
|
|
|
this._draggedNode.getId(),
|
|
|
|
this.getPosition(),
|
|
|
|
);
|
2021-12-20 21:54:31 +01:00
|
|
|
if (this._order !== predict.order) {
|
2021-10-05 02:05:34 +02:00
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
const pivotPosition = predict.position;
|
|
|
|
dragPivot.connectTo(parent, pivotPosition);
|
2021-07-16 16:41:58 +02:00
|
|
|
this.setOrder(predict.order);
|
2021-10-05 02:05:34 +02:00
|
|
|
}
|
|
|
|
}
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
setVisibility(value: boolean) {
|
2021-10-05 02:05:34 +02:00
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
dragPivot.setVisibility(value);
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
isVisible(): boolean {
|
2021-10-05 02:05:34 +02:00
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
return dragPivot.isVisible();
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
getInnerShape(): ElementClass {
|
2021-10-05 02:05:34 +02:00
|
|
|
return this._elem2d;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
disconnect(workspace: Workspace) {
|
2021-10-05 02:05:34 +02:00
|
|
|
// Clear connection line ...
|
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
dragPivot.disconnect(workspace);
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
connectTo(parent: Topic) {
|
2021-10-05 02:05:34 +02:00
|
|
|
$assert(parent, 'Parent connection node can not be null.');
|
|
|
|
|
|
|
|
// Where it should be connected ?
|
2022-03-01 01:12:45 +01:00
|
|
|
const predict = this._layoutManager.predict(
|
2021-12-02 01:41:56 +01:00
|
|
|
parent.getId(),
|
|
|
|
this._draggedNode.getId(),
|
|
|
|
this.getPosition(),
|
|
|
|
);
|
2021-10-05 02:05:34 +02:00
|
|
|
|
|
|
|
// Connect pivot ...
|
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
const { position } = predict;
|
|
|
|
dragPivot.connectTo(parent, position);
|
|
|
|
dragPivot.setVisibility(true);
|
|
|
|
|
|
|
|
this.setOrder(predict.order);
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
getDraggedTopic(): Topic {
|
|
|
|
return this._draggedNode as Topic;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
removeFromWorkspace(workspace: Workspace) {
|
2021-10-05 02:05:34 +02:00
|
|
|
if (this._isInWorkspace) {
|
|
|
|
// Remove drag shadow.
|
|
|
|
workspace.removeChild(this._elem2d);
|
|
|
|
|
2021-12-20 21:54:31 +01:00
|
|
|
// Remove pivot shape. To improve performance it will not be removed.
|
|
|
|
// Only the visibility will be changed.
|
2021-10-05 02:05:34 +02:00
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
dragPivot.setVisibility(false);
|
|
|
|
|
|
|
|
this._isInWorkspace = false;
|
|
|
|
}
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
isInWorkspace(): boolean {
|
2021-10-05 02:05:34 +02:00
|
|
|
return this._isInWorkspace;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
addToWorkspace(workspace: Workspace) {
|
2021-10-05 02:05:34 +02:00
|
|
|
if (!this._isInWorkspace) {
|
|
|
|
workspace.append(this._elem2d);
|
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
dragPivot.addToWorkspace(workspace);
|
|
|
|
this._isInWorkspace = true;
|
2021-07-16 16:41:58 +02:00
|
|
|
}
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-03-01 01:12:45 +01:00
|
|
|
private _getDragPivot(): DragPivot {
|
|
|
|
return DragTopic._dragPivot;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
getPosition(): Point {
|
2021-10-05 02:05:34 +02:00
|
|
|
return this._position;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
isDragTopic(): boolean {
|
2021-10-05 02:05:34 +02:00
|
|
|
return true;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
applyChanges(workspace: Workspace) {
|
2021-10-05 02:05:34 +02:00
|
|
|
$assert(workspace, 'workspace can not be null');
|
|
|
|
|
|
|
|
const actionDispatcher = ActionDispatcher.getInstance();
|
|
|
|
const draggedTopic = this.getDraggedTopic();
|
|
|
|
const topicId = draggedTopic.getId();
|
|
|
|
const position = this.getPosition();
|
|
|
|
|
|
|
|
if (!this.isFreeLayoutOn()) {
|
|
|
|
let order = null;
|
|
|
|
let parent = null;
|
|
|
|
const isDragConnected = this.isConnected();
|
|
|
|
if (isDragConnected) {
|
|
|
|
const targetTopic = this.getConnectedToTopic();
|
|
|
|
order = this._order;
|
|
|
|
parent = targetTopic;
|
|
|
|
}
|
|
|
|
|
|
|
|
// If the node is not connected, position based on the original drag topic position.
|
|
|
|
actionDispatcher.dragTopic(topicId, position, order, parent);
|
|
|
|
} else {
|
|
|
|
actionDispatcher.moveTopic(topicId, position);
|
|
|
|
}
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
getConnectedToTopic(): Topic {
|
2021-10-05 02:05:34 +02:00
|
|
|
const dragPivot = this._getDragPivot();
|
|
|
|
return dragPivot.getTargetTopic();
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
isConnected(): boolean {
|
2021-10-05 02:05:34 +02:00
|
|
|
return this.getConnectedToTopic() != null;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-10-05 02:05:34 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
isFreeLayoutOn(): false {
|
2021-10-05 02:05:34 +02:00
|
|
|
return false;
|
2021-12-05 00:39:20 +01:00
|
|
|
}
|
2021-07-16 16:41:58 +02:00
|
|
|
|
2022-02-24 02:37:56 +01:00
|
|
|
static init(workspace: Workspace) {
|
|
|
|
$assert(workspace, 'workspace can not be null');
|
2022-03-01 01:12:45 +01:00
|
|
|
const pivot = DragTopic._dragPivot;
|
2022-02-24 02:37:56 +01:00
|
|
|
workspace.append(pivot);
|
2022-03-01 01:12:45 +01:00
|
|
|
}
|
2022-02-24 02:37:56 +01:00
|
|
|
}
|
2021-07-16 16:41:58 +02:00
|
|
|
|
|
|
|
export default DragTopic;
|