wisemapping-frontend/packages/mindplot/lib/components/ControlPoint.js

212 lines
7.8 KiB
JavaScript
Raw Normal View History

2021-07-16 16:41:58 +02:00
/*
* Copyright [2015] [wisemapping]
*
* 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.
*/
const Core = require('@wismapping/core-js')
const core = Core();
const web2D = require('@wismapping/web2d')
const web2d = web2D();
const Shape = require('./util/Shape').default
const ActionDispatcher = require('./ActionDispatcher').default;
const ControlPoint = new Class({
initialize: function () {
var control1 = new web2d.Elipse({
width: 6,
height: 6,
stroke: '1 solid #6589de',
fillColor: 'gray',
visibility: false
});
control1.setCursor('pointer');
var control2 = new web2d.Elipse({
width: 6,
height: 6,
stroke: '1 solid #6589de',
fillColor: 'gray',
visibility: false
});
control2.setCursor('pointer');
this._controlPointsController = [control1, control2];
this._controlLines = [new web2d.Line({strokeColor: "#6589de", strokeWidth: 1, opacity: 0.3}),
new web2d.Line({strokeColor: "#6589de", strokeWidth: 1, opacity: 0.3})];
this._isBinded = false;
var me = this;
this._controlPointsController[0].addEvent('mousedown', function (event) {
(me._mouseDown)(event, ControlPoint.FROM, me);
});
this._controlPointsController[0].addEvent('click', function (event) {
(me._mouseClick)(event);
});
this._controlPointsController[0].addEvent('dblclick', function (event) {
(me._mouseClick)(event);
});
this._controlPointsController[1].addEvent('mousedown', function (event) {
(me._mouseDown)(event, ControlPoint.TO, me);
});
this._controlPointsController[1].addEvent('click', function (event) {
(me._mouseClick)(event);
});
this._controlPointsController[1].addEvent('dblclick', function (event) {
(me._mouseClick)(event);
});
},
setLine: function (line) {
if ($defined(this._line)) {
this._removeLine();
}
this._line = line;
this._createControlPoint();
this._endPoint = [];
this._orignalCtrlPoint = [];
this._orignalCtrlPoint[0] = this._controls[0].clone();
this._orignalCtrlPoint[1] = this._controls[1].clone();
this._endPoint[0] = this._line.getLine().getFrom().clone();
this._endPoint[1] = this._line.getLine().getTo().clone();
},
redraw: function () {
if ($defined(this._line))
this._createControlPoint();
},
_createControlPoint: function () {
this._controls = this._line.getLine().getControlPoints();
var pos = this._line.getLine().getFrom();
this._controlPointsController[0].setPosition(this._controls[ControlPoint.FROM].x + pos.x, this._controls[ControlPoint.FROM].y + pos.y - 3);
this._controlLines[0].setFrom(pos.x, pos.y);
this._controlLines[0].setTo(this._controls[ControlPoint.FROM].x + pos.x + 3, this._controls[ControlPoint.FROM].y + pos.y);
pos = this._line.getLine().getTo();
this._controlLines[1].setFrom(pos.x, pos.y);
this._controlLines[1].setTo(this._controls[ControlPoint.TO].x + pos.x + 3, this._controls[ControlPoint.TO].y + pos.y);
this._controlPointsController[1].setPosition(this._controls[ControlPoint.TO].x + pos.x, this._controls[ControlPoint.TO].y + pos.y - 3);
},
_removeLine: function () {
},
_mouseDown: function (event, point, me) {
if (!this._isBinded) {
this._isBinded = true;
this._mouseMoveFunction = function (event) {
(me._mouseMoveEvent)(event, point, me);
};
this._workspace.getScreenManager().addEvent('mousemove', this._mouseMoveFunction);
this._mouseUpFunction = function (event) {
(me._mouseUp)(event, point, me);
};
this._workspace.getScreenManager().addEvent('mouseup', this._mouseUpFunction);
}
event.preventDefault();
event.stopPropagation();
return false;
},
_mouseMoveEvent: function (event, point) {
var screen = this._workspace.getScreenManager();
var pos = screen.getWorkspaceMousePosition(event);
var cords;
if (point == 0) {
cords = Shape.calculateRelationShipPointCoordinates(this._line.getSourceTopic(), pos);
this._line.setFrom(cords.x, cords.y);
this._line.setSrcControlPoint(new core.Point(pos.x - cords.x, pos.y - cords.y));
} else {
cords = Shape.calculateRelationShipPointCoordinates(this._line.getTargetTopic(), pos);
this._line.setTo(cords.x, cords.y);
this._line.setDestControlPoint(new core.Point(pos.x - cords.x, pos.y - cords.y));
}
this._controls[point].x = (pos.x - cords.x);
this._controls[point].y = (pos.y - cords.y);
this._controlPointsController[point].setPosition(pos.x - 5, pos.y - 3);
this._controlLines[point].setFrom(cords.x, cords.y);
this._controlLines[point].setTo(pos.x - 2, pos.y);
this._line.getLine().updateLine(point);
},
_mouseUp: function (event, point) {
this._workspace.getScreenManager().removeEvent('mousemove', this._mouseMoveFunction);
this._workspace.getScreenManager().removeEvent('mouseup', this._mouseUpFunction);
var actionDispatcher = ActionDispatcher.getInstance();
actionDispatcher.moveControlPoint(this, point);
this._isBinded = false;
},
_mouseClick: function (event) {
event.preventDefault();
event.stopPropagation();
return false;
},
setVisibility: function (visible) {
if (visible) {
this._controlLines[0].moveToFront();
this._controlLines[1].moveToFront();
this._controlPointsController[0].moveToFront();
this._controlPointsController[1].moveToFront();
}
this._controlPointsController[0].setVisibility(visible);
this._controlPointsController[1].setVisibility(visible);
this._controlLines[0].setVisibility(visible);
this._controlLines[1].setVisibility(visible);
},
addToWorkspace: function (workspace) {
this._workspace = workspace;
workspace.append(this._controlPointsController[0]);
workspace.append(this._controlPointsController[1]);
workspace.append(this._controlLines[0]);
workspace.append(this._controlLines[1]);
},
removeFromWorkspace: function (workspace) {
this._workspace = null;
workspace.removeChild(this._controlPointsController[0]);
workspace.removeChild(this._controlPointsController[1]);
workspace.removeChild(this._controlLines[0]);
workspace.removeChild(this._controlLines[1]);
},
getControlPoint: function (index) {
return this._controls[index];
},
getOriginalEndPoint: function (index) {
return this._endPoint[index];
},
getOriginalCtrlPoint: function (index) {
return this._orignalCtrlPoint[index];
}
});
ControlPoint.FROM = 0;
ControlPoint.TO = 1;
export default ControlPoint;