zcy
/
maxGraph
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

conversions to typescript and type fixes

development
mcyph 2021-06-13 16:13:43 +10:00
parent 29fff201da
commit 960813ca1b
57 changed files with 1070 additions and 1195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.prettierrc
View File

@ -1,5 +1,6 @@
{ {
"tabWidth": 2, "tabWidth": 2,
"trailingComma": "es5", "trailingComma": "es5",
"singleQuote": true "singleQuote": true,
"printWidth": 90
} }

2
docs/stashed/Schema.js
View File

@ -69,7 +69,7 @@ export default MYNAMEHERE;
// Defines an icon for creating new connections in the connection handler. // Defines an icon for creating new connections in the connection handler.
// This will automatically disable the highlighting of the source vertex. // This will automatically disable the highlighting of the source vertex.
mxConnectionHandler.prototype.connectImage = new Image('images/connector.gif', 16, 16); ConnectionHandler.prototype.connectImage = new Image('images/connector.gif', 16, 16);
// Prefetches all images that appear in colums // Prefetches all images that appear in colums
// to avoid problems with the auto-layout // to avoid problems with the auto-layout

12
docs/stashed/Scrollbars.js
View File

@ -96,7 +96,7 @@ export default Scrollbars;
// not a problem here since the preview moves away from the mouse as soon as it connects // not a problem here since the preview moves away from the mouse as soon as it connects
// to any given table row. This is because the edge connects to the outside of the row and // to any given table row. This is because the edge connects to the outside of the row and
// is aligned to the grid during the preview. // is aligned to the grid during the preview.
mxConnectionHandler.prototype.movePreviewAway = false; ConnectionHandler.prototype.movePreviewAway = false;
// Disables foreignObjects // Disables foreignObjects
mxClient.NO_FO = true; mxClient.NO_FO = true;
@ -105,17 +105,17 @@ export default Scrollbars;
GraphHandler.prototype.htmlPreview = true; GraphHandler.prototype.htmlPreview = true;
// Enables connect icons to appear on top of HTML // Enables connect icons to appear on top of HTML
mxConnectionHandler.prototype.moveIconFront = true; ConnectionHandler.prototype.moveIconFront = true;
// Defines an icon for creating new connections in the connection handler. // Defines an icon for creating new connections in the connection handler.
// This will automatically disable the highlighting of the source vertex. // This will automatically disable the highlighting of the source vertex.
mxConnectionHandler.prototype.connectImage = new Image('images/connector.gif', 16, 16); ConnectionHandler.prototype.connectImage = new Image('images/connector.gif', 16, 16);
// Disables the context menu // Disables the context menu
mxEvent.disableContextMenu(container); mxEvent.disableContextMenu(container);
// Overrides target perimeter point for connection previews // Overrides target perimeter point for connection previews
mxConnectionHandler.prototype.getTargetPerimeterPoint = function(state, me) ConnectionHandler.prototype.getTargetPerimeterPoint = function(state, me)
{ {
// Determines the y-coordinate of the target perimeter point // Determines the y-coordinate of the target perimeter point
// by using the currentRowNode assigned in updateRow // by using the currentRowNode assigned in updateRow
@ -138,7 +138,7 @@ export default Scrollbars;
}; };
// Overrides source perimeter point for connection previews // Overrides source perimeter point for connection previews
mxConnectionHandler.prototype.getSourcePerimeterPoint = function(state, next, me) ConnectionHandler.prototype.getSourcePerimeterPoint = function(state, next, me)
{ {
let y = me.getY(); let y = me.getY();
@ -159,7 +159,7 @@ export default Scrollbars;
}; };
// Disables connections to invalid rows // Disables connections to invalid rows
mxConnectionHandler.prototype.isValidTarget = function(cell) ConnectionHandler.prototype.isValidTarget = function(cell)
{ {
return this.currentRowNode != null; return this.currentRowNode != null;
}; };

34
docs/stashed/Touch.js
View File

@ -265,13 +265,13 @@ export default Touch;
(function() (function()
{ {
// Enables rotation handle // Enables rotation handle
mxVertexHandler.prototype.rotationEnabled = true; VertexHandler.prototype.rotationEnabled = true;
// Enables managing of sizers // Enables managing of sizers
mxVertexHandler.prototype.manageSizers = true; VertexHandler.prototype.manageSizers = true;
// Enables live preview // Enables live preview
mxVertexHandler.prototype.livePreview = true; VertexHandler.prototype.livePreview = true;
// Sets constants for touch style // Sets constants for touch style
mxConstants.HANDLE_SIZE = 16; mxConstants.HANDLE_SIZE = 16;
@ -281,7 +281,7 @@ export default Touch;
if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0)
{ {
Shape.prototype.svgStrokeTolerance = 18; Shape.prototype.svgStrokeTolerance = 18;
mxVertexHandler.prototype.tolerance = 12; VertexHandler.prototype.tolerance = 12;
mxEdgeHandler.prototype.tolerance = 12; mxEdgeHandler.prototype.tolerance = 12;
mxGraph.prototype.tolerance = 12; mxGraph.prototype.tolerance = 12;
} }
@ -309,7 +309,7 @@ export default Touch;
}; };
// On connect the target is selected and we clone the cell of the preview edge for insert // On connect the target is selected and we clone the cell of the preview edge for insert
mxConnectionHandler.prototype.selectCells = function(edge, target) ConnectionHandler.prototype.selectCells = function(edge, target)
{ {
if (target != null) if (target != null)
{ {
@ -337,7 +337,7 @@ export default Touch;
// Rounded edge and vertex handles // Rounded edge and vertex handles
let touchHandle = new Image('images/handle-main.png', 17, 17); let touchHandle = new Image('images/handle-main.png', 17, 17);
mxVertexHandler.prototype.handleImage = touchHandle; VertexHandler.prototype.handleImage = touchHandle;
mxEdgeHandler.prototype.handleImage = touchHandle; mxEdgeHandler.prototype.handleImage = touchHandle;
Outline.prototype.sizerImage = touchHandle; Outline.prototype.sizerImage = touchHandle;
@ -347,8 +347,8 @@ export default Touch;
// Adds connect icon to selected vertex // Adds connect icon to selected vertex
let connectorSrc = 'images/handle-connect.png'; let connectorSrc = 'images/handle-connect.png';
let vertexHandlerInit = mxVertexHandler.prototype.init; let vertexHandlerInit = VertexHandler.prototype.init;
mxVertexHandler.prototype.init = function() VertexHandler.prototype.init = function()
{ {
// TODO: Use 4 sizers, move outside of shape // TODO: Use 4 sizers, move outside of shape
//this.singleSizer = this.state.width < 30 && this.state.height < 30; //this.singleSizer = this.state.width < 30 && this.state.height < 30;
@ -393,8 +393,8 @@ export default Touch;
this.redrawHandles(); this.redrawHandles();
}; };
let vertexHandlerHideSizers = mxVertexHandler.prototype.hideSizers; let vertexHandlerHideSizers = VertexHandler.prototype.hideSizers;
mxVertexHandler.prototype.hideSizers = function() VertexHandler.prototype.hideSizers = function()
{ {
vertexHandlerHideSizers.apply(this, arguments); vertexHandlerHideSizers.apply(this, arguments);
@ -404,8 +404,8 @@ export default Touch;
} }
}; };
let vertexHandlerReset = mxVertexHandler.prototype.reset; let vertexHandlerReset = VertexHandler.prototype.reset;
mxVertexHandler.prototype.reset = function() VertexHandler.prototype.reset = function()
{ {
vertexHandlerReset.apply(this, arguments); vertexHandlerReset.apply(this, arguments);
@ -415,8 +415,8 @@ export default Touch;
} }
}; };
let vertexHandlerRedrawHandles = mxVertexHandler.prototype.redrawHandles; let vertexHandlerRedrawHandles = VertexHandler.prototype.redrawHandles;
mxVertexHandler.prototype.redrawHandles = function() VertexHandler.prototype.redrawHandles = function()
{ {
vertexHandlerRedrawHandles.apply(this); vertexHandlerRedrawHandles.apply(this);
@ -426,7 +426,7 @@ export default Touch;
let s = this.state; let s = this.state;
// Top right for single-sizer // Top right for single-sizer
if (mxVertexHandler.prototype.singleSizer) if (VertexHandler.prototype.singleSizer)
{ {
pt.x = s.x + s.width - this.connectorImg.offsetWidth / 2; pt.x = s.x + s.width - this.connectorImg.offsetWidth / 2;
pt.y = s.y - this.connectorImg.offsetHeight / 2; pt.y = s.y - this.connectorImg.offsetHeight / 2;
@ -453,8 +453,8 @@ export default Touch;
} }
}; };
let vertexHandlerDestroy = mxVertexHandler.prototype.destroy; let vertexHandlerDestroy = VertexHandler.prototype.destroy;
mxVertexHandler.prototype.destroy = function(sender, me) VertexHandler.prototype.destroy = function(sender, me)
{ {
vertexHandlerDestroy.apply(this, arguments); vertexHandlerDestroy.apply(this, arguments);

4
docs/stashed/grapheditor/www/js/Editor.js
View File

@ -2591,8 +2591,8 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
}; };
// Overrides to ignore hotspot only for target terminal // Overrides to ignore hotspot only for target terminal
let mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker; let mxConnectionHandlerCreateMarker = ConnectionHandler.prototype.createMarker;
mxConnectionHandler.prototype.createMarker = function() ConnectionHandler.prototype.createMarker = function()
{ {
let marker = mxConnectionHandlerCreateMarker.apply(this, arguments); let marker = mxConnectionHandlerCreateMarker.apply(this, arguments);

6
docs/stashed/grapheditor/www/js/EditorUi.js
View File

@ -34,9 +34,9 @@ EditorUi = function(editor, container, lightbox)
} }
// Pre-fetches connect image // Pre-fetches connect image
if (!mxClient.IS_SVG && mxConnectionHandler.prototype.connectImage != null) if (!mxClient.IS_SVG && ConnectionHandler.prototype.connectImage != null)
{ {
new Image().src = mxConnectionHandler.prototype.connectImage.src; new Image().src = ConnectionHandler.prototype.connectImage.src;
} }
// Disables graph and forced panning in chromeless mode // Disables graph and forced panning in chromeless mode
@ -4100,7 +4100,7 @@ EditorUi.prototype.ctrlEnter = function()
try try
{ {
let cells = graph.getSelectionCells(); let cells = graph.getSelectionCells();
let lookup = new mxDictionary(); let lookup = new Dictionary();
let newCells = []; let newCells = [];
for (let i = 0; i < cells.length; i++) for (let i = 0; i < cells.length; i++)

182
docs/stashed/grapheditor/www/js/Graph.js
View File

@ -639,7 +639,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
}; };
// All code below not available and not needed in embed mode // All code below not available and not needed in embed mode
if (typeof mxVertexHandler !== 'undefined') if (typeof VertexHandler !== 'undefined')
{ {
this.setConnectable(true); this.setConnectable(true);
this.setDropEnabled(true); this.setDropEnabled(true);
@ -738,7 +738,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
this.graphHandler.getCells = function(initialCell) this.graphHandler.getCells = function(initialCell)
{ {
let cells = graphHandlerGetCells.apply(this, arguments); let cells = graphHandlerGetCells.apply(this, arguments);
let lookup = new mxDictionary(); let lookup = new Dictionary();
let newCells = []; let newCells = [];
for (let i = 0; i < cells.length; i++) for (let i = 0; i < cells.length; i++)
@ -796,10 +796,10 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
{ {
source = this.graph.getCompositeParent(source); source = this.graph.getCompositeParent(source);
return mxConnectionHandler.prototype.createTargetVertex.apply(this, arguments); return ConnectionHandler.prototype.createTargetVertex.apply(this, arguments);
}; };
let rubberband = new mxRubberband(this); let rubberband = new RubberBand(this);
this.getRubberband = function() this.getRubberband = function()
{ {
@ -6113,7 +6113,7 @@ StencilRegistry.parseStencilSet = function(root, postStencilLoad, install)
/** /**
* These overrides are only added if mxVertexHandler is defined (ie. not in embedded graph) * These overrides are only added if mxVertexHandler is defined (ie. not in embedded graph)
*/ */
if (typeof mxVertexHandler != 'undefined') if (typeof VertexHandler != 'undefined')
{ {
(function() (function()
{ {
@ -6142,7 +6142,7 @@ if (typeof mxVertexHandler != 'undefined')
GraphHandler.prototype.removeEmptyParents = true; GraphHandler.prototype.removeEmptyParents = true;
// Enables fading of rubberband // Enables fading of rubberband
mxRubberband.prototype.fadeOut = true; RubberBand.prototype.fadeOut = true;
// Alt-move disables guides // Alt-move disables guides
mxGuide.prototype.isEnabledForEvent = function(evt) mxGuide.prototype.isEnabledForEvent = function(evt)
@ -6160,14 +6160,14 @@ if (typeof mxVertexHandler != 'undefined')
// Extends connection handler to enable ctrl+drag for cloning source cell // Extends connection handler to enable ctrl+drag for cloning source cell
// since copyOnConnect is now disabled by default // since copyOnConnect is now disabled by default
let mxConnectionHandlerCreateTarget = mxConnectionHandler.prototype.isCreateTarget; let mxConnectionHandlerCreateTarget = ConnectionHandler.prototype.isCreateTarget;
mxConnectionHandler.prototype.isCreateTarget = function(evt) ConnectionHandler.prototype.isCreateTarget = function(evt)
{ {
return this.graph.isCloneEvent(evt) || mxConnectionHandlerCreateTarget.apply(this, arguments); return this.graph.isCloneEvent(evt) || mxConnectionHandlerCreateTarget.apply(this, arguments);
}; };
// Overrides highlight shape for connection points // Overrides highlight shape for connection points
mxConstraintHandler.prototype.createHighlightShape = function() ConstraintHandler.prototype.createHighlightShape = function()
{ {
let hl = new Ellipse(null, this.highlightColor, this.highlightColor, 0); let hl = new Ellipse(null, this.highlightColor, this.highlightColor, 0);
hl.opacity = mxConstants.HIGHLIGHT_OPACITY; hl.opacity = mxConstants.HIGHLIGHT_OPACITY;
@ -6176,11 +6176,11 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Overrides edge preview to use current edge shape and default style // Overrides edge preview to use current edge shape and default style
mxConnectionHandler.prototype.livePreview = true; ConnectionHandler.prototype.livePreview = true;
mxConnectionHandler.prototype.cursor = 'crosshair'; ConnectionHandler.prototype.cursor = 'crosshair';
// Uses current edge style for connect preview // Uses current edge style for connect preview
mxConnectionHandler.prototype.createEdgeState = function(me) ConnectionHandler.prototype.createEdgeState = function(me)
{ {
let style = this.graph.createCurrentEdgeStyle(); let style = this.graph.createCurrentEdgeStyle();
let edge = this.graph.createEdge(null, null, null, null, null, style); let edge = this.graph.createEdge(null, null, null, null, null, style);
@ -6195,8 +6195,8 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Overrides dashed state with current edge style // Overrides dashed state with current edge style
let connectionHandlerCreateShape = mxConnectionHandler.prototype.createShape; let connectionHandlerCreateShape = ConnectionHandler.prototype.createShape;
mxConnectionHandler.prototype.createShape = function() ConnectionHandler.prototype.createShape = function()
{ {
let shape = connectionHandlerCreateShape.apply(this, arguments); let shape = connectionHandlerCreateShape.apply(this, arguments);
@ -6206,14 +6206,14 @@ if (typeof mxVertexHandler != 'undefined')
} }
// Overrides live preview to keep current style // Overrides live preview to keep current style
mxConnectionHandler.prototype.updatePreview = function(valid) ConnectionHandler.prototype.updatePreview = function(valid)
{ {
// do not change color of preview // do not change color of preview
}; };
// Overrides connection handler to ignore edges instead of not allowing connections // Overrides connection handler to ignore edges instead of not allowing connections
let mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker; let mxConnectionHandlerCreateMarker = ConnectionHandler.prototype.createMarker;
mxConnectionHandler.prototype.createMarker = function() ConnectionHandler.prototype.createMarker = function()
{ {
let marker = mxConnectionHandlerCreateMarker.apply(this, arguments); let marker = mxConnectionHandlerCreateMarker.apply(this, arguments);
@ -6500,7 +6500,7 @@ if (typeof mxVertexHandler != 'undefined')
let clones = this.cloneCells(cells, null, cloneMap); let clones = this.cloneCells(cells, null, cloneMap);
// Creates a dictionary for fast lookups // Creates a dictionary for fast lookups
let dict = new mxDictionary(); let dict = new Dictionary();
for (let i = 0; i < cells.length; i++) for (let i = 0; i < cells.length; i++)
{ {
@ -6931,7 +6931,7 @@ if (typeof mxVertexHandler != 'undefined')
for (let i = 0; i < c.length; i++) for (let i = 0; i < c.length; i++)
{ {
let tmp = c[i]; let tmp = c[i];
result.push(new mxConnectionConstraint(new Point(tmp[0], tmp[1]), (tmp.length > 2) ? tmp[2] != '0' : true, result.push(new ConnectionConstraint(new Point(tmp[0], tmp[1]), (tmp.length > 2) ? tmp[2] != '0' : true,
null, (tmp.length > 3) ? tmp[3] : 0, (tmp.length > 4) ? tmp[4] : 0)); null, (tmp.length > 3) ? tmp[3] : 0, (tmp.length > 4) ? tmp[4] : 0));
} }
} }
@ -7430,7 +7430,7 @@ if (typeof mxVertexHandler != 'undefined')
{ {
if (cells != null) if (cells != null)
{ {
let dict = new mxDictionary(); let dict = new Dictionary();
for (let i = 0; i < cells.length; i++) for (let i = 0; i < cells.length; i++)
{ {
@ -9556,7 +9556,7 @@ if (typeof mxVertexHandler != 'undefined')
}; };
let mxConstraintHandlerUpdate = mxConstraintHandler.prototype.update; let mxConstraintHandlerUpdate = mxConstraintHandler.prototype.update;
mxConstraintHandler.prototype.update = function(me, source) ConstraintHandler.prototype.update = function(me, source)
{ {
if (this.isKeepFocusEvent(me) || !mxEvent.isAltDown(me.getEvent())) if (this.isKeepFocusEvent(me) || !mxEvent.isAltDown(me.getEvent()))
{ {
@ -10195,7 +10195,7 @@ if (typeof mxVertexHandler != 'undefined')
mxSelectionCellsHandler.prototype.getHandledSelectionCells = function() mxSelectionCellsHandler.prototype.getHandledSelectionCells = function()
{ {
let cells = selectionCellsHandlerGetHandledSelectionCells.apply(this, arguments); let cells = selectionCellsHandlerGetHandledSelectionCells.apply(this, arguments);
let dict = new mxDictionary(); let dict = new Dictionary();
let model = this.graph.model; let model = this.graph.model;
let result = []; let result = [];
@ -10230,8 +10230,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Creates the shape used to draw the selection border. * Creates the shape used to draw the selection border.
*/ */
let vertexHandlerCreateParentHighlightShape = mxVertexHandler.prototype.createParentHighlightShape; let vertexHandlerCreateParentHighlightShape = VertexHandler.prototype.createParentHighlightShape;
mxVertexHandler.prototype.createParentHighlightShape = function(bounds) VertexHandler.prototype.createParentHighlightShape = function(bounds)
{ {
let shape = vertexHandlerCreateParentHighlightShape.apply(this, arguments); let shape = vertexHandlerCreateParentHighlightShape.apply(this, arguments);
@ -10258,8 +10258,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Moves rotation handle to top, right corner. * Moves rotation handle to top, right corner.
*/ */
mxVertexHandler.prototype.rotationHandleVSpacing = -12; VertexHandler.prototype.rotationHandleVSpacing = -12;
mxVertexHandler.prototype.getRotationHandlePosition = function() VertexHandler.prototype.getRotationHandlePosition = function()
{ {
let padding = this.getHandlePadding(); let padding = this.getHandlePadding();
@ -10270,7 +10270,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Enables recursive resize for groups. * Enables recursive resize for groups.
*/ */
mxVertexHandler.prototype.isRecursiveResize = function(state, me) VertexHandler.prototype.isRecursiveResize = function(state, me)
{ {
return this.graph.isRecursiveVertexResize(state) && return this.graph.isRecursiveVertexResize(state) &&
!mxEvent.isControlDown(me.getEvent()); !mxEvent.isControlDown(me.getEvent());
@ -10279,7 +10279,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Enables centered resize events. * Enables centered resize events.
*/ */
mxVertexHandler.prototype.isCenteredEvent = function(state, me) VertexHandler.prototype.isCenteredEvent = function(state, me)
{ {
return (!(!this.graph.isSwimlane(state.cell) && state.cell.getChildCount() > 0 && return (!(!this.graph.isSwimlane(state.cell) && state.cell.getChildCount() > 0 &&
!state.cell.isCollapsed() && !state.cell.isCollapsed() &&
@ -10292,8 +10292,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Hides rotation handle for table cells and rows. * Hides rotation handle for table cells and rows.
*/ */
let vertexHandlerIsRotationHandleVisible = mxVertexHandler.prototype.isRotationHandleVisible; let vertexHandlerIsRotationHandleVisible = VertexHandler.prototype.isRotationHandleVisible;
mxVertexHandler.prototype.isRotationHandleVisible = function() VertexHandler.prototype.isRotationHandleVisible = function()
{ {
return vertexHandlerIsRotationHandleVisible.apply(this, arguments) && return vertexHandlerIsRotationHandleVisible.apply(this, arguments) &&
!this.graph.isTableCell(this.state.cell) && !this.graph.isTableCell(this.state.cell) &&
@ -10304,7 +10304,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Hides rotation handle for table cells and rows. * Hides rotation handle for table cells and rows.
*/ */
mxVertexHandler.prototype.getSizerBounds = function() VertexHandler.prototype.getSizerBounds = function()
{ {
if (this.graph.isTableCell(this.state.cell)) if (this.graph.isTableCell(this.state.cell))
{ {
@ -10319,8 +10319,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Hides rotation handle for table cells and rows. * Hides rotation handle for table cells and rows.
*/ */
let vertexHandlerIsParentHighlightVisible = mxVertexHandler.prototype.isParentHighlightVisible; let vertexHandlerIsParentHighlightVisible = VertexHandler.prototype.isParentHighlightVisible;
mxVertexHandler.prototype.isParentHighlightVisible = function() VertexHandler.prototype.isParentHighlightVisible = function()
{ {
return vertexHandlerIsParentHighlightVisible.apply(this, arguments) && return vertexHandlerIsParentHighlightVisible.apply(this, arguments) &&
!this.graph.isTableCell(this.state.cell) && !this.graph.isTableCell(this.state.cell) &&
@ -10330,8 +10330,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Hides rotation handle for table cells and rows. * Hides rotation handle for table cells and rows.
*/ */
let vertexHandlerIsCustomHandleVisible = mxVertexHandler.prototype.isCustomHandleVisible; let vertexHandlerIsCustomHandleVisible = VertexHandler.prototype.isCustomHandleVisible;
mxVertexHandler.prototype.isCustomHandleVisible = function(handle) VertexHandler.prototype.isCustomHandleVisible = function(handle)
{ {
return handle.tableHandle || return handle.tableHandle ||
(vertexHandlerIsCustomHandleVisible.apply(this, arguments) && (vertexHandlerIsCustomHandleVisible.apply(this, arguments) &&
@ -10342,7 +10342,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Adds selection border inset for table cells and rows. * Adds selection border inset for table cells and rows.
*/ */
mxVertexHandler.prototype.getSelectionBorderInset = function() VertexHandler.prototype.getSelectionBorderInset = function()
{ {
let result = 0; let result = 0;
@ -10361,8 +10361,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Adds custom handles for table cells. * Adds custom handles for table cells.
*/ */
let vertexHandlerGetSelectionBorderBounds = mxVertexHandler.prototype.getSelectionBorderBounds; let vertexHandlerGetSelectionBorderBounds = VertexHandler.prototype.getSelectionBorderBounds;
mxVertexHandler.prototype.getSelectionBorderBounds = function() VertexHandler.prototype.getSelectionBorderBounds = function()
{ {
return vertexHandlerGetSelectionBorderBounds.apply(this, arguments).grow( return vertexHandlerGetSelectionBorderBounds.apply(this, arguments).grow(
-this.getSelectionBorderInset()); -this.getSelectionBorderInset());
@ -10371,8 +10371,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Adds custom handles for table cells. * Adds custom handles for table cells.
*/ */
let vertexHandlerCreateCustomHandles = mxVertexHandler.prototype.createCustomHandles; let vertexHandlerCreateCustomHandles = VertexHandler.prototype.createCustomHandles;
mxVertexHandler.prototype.createCustomHandles = function() VertexHandler.prototype.createCustomHandles = function()
{ {
let handles = vertexHandlerCreateCustomHandles.apply(this, arguments); let handles = vertexHandlerCreateCustomHandles.apply(this, arguments);
@ -10410,7 +10410,7 @@ if (typeof mxVertexHandler != 'undefined')
// Workaround for event handling on overlapping cells with tolerance // Workaround for event handling on overlapping cells with tolerance
shape.svgStrokeTolerance++; shape.svgStrokeTolerance++;
let handle = new mxHandle(colState, 'col-resize', null, shape); let handle = new VertexHandle(colState, 'col-resize', null, shape);
handle.tableHandle = true; handle.tableHandle = true;
let dx = 0; let dx = 0;
@ -10487,7 +10487,7 @@ if (typeof mxVertexHandler != 'undefined')
shape.isDashed = sel.isDashed; shape.isDashed = sel.isDashed;
shape.svgStrokeTolerance++; shape.svgStrokeTolerance++;
let handle = new mxHandle(rowState, 'row-resize', null, shape); let handle = new VertexHandle(rowState, 'row-resize', null, shape);
handle.tableHandle = true; handle.tableHandle = true;
let dy = 0; let dy = 0;
@ -10545,9 +10545,9 @@ if (typeof mxVertexHandler != 'undefined')
return (handles != null) ? handles.reverse() : null; return (handles != null) ? handles.reverse() : null;
}; };
let vertexHandlerSetHandlesVisible = mxVertexHandler.prototype.setHandlesVisible; let vertexHandlerSetHandlesVisible = VertexHandler.prototype.setHandlesVisible;
mxVertexHandler.prototype.setHandlesVisible = function(visible) VertexHandler.prototype.setHandlesVisible = function(visible)
{ {
vertexHandlerSetHandlesVisible.apply(this, arguments); vertexHandlerSetHandlesVisible.apply(this, arguments);
@ -10571,7 +10571,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Creates or updates special handles for moving rows. * Creates or updates special handles for moving rows.
*/ */
mxVertexHandler.prototype.refreshMoveHandles = function() VertexHandler.prototype.refreshMoveHandles = function()
{ {
let graph = this.graph; let graph = this.graph;
let model = graph.model; let model = graph.model;
@ -10649,7 +10649,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Adds handle padding for editing cells and exceptions. * Adds handle padding for editing cells and exceptions.
*/ */
mxVertexHandler.prototype.refresh = function() VertexHandler.prototype.refresh = function()
{ {
if (this.customHandles != null) if (this.customHandles != null)
{ {
@ -10670,8 +10670,8 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Adds handle padding for editing cells and exceptions. * Adds handle padding for editing cells and exceptions.
*/ */
let vertexHandlerGetHandlePadding = mxVertexHandler.prototype.getHandlePadding; let vertexHandlerGetHandlePadding = VertexHandler.prototype.getHandlePadding;
mxVertexHandler.prototype.getHandlePadding = function() VertexHandler.prototype.getHandlePadding = function()
{ {
let result = new Point(0, 0); let result = new Point(0, 0);
let tol = this.tolerance; let tol = this.tolerance;
@ -10738,7 +10738,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Updates the hint for the current operation. * Updates the hint for the current operation.
*/ */
mxVertexHandler.prototype.updateHint = function(me) VertexHandler.prototype.updateHint = function(me)
{ {
if (this.index != mxEvent.LABEL_HANDLE) if (this.index != mxEvent.LABEL_HANDLE)
{ {
@ -10781,7 +10781,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Updates the hint for the current operation. * Updates the hint for the current operation.
*/ */
mxVertexHandler.prototype.removeHint = function() VertexHandler.prototype.removeHint = function()
{ {
mxGraphHandler.prototype.removeHint.apply(this, arguments); mxGraphHandler.prototype.removeHint.apply(this, arguments);
@ -10868,7 +10868,7 @@ if (typeof mxVertexHandler != 'undefined')
/** /**
* Updates the hint for the current operation. * Updates the hint for the current operation.
*/ */
mxEdgeHandler.prototype.removeHint = mxVertexHandler.prototype.removeHint; mxEdgeHandler.prototype.removeHint = VertexHandler.prototype.removeHint;
/** /**
* Defines the handles for the UI. Uses data-URIs to speed-up loading time where supported. * Defines the handles for the UI. Uses data-URIs to speed-up loading time where supported.
@ -10893,9 +10893,9 @@ if (typeof mxVertexHandler != 'undefined')
mxConstraintHandler.prototype.pointImage = Graph.createSvgImage(5, 5, '<path d="m 0 0 L 5 5 M 0 5 L 5 0" stroke="' + HoverIcons.prototype.arrowFill + '"/>'); mxConstraintHandler.prototype.pointImage = Graph.createSvgImage(5, 5, '<path d="m 0 0 L 5 5 M 0 5 L 5 0" stroke="' + HoverIcons.prototype.arrowFill + '"/>');
} }
mxVertexHandler.TABLE_HANDLE_COLOR = '#fca000'; VertexHandler.TABLE_HANDLE_COLOR = '#fca000';
mxVertexHandler.prototype.handleImage = HoverIcons.prototype.mainHandle; VertexHandler.prototype.handleImage = HoverIcons.prototype.mainHandle;
mxVertexHandler.prototype.secondaryHandleImage = HoverIcons.prototype.secondaryHandle; VertexHandler.prototype.secondaryHandleImage = HoverIcons.prototype.secondaryHandle;
mxEdgeHandler.prototype.handleImage = HoverIcons.prototype.mainHandle; mxEdgeHandler.prototype.handleImage = HoverIcons.prototype.mainHandle;
mxEdgeHandler.prototype.terminalHandleImage = HoverIcons.prototype.terminalHandle; mxEdgeHandler.prototype.terminalHandleImage = HoverIcons.prototype.terminalHandle;
mxEdgeHandler.prototype.fixedHandleImage = HoverIcons.prototype.fixedHandle; mxEdgeHandler.prototype.fixedHandleImage = HoverIcons.prototype.fixedHandle;
@ -10930,18 +10930,18 @@ if (typeof mxVertexHandler != 'undefined')
} }
// Adds rotation handle and live preview // Adds rotation handle and live preview
mxVertexHandler.prototype.rotationEnabled = true; VertexHandler.prototype.rotationEnabled = true;
mxVertexHandler.prototype.manageSizers = true; VertexHandler.prototype.manageSizers = true;
mxVertexHandler.prototype.livePreview = true; VertexHandler.prototype.livePreview = true;
GraphHandler.prototype.maxLivePreview = 16; GraphHandler.prototype.maxLivePreview = 16;
// Increases default rubberband opacity (default is 20) // Increases default rubberband opacity (default is 20)
mxRubberband.prototype.defaultOpacity = 30; RubberBand.prototype.defaultOpacity = 30;
// Enables connections along the outline, virtual waypoints, parent highlight etc // Enables connections along the outline, virtual waypoints, parent highlight etc
mxConnectionHandler.prototype.outlineConnect = true; ConnectionHandler.prototype.outlineConnect = true;
mxCellHighlight.prototype.keepOnTop = true; mxCellHighlight.prototype.keepOnTop = true;
mxVertexHandler.prototype.parentHighlightEnabled = true; VertexHandler.prototype.parentHighlightEnabled = true;
mxEdgeHandler.prototype.parentHighlightEnabled = true; mxEdgeHandler.prototype.parentHighlightEnabled = true;
mxEdgeHandler.prototype.dblClickRemoveEnabled = true; mxEdgeHandler.prototype.dblClickRemoveEnabled = true;
@ -10972,11 +10972,11 @@ if (typeof mxVertexHandler != 'undefined')
if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0)
{ {
Shape.prototype.svgStrokeTolerance = 18; Shape.prototype.svgStrokeTolerance = 18;
mxVertexHandler.prototype.tolerance = 12; VertexHandler.prototype.tolerance = 12;
mxEdgeHandler.prototype.tolerance = 12; mxEdgeHandler.prototype.tolerance = 12;
Graph.prototype.tolerance = 12; Graph.prototype.tolerance = 12;
mxVertexHandler.prototype.rotationHandleVSpacing = -16; VertexHandler.prototype.rotationHandleVSpacing = -16;
// Implements a smaller tolerance for mouse events and a larger tolerance for touch // Implements a smaller tolerance for mouse events and a larger tolerance for touch
// events on touch devices. The default tolerance (4px) is used for mouse events. // events on touch devices. The default tolerance (4px) is used for mouse events.
@ -11024,17 +11024,17 @@ if (typeof mxVertexHandler != 'undefined')
} }
// Overrides/extends rubberband for space handling with Ctrl+Shift(+Alt) drag ("scissors tool") // Overrides/extends rubberband for space handling with Ctrl+Shift(+Alt) drag ("scissors tool")
mxRubberband.prototype.isSpaceEvent = function(me) RubberBand.prototype.isSpaceEvent = function(me)
{ {
return this.graph.isEnabled() && !this.graph.isCellLocked(this.graph.getDefaultParent()) && return this.graph.isEnabled() && !this.graph.isCellLocked(this.graph.getDefaultParent()) &&
mxEvent.isControlDown(me.getEvent()) && mxEvent.isShiftDown(me.getEvent()); mxEvent.isControlDown(me.getEvent()) && mxEvent.isShiftDown(me.getEvent());
}; };
// Cancelled state // Cancelled state
mxRubberband.prototype.cancelled = false; RubberBand.prototype.cancelled = false;
// Cancels ongoing rubberband selection but consumed event to avoid reset of selection // Cancels ongoing rubberband selection but consumed event to avoid reset of selection
mxRubberband.prototype.cancel = function() RubberBand.prototype.cancel = function()
{ {
if (this.isActive()) if (this.isActive())
{ {
@ -11044,7 +11044,7 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Handles moving of cells in both half panes // Handles moving of cells in both half panes
mxRubberband.prototype.mouseUp = function(sender, me) RubberBand.prototype.mouseUp = function(sender, me)
{ {
if (this.cancelled) if (this.cancelled)
{ {
@ -11138,7 +11138,7 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Handles preview for creating/removing space in diagram // Handles preview for creating/removing space in diagram
mxRubberband.prototype.mouseMove = function(sender, me) RubberBand.prototype.mouseMove = function(sender, me)
{ {
if (!me.isConsumed() && this.first != null) if (!me.isConsumed() && this.first != null)
{ {
@ -11239,8 +11239,8 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Removes preview // Removes preview
let mxRubberbandReset = mxRubberband.prototype.reset; let mxRubberbandReset = RubberBand.prototype.reset;
mxRubberband.prototype.reset = function() RubberBand.prototype.reset = function()
{ {
if (this.secondDiv != null) if (this.secondDiv != null)
{ {
@ -11290,7 +11290,7 @@ if (typeof mxVertexHandler != 'undefined')
let source = index != null && index == 0; let source = index != null && index == 0;
let terminalState = this.state.getVisibleTerminalState(source); let terminalState = this.state.getVisibleTerminalState(source);
let c = (index != null && (index == 0 || index >= this.state.absolutePoints.length - 1 || let c = (index != null && (index == 0 || index >= this.state.absolutePoints.length - 1 ||
(this.constructor == mxElbowEdgeHandler && index == 2))) ? (this.constructor == ElbowEdgeHandler && index == 2))) ?
this.graph.getConnectionConstraint(this.state, terminalState, source) : null; this.graph.getConnectionConstraint(this.state, terminalState, source) : null;
let pt = (c != null) ? this.graph.getConnectionPoint(this.state.getVisibleTerminalState(source), c) : null; let pt = (c != null) ? this.graph.getConnectionPoint(this.state.getVisibleTerminalState(source), c) : null;
let img = (pt != null) ? this.fixedHandleImage : ((c != null && terminalState != null) ? let img = (pt != null) ? this.fixedHandleImage : ((c != null && terminalState != null) ?
@ -11318,8 +11318,8 @@ if (typeof mxVertexHandler != 'undefined')
} }
}; };
let vertexHandlerCreateSizerShape = mxVertexHandler.prototype.createSizerShape; let vertexHandlerCreateSizerShape = VertexHandler.prototype.createSizerShape;
mxVertexHandler.prototype.createSizerShape = function(bounds, index, fillColor) VertexHandler.prototype.createSizerShape = function(bounds, index, fillColor)
{ {
this.handleImage = (index == mxEvent.ROTATION_HANDLE) ? HoverIcons.prototype.rotationHandle : (index == mxEvent.LABEL_HANDLE) ? this.secondaryHandleImage : this.handleImage; this.handleImage = (index == mxEvent.ROTATION_HANDLE) ? HoverIcons.prototype.rotationHandle : (index == mxEvent.LABEL_HANDLE) ? this.secondaryHandleImage : this.handleImage;
@ -11372,8 +11372,8 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Uses text bounding box for edge labels // Uses text bounding box for edge labels
let mxVertexHandlerGetSelectionBounds = mxVertexHandler.prototype.getSelectionBounds; let mxVertexHandlerGetSelectionBounds = VertexHandler.prototype.getSelectionBounds;
mxVertexHandler.prototype.getSelectionBounds = function(state) VertexHandler.prototype.getSelectionBounds = function(state)
{ {
let model = this.graph.getModel(); let model = this.graph.getModel();
let parent = state.cell.getParent(); let parent = state.cell.getParent();
@ -11393,8 +11393,8 @@ if (typeof mxVertexHandler != 'undefined')
// Redirects moving of edge labels to mxGraphHandler by not starting here. // Redirects moving of edge labels to mxGraphHandler by not starting here.
// This will use the move preview of mxGraphHandler (see above). // This will use the move preview of mxGraphHandler (see above).
let mxVertexHandlerMouseDown = mxVertexHandler.prototype.mouseDown; let mxVertexHandlerMouseDown = VertexHandler.prototype.mouseDown;
mxVertexHandler.prototype.mouseDown = function(sender, me) VertexHandler.prototype.mouseDown = function(sender, me)
{ {
let model = this.graph.getModel(); let model = this.graph.getModel();
let parent = this.state.cell.getParent(); let parent = this.state.cell.getParent();
@ -11411,7 +11411,7 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Invokes turn on single click on rotation handle // Invokes turn on single click on rotation handle
mxVertexHandler.prototype.rotateClick = function() VertexHandler.prototype.rotateClick = function()
{ {
let stroke = mxUtils.getValue(this.state.style, 'strokeColor', mxConstants.NONE); let stroke = mxUtils.getValue(this.state.style, 'strokeColor', mxConstants.NONE);
let fill = mxUtils.getValue(this.state.style, 'fillColor', mxConstants.NONE); let fill = mxUtils.getValue(this.state.style, 'fillColor', mxConstants.NONE);
@ -11428,10 +11428,10 @@ if (typeof mxVertexHandler != 'undefined')
} }
}; };
let vertexHandlerMouseMove = mxVertexHandler.prototype.mouseMove; let vertexHandlerMouseMove = VertexHandler.prototype.mouseMove;
// Workaround for "isConsumed not defined" in MS Edge is to use arguments // Workaround for "isConsumed not defined" in MS Edge is to use arguments
mxVertexHandler.prototype.mouseMove = function(sender, me) VertexHandler.prototype.mouseMove = function(sender, me)
{ {
vertexHandlerMouseMove.apply(this, arguments); vertexHandlerMouseMove.apply(this, arguments);
@ -11449,9 +11449,9 @@ if (typeof mxVertexHandler != 'undefined')
} }
}; };
let vertexHandlerMouseUp = mxVertexHandler.prototype.mouseUp; let vertexHandlerMouseUp = VertexHandler.prototype.mouseUp;
mxVertexHandler.prototype.mouseUp = function(sender, me) VertexHandler.prototype.mouseUp = function(sender, me)
{ {
vertexHandlerMouseUp.apply(this, arguments); vertexHandlerMouseUp.apply(this, arguments);
@ -11470,8 +11470,8 @@ if (typeof mxVertexHandler != 'undefined')
this.blockDelayedSelection = null; this.blockDelayedSelection = null;
}; };
let vertexHandlerInit = mxVertexHandler.prototype.init; let vertexHandlerInit = VertexHandler.prototype.init;
mxVertexHandler.prototype.init = function() VertexHandler.prototype.init = function()
{ {
vertexHandlerInit.apply(this, arguments); vertexHandlerInit.apply(this, arguments);
let redraw = false; let redraw = false;
@ -11548,7 +11548,7 @@ if (typeof mxVertexHandler != 'undefined')
} }
}; };
mxVertexHandler.prototype.updateLinkHint = function(link, links) VertexHandler.prototype.updateLinkHint = function(link, links)
{ {
try try
{ {
@ -11637,7 +11637,7 @@ if (typeof mxVertexHandler != 'undefined')
} }
}; };
mxEdgeHandler.prototype.updateLinkHint = mxVertexHandler.prototype.updateLinkHint; mxEdgeHandler.prototype.updateLinkHint = VertexHandler.prototype.updateLinkHint;
// Creates special handles // Creates special handles
let edgeHandlerInit = mxEdgeHandler.prototype.init; let edgeHandlerInit = mxEdgeHandler.prototype.init;
@ -11688,9 +11688,9 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Disables connection points // Disables connection points
let connectionHandlerInit = mxConnectionHandler.prototype.init; let connectionHandlerInit = ConnectionHandler.prototype.init;
mxConnectionHandler.prototype.init = function() ConnectionHandler.prototype.init = function()
{ {
connectionHandlerInit.apply(this, arguments); connectionHandlerInit.apply(this, arguments);
@ -11701,8 +11701,8 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Updates special handles // Updates special handles
let vertexHandlerRedrawHandles = mxVertexHandler.prototype.redrawHandles; let vertexHandlerRedrawHandles = VertexHandler.prototype.redrawHandles;
mxVertexHandler.prototype.redrawHandles = function() VertexHandler.prototype.redrawHandles = function()
{ {
if (this.moveHandles != null) if (this.moveHandles != null)
{ {
@ -11778,8 +11778,8 @@ if (typeof mxVertexHandler != 'undefined')
}; };
// Destroys special handles // Destroys special handles
let vertexHandlerDestroy = mxVertexHandler.prototype.destroy; let vertexHandlerDestroy = VertexHandler.prototype.destroy;
mxVertexHandler.prototype.destroy = function() VertexHandler.prototype.destroy = function()
{ {
vertexHandlerDestroy.apply(this, arguments); vertexHandlerDestroy.apply(this, arguments);

712
docs/stashed/grapheditor/www/js/Shapes.js
View File

@ -3717,11 +3717,11 @@
} }
// Handlers are only added if mxVertexHandler is defined (ie. not in embedded graph) // Handlers are only added if mxVertexHandler is defined (ie. not in embedded graph)
if (typeof mxVertexHandler !== 'undefined') if (typeof VertexHandler !== 'undefined')
{ {
function createHandle(state, keys, getPositionFn, setPositionFn, ignoreGrid, redrawEdges, executeFn) function createHandle(state, keys, getPositionFn, setPositionFn, ignoreGrid, redrawEdges, executeFn)
{ {
let handle = new mxHandle(state, null, mxVertexHandler.prototype.secondaryHandleImage); let handle = new VertexHandle(state, null, VertexHandler.prototype.secondaryHandleImage);
handle.execute = function(me) handle.execute = function(me)
{ {
@ -4540,9 +4540,9 @@
Graph.createHandle = createHandle; Graph.createHandle = createHandle;
Graph.handleFactory = handleFactory; Graph.handleFactory = handleFactory;
let vertexHandlerCreateCustomHandles = mxVertexHandler.prototype.createCustomHandles; let vertexHandlerCreateCustomHandles = VertexHandler.prototype.createCustomHandles;
mxVertexHandler.prototype.createCustomHandles = function() VertexHandler.prototype.createCustomHandles = function()
{ {
let handles = vertexHandlerCreateCustomHandles.apply(this, arguments); let handles = vertexHandlerCreateCustomHandles.apply(this, arguments);
@ -4725,7 +4725,7 @@
{ {
if (edgeStyle == mxEdgeStyle.IsometricConnector) if (edgeStyle == mxEdgeStyle.IsometricConnector)
{ {
let handler = new mxElbowEdgeHandler(state); let handler = new ElbowEdgeHandler(state);
handler.snapToTerminals = false; handler.snapToTerminals = false;
return handler; return handler;
@ -4746,12 +4746,12 @@
let dx = (w - m) / 2; let dx = (w - m) / 2;
let dy = (h - m) / 2; let dy = (h - m) / 2;
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, dy + 0.25 * m)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy + 0.25 * m));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx + 0.5 * m, dy + m * tan30Dx)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx + 0.5 * m, dy + m * tan30Dx));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx + m, dy + 0.25 * m)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx + m, dy + 0.25 * m));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx + m, dy + 0.75 * m)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx + m, dy + 0.75 * m));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx + 0.5 * m, dy + (1 - tan30Dx) * m)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx + 0.5 * m, dy + (1 - tan30Dx) * m));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, dy + 0.75 * m)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy + 0.75 * m));
return (constr); return (constr);
}; };
@ -4762,14 +4762,14 @@
let isoAngle = Math.max(0.01, Math.min(94, parseFloat(utils.getValue(this.style, 'isoAngle', this.isoAngle)))) * Math.PI / 200 ; let isoAngle = Math.max(0.01, Math.min(94, parseFloat(utils.getValue(this.style, 'isoAngle', this.isoAngle)))) * Math.PI / 200 ;
let isoH = Math.min(w * Math.tan(isoAngle), h * 0.5); let isoH = Math.min(w * Math.tan(isoAngle), h * 0.5);
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, isoH)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, isoH));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, h - isoH)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h - isoH));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - isoH)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - isoH));
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, isoH)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, isoH));
return (constr); return (constr);
} }
@ -4783,45 +4783,45 @@
var dx2 = w * Math.max(0, Math.min(1, parseFloat(utils.getValue(this.style, 'position2', this.position2)))); var dx2 = w * Math.max(0, Math.min(1, parseFloat(utils.getValue(this.style, 'position2', this.position2))));
let base = Math.max(0, Math.min(w, parseFloat(utils.getValue(this.style, 'base', this.base)))); let base = Math.max(0, Math.min(w, parseFloat(utils.getValue(this.style, 'base', this.base))));
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0.25, 0), false)); constr.push(new ConnectionConstraint(new Point(0.25, 0), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(0.75, 0), false)); constr.push(new ConnectionConstraint(new Point(0.75, 0), false));
constr.push(new mxConnectionConstraint(new Point(1, 0), false)); constr.push(new ConnectionConstraint(new Point(1, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, h - s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h - s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx2, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx2, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5));
if (w >= s * 2) if (w >= s * 2)
{ {
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
} }
return (constr); return (constr);
}; };
RectangleShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), true), RectangleShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), true),
new mxConnectionConstraint(new Point(0.25, 0), true), new ConnectionConstraint(new Point(0.25, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.75, 0), true), new ConnectionConstraint(new Point(0.75, 0), true),
new mxConnectionConstraint(new Point(1, 0), true), new ConnectionConstraint(new Point(1, 0), true),
new mxConnectionConstraint(new Point(0, 0.25), true), new ConnectionConstraint(new Point(0, 0.25), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true), new ConnectionConstraint(new Point(1, 0.75), true),
new mxConnectionConstraint(new Point(0, 1), true), new ConnectionConstraint(new Point(0, 1), true),
new mxConnectionConstraint(new Point(0.25, 1), true), new ConnectionConstraint(new Point(0.25, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.75, 1), true), new ConnectionConstraint(new Point(0.75, 1), true),
new mxConnectionConstraint(new Point(1, 1), true)]; new ConnectionConstraint(new Point(1, 1), true)];
Ellipse.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), true), new mxConnectionConstraint(new Point(1, 0), true), Ellipse.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), true), new ConnectionConstraint(new Point(1, 0), true),
new mxConnectionConstraint(new Point(0, 1), true), new mxConnectionConstraint(new Point(1, 1), true), new ConnectionConstraint(new Point(0, 1), true), new ConnectionConstraint(new Point(1, 1), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new mxConnectionConstraint(new Point(1, 0.5))]; new ConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(1, 0.5))];
PartialRectangleShape.prototype.constraints = RectangleShape.prototype.constraints; PartialRectangleShape.prototype.constraints = RectangleShape.prototype.constraints;
ImageShape.prototype.constraints = RectangleShape.prototype.constraints; ImageShape.prototype.constraints = RectangleShape.prototype.constraints;
Swimlane.prototype.constraints = RectangleShape.prototype.constraints; Swimlane.prototype.constraints = RectangleShape.prototype.constraints;
@ -4833,20 +4833,20 @@
let constr = []; let constr = [];
let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size))))); let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size)))));
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - s, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - s * 0.5, s * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s * 0.5, s * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5 )); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5 ));
constr.push(new mxConnectionConstraint(new Point(1, 1), false)); constr.push(new ConnectionConstraint(new Point(1, 1), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 1), false)); constr.push(new ConnectionConstraint(new Point(0, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
if (w >= s * 2) if (w >= s * 2)
{ {
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
} }
return (constr); return (constr);
@ -4857,20 +4857,20 @@
let constr = []; let constr = [];
let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size))))); let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size)))));
constr.push(new mxConnectionConstraint(new Point(1, 0), false)); constr.push(new ConnectionConstraint(new Point(1, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s * 0.5, s * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s * 0.5, s * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h + s) * 0.5 )); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h + s) * 0.5 ));
constr.push(new mxConnectionConstraint(new Point(0, 1), false)); constr.push(new ConnectionConstraint(new Point(0, 1), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(1, 1), false)); constr.push(new ConnectionConstraint(new Point(1, 1), false));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
if (w >= s * 2) if (w >= s * 2)
{ {
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
} }
return (constr); return (constr);
@ -4881,18 +4881,18 @@
let constr = []; let constr = [];
let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size))))); let s = Math.max(0, Math.min(w, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size)))));
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - s, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - s * 0.5, s * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s * 0.5, s * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(1, 1), false)); constr.push(new ConnectionConstraint(new Point(1, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s * 0.5, h - s * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s * 0.5, h - s * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5));
return (constr); return (constr);
}; };
@ -4902,25 +4902,25 @@
let constr = []; let constr = [];
let s = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size)))); let s = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'size', this.size))));
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, s)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, s));
constr.push(new mxConnectionConstraint(new Point(1, 0), false, null, 0, s)); constr.push(new ConnectionConstraint(new Point(1, 0), false, null, 0, s));
constr.push(new mxConnectionConstraint(new Point(1, 1), false, null, 0, -s)); constr.push(new ConnectionConstraint(new Point(1, 1), false, null, 0, -s));
constr.push(new mxConnectionConstraint(new Point(0, 1), false, null, 0, -s)); constr.push(new ConnectionConstraint(new Point(0, 1), false, null, 0, -s));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, s + (h * 0.5 - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, s + (h * 0.5 - s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(1, 0), false, null, 0, s + (h * 0.5 - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(1, 0), false, null, 0, s + (h * 0.5 - s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(1, 0), false, null, 0, h - s - (h * 0.5 - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(1, 0), false, null, 0, h - s - (h * 0.5 - s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - s - (h * 0.5 - s) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - s - (h * 0.5 - s) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0.145, 0), false, null, 0, s * 0.29)); constr.push(new ConnectionConstraint(new Point(0.145, 0), false, null, 0, s * 0.29));
constr.push(new mxConnectionConstraint(new Point(0.855, 0), false, null, 0, s * 0.29)); constr.push(new ConnectionConstraint(new Point(0.855, 0), false, null, 0, s * 0.29));
constr.push(new mxConnectionConstraint(new Point(0.855, 1), false, null, 0, -s * 0.29)); constr.push(new ConnectionConstraint(new Point(0.855, 1), false, null, 0, -s * 0.29));
constr.push(new mxConnectionConstraint(new Point(0.145, 1), false, null, 0, -s * 0.29)); constr.push(new ConnectionConstraint(new Point(0.145, 1), false, null, 0, -s * 0.29));
return (constr); return (constr);
}; };
@ -4934,34 +4934,34 @@
if (tp == 'left') if (tp == 'left')
{ {
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy));
} }
else else
{ {
constr.push(new mxConnectionConstraint(new Point(1, 0), false)); constr.push(new ConnectionConstraint(new Point(1, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - dx * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - dx, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - dx, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, dy));
} }
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.25 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.25 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.5 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.5 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.75 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.75 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.25 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.25 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.5 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.5 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.75 + dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.75 + dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h));
constr.push(new mxConnectionConstraint(new Point(0.25, 1), false)); constr.push(new ConnectionConstraint(new Point(0.25, 1), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(0.75, 1), false)); constr.push(new ConnectionConstraint(new Point(0.75, 1), false));
return (constr); return (constr);
} }
@ -4981,14 +4981,14 @@
let dx = Math.min(w, h / 2); let dx = Math.min(w, h / 2);
let s = Math.min(w - dx, Math.max(0, parseFloat(utils.getValue(this.style, 'size', this.size))) * w); let s = Math.min(w - dx, Math.max(0, parseFloat(utils.getValue(this.style, 'size', this.size))) * w);
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false, null)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false, null));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - dx, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, 0));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false, null)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false, null));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - dx, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, s, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, h));
return (constr); return (constr);
}; };
@ -4997,35 +4997,35 @@
{ {
var x0 = parseFloat(utils.getValue(style, 'jettyWidth', ModuleShape.prototype.jettyWidth)) / 2; var x0 = parseFloat(utils.getValue(style, 'jettyWidth', ModuleShape.prototype.jettyWidth)) / 2;
let dy = parseFloat(utils.getValue(style, 'jettyHeight', ModuleShape.prototype.jettyHeight)); let dy = parseFloat(utils.getValue(style, 'jettyHeight', ModuleShape.prototype.jettyHeight));
let constr = [new mxConnectionConstraint(new Point(0, 0), false, null, x0), let constr = [new ConnectionConstraint(new Point(0, 0), false, null, x0),
new mxConnectionConstraint(new Point(0.25, 0), true), new ConnectionConstraint(new Point(0.25, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.75, 0), true), new ConnectionConstraint(new Point(0.75, 0), true),
new mxConnectionConstraint(new Point(1, 0), true), new ConnectionConstraint(new Point(1, 0), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true), new ConnectionConstraint(new Point(1, 0.75), true),
new mxConnectionConstraint(new Point(0, 1), false, null, x0), new ConnectionConstraint(new Point(0, 1), false, null, x0),
new mxConnectionConstraint(new Point(0.25, 1), true), new ConnectionConstraint(new Point(0.25, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.75, 1), true), new ConnectionConstraint(new Point(0.75, 1), true),
new mxConnectionConstraint(new Point(1, 1), true), new ConnectionConstraint(new Point(1, 1), true),
new mxConnectionConstraint(new Point(0, 0), false, null, 0, Math.min(h - 0.5 * dy, 1.5 * dy)), new ConnectionConstraint(new Point(0, 0), false, null, 0, Math.min(h - 0.5 * dy, 1.5 * dy)),
new mxConnectionConstraint(new Point(0, 0), false, null, 0, Math.min(h - 0.5 * dy, 3.5 * dy))]; new ConnectionConstraint(new Point(0, 0), false, null, 0, Math.min(h - 0.5 * dy, 3.5 * dy))];
if (h > 5 * dy) if (h > 5 * dy)
{ {
constr.push(new mxConnectionConstraint(new Point(0, 0.75), false, null, x0)); constr.push(new ConnectionConstraint(new Point(0, 0.75), false, null, x0));
} }
if (h > 8 * dy) if (h > 8 * dy)
{ {
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false, null, x0)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false, null, x0));
} }
if (h > 15 * dy) if (h > 15 * dy)
{ {
constr.push(new mxConnectionConstraint(new Point(0, 0.25), false, null, x0)); constr.push(new ConnectionConstraint(new Point(0, 0.25), false, null, x0));
} }
return constr; return constr;
@ -5033,124 +5033,124 @@
LoopLimitShape.prototype.constraints = RectangleShape.prototype.constraints; LoopLimitShape.prototype.constraints = RectangleShape.prototype.constraints;
OffPageConnectorShape.prototype.constraints = RectangleShape.prototype.constraints; OffPageConnectorShape.prototype.constraints = RectangleShape.prototype.constraints;
mxCylinder.prototype.constraints = [new mxConnectionConstraint(new Point(0.15, 0.05), false), mxCylinder.prototype.constraints = [new ConnectionConstraint(new Point(0.15, 0.05), false),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.85, 0.05), false), new ConnectionConstraint(new Point(0.85, 0.05), false),
new mxConnectionConstraint(new Point(0, 0.3), true), new ConnectionConstraint(new Point(0, 0.3), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.7), true), new ConnectionConstraint(new Point(0, 0.7), true),
new mxConnectionConstraint(new Point(1, 0.3), true), new ConnectionConstraint(new Point(1, 0.3), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.7), true), new ConnectionConstraint(new Point(1, 0.7), true),
new mxConnectionConstraint(new Point(0.15, 0.95), false), new ConnectionConstraint(new Point(0.15, 0.95), false),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.85, 0.95), false)]; new ConnectionConstraint(new Point(0.85, 0.95), false)];
UmlActorShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0.1), false), UmlActorShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0.1), false),
new mxConnectionConstraint(new Point(0.5, 0), false), new ConnectionConstraint(new Point(0.5, 0), false),
new mxConnectionConstraint(new Point(0.75, 0.1), false), new ConnectionConstraint(new Point(0.75, 0.1), false),
new mxConnectionConstraint(new Point(0, 1/3), false), new ConnectionConstraint(new Point(0, 1/3), false),
new mxConnectionConstraint(new Point(0, 1), false), new ConnectionConstraint(new Point(0, 1), false),
new mxConnectionConstraint(new Point(1, 1/3), false), new ConnectionConstraint(new Point(1, 1/3), false),
new mxConnectionConstraint(new Point(1, 1), false), new ConnectionConstraint(new Point(1, 1), false),
new mxConnectionConstraint(new Point(0.5, 0.5), false)]; new ConnectionConstraint(new Point(0.5, 0.5), false)];
ComponentShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), ComponentShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.75, 0), true), new ConnectionConstraint(new Point(0.75, 0), true),
new mxConnectionConstraint(new Point(0, 0.3), true), new ConnectionConstraint(new Point(0, 0.3), true),
new mxConnectionConstraint(new Point(0, 0.7), true), new ConnectionConstraint(new Point(0, 0.7), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true), new ConnectionConstraint(new Point(1, 0.75), true),
new mxConnectionConstraint(new Point(0.25, 1), true), new ConnectionConstraint(new Point(0.25, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.75, 1), true)]; new ConnectionConstraint(new Point(0.75, 1), true)];
Actor.prototype.constraints = [new mxConnectionConstraint(new Point(0.5, 0), true), Actor.prototype.constraints = [new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.25, 0.2), false), new ConnectionConstraint(new Point(0.25, 0.2), false),
new mxConnectionConstraint(new Point(0.1, 0.5), false), new ConnectionConstraint(new Point(0.1, 0.5), false),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(0.75, 0.25), false), new ConnectionConstraint(new Point(0.75, 0.25), false),
new mxConnectionConstraint(new Point(0.9, 0.5), false), new ConnectionConstraint(new Point(0.9, 0.5), false),
new mxConnectionConstraint(new Point(1, 0.75), true), new ConnectionConstraint(new Point(1, 0.75), true),
new mxConnectionConstraint(new Point(0.25, 1), true), new ConnectionConstraint(new Point(0.25, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.75, 1), true)]; new ConnectionConstraint(new Point(0.75, 1), true)];
SwitchShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), false), SwitchShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), false),
new mxConnectionConstraint(new Point(0.5, 0.25), false), new ConnectionConstraint(new Point(0.5, 0.25), false),
new mxConnectionConstraint(new Point(1, 0), false), new ConnectionConstraint(new Point(1, 0), false),
new mxConnectionConstraint(new Point(0.25, 0.5), false), new ConnectionConstraint(new Point(0.25, 0.5), false),
new mxConnectionConstraint(new Point(0.75, 0.5), false), new ConnectionConstraint(new Point(0.75, 0.5), false),
new mxConnectionConstraint(new Point(0, 1), false), new ConnectionConstraint(new Point(0, 1), false),
new mxConnectionConstraint(new Point(0.5, 0.75), false), new ConnectionConstraint(new Point(0.5, 0.75), false),
new mxConnectionConstraint(new Point(1, 1), false)]; new ConnectionConstraint(new Point(1, 1), false)];
TapeShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.35), false), TapeShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.35), false),
new mxConnectionConstraint(new Point(0, 0.5), false), new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(0, 0.65), false), new ConnectionConstraint(new Point(0, 0.65), false),
new mxConnectionConstraint(new Point(1, 0.35), false), new ConnectionConstraint(new Point(1, 0.35), false),
new mxConnectionConstraint(new Point(1, 0.5), false), new ConnectionConstraint(new Point(1, 0.5), false),
new mxConnectionConstraint(new Point(1, 0.65), false), new ConnectionConstraint(new Point(1, 0.65), false),
new mxConnectionConstraint(new Point(0.25, 1), false), new ConnectionConstraint(new Point(0.25, 1), false),
new mxConnectionConstraint(new Point(0.75, 0), false)]; new ConnectionConstraint(new Point(0.75, 0), false)];
StepShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), StepShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.75, 0), true), new ConnectionConstraint(new Point(0.75, 0), true),
new mxConnectionConstraint(new Point(0.25, 1), true), new ConnectionConstraint(new Point(0.25, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.75, 1), true), new ConnectionConstraint(new Point(0.75, 1), true),
new mxConnectionConstraint(new Point(0, 0.25), true), new ConnectionConstraint(new Point(0, 0.25), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true)]; new ConnectionConstraint(new Point(1, 0.75), true)];
mxLine.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), mxLine.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(0.25, 0.5), false), new ConnectionConstraint(new Point(0.25, 0.5), false),
new mxConnectionConstraint(new Point(0.75, 0.5), false), new ConnectionConstraint(new Point(0.75, 0.5), false),
new mxConnectionConstraint(new Point(1, 0.5), false)]; new ConnectionConstraint(new Point(1, 0.5), false)];
LollipopShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.5, 0), false), LollipopShape.prototype.constraints = [new ConnectionConstraint(new Point(0.5, 0), false),
new mxConnectionConstraint(new Point(0.5, 1), false)]; new ConnectionConstraint(new Point(0.5, 1), false)];
DoubleEllipse.prototype.constraints = Ellipse.prototype.constraints; DoubleEllipse.prototype.constraints = Ellipse.prototype.constraints;
Rhombus.prototype.constraints = Ellipse.prototype.constraints; Rhombus.prototype.constraints = Ellipse.prototype.constraints;
Triangle.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.25), true), Triangle.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.25), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(1, 0.5), true)]; new ConnectionConstraint(new Point(1, 0.5), true)];
Hexagon.prototype.constraints = [new mxConnectionConstraint(new Point(0.375, 0), true), Hexagon.prototype.constraints = [new ConnectionConstraint(new Point(0.375, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.625, 0), true), new ConnectionConstraint(new Point(0.625, 0), true),
new mxConnectionConstraint(new Point(0, 0.25), true), new ConnectionConstraint(new Point(0, 0.25), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true), new ConnectionConstraint(new Point(1, 0.75), true),
new mxConnectionConstraint(new Point(0.375, 1), true), new ConnectionConstraint(new Point(0.375, 1), true),
new mxConnectionConstraint(new Point(0.5, 1), true), new ConnectionConstraint(new Point(0.5, 1), true),
new mxConnectionConstraint(new Point(0.625, 1), true)]; new ConnectionConstraint(new Point(0.625, 1), true)];
Cloud.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0.25), false), Cloud.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0.25), false),
new mxConnectionConstraint(new Point(0.4, 0.1), false), new ConnectionConstraint(new Point(0.4, 0.1), false),
new mxConnectionConstraint(new Point(0.16, 0.55), false), new ConnectionConstraint(new Point(0.16, 0.55), false),
new mxConnectionConstraint(new Point(0.07, 0.4), false), new ConnectionConstraint(new Point(0.07, 0.4), false),
new mxConnectionConstraint(new Point(0.31, 0.8), false), new ConnectionConstraint(new Point(0.31, 0.8), false),
new mxConnectionConstraint(new Point(0.13, 0.77), false), new ConnectionConstraint(new Point(0.13, 0.77), false),
new mxConnectionConstraint(new Point(0.8, 0.8), false), new ConnectionConstraint(new Point(0.8, 0.8), false),
new mxConnectionConstraint(new Point(0.55, 0.95), false), new ConnectionConstraint(new Point(0.55, 0.95), false),
new mxConnectionConstraint(new Point(0.875, 0.5), false), new ConnectionConstraint(new Point(0.875, 0.5), false),
new mxConnectionConstraint(new Point(0.96, 0.7), false), new ConnectionConstraint(new Point(0.96, 0.7), false),
new mxConnectionConstraint(new Point(0.625, 0.2), false), new ConnectionConstraint(new Point(0.625, 0.2), false),
new mxConnectionConstraint(new Point(0.88, 0.25), false)]; new ConnectionConstraint(new Point(0.88, 0.25), false)];
ParallelogramShape.prototype.constraints = RectangleShape.prototype.constraints; ParallelogramShape.prototype.constraints = RectangleShape.prototype.constraints;
TrapezoidShape.prototype.constraints = RectangleShape.prototype.constraints; TrapezoidShape.prototype.constraints = RectangleShape.prototype.constraints;
DocumentShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), DocumentShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true),
new mxConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 0), true),
new mxConnectionConstraint(new Point(0.75, 0), true), new ConnectionConstraint(new Point(0.75, 0), true),
new mxConnectionConstraint(new Point(0, 0.25), true), new ConnectionConstraint(new Point(0, 0.25), true),
new mxConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(0, 0.5), true),
new mxConnectionConstraint(new Point(0, 0.75), true), new ConnectionConstraint(new Point(0, 0.75), true),
new mxConnectionConstraint(new Point(1, 0.25), true), new ConnectionConstraint(new Point(1, 0.25), true),
new mxConnectionConstraint(new Point(1, 0.5), true), new ConnectionConstraint(new Point(1, 0.5), true),
new mxConnectionConstraint(new Point(1, 0.75), true)]; new ConnectionConstraint(new Point(1, 0.75), true)];
mxArrow.prototype.constraints = null; mxArrow.prototype.constraints = null;
TeeShape.prototype.getConstraints = function(style, w, h) TeeShape.prototype.getConstraints = function(style, w, h)
@ -5160,22 +5160,22 @@
let dy = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'dy', this.dy)))); let dy = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'dy', this.dy))));
var w2 = Math.abs(w - dx) / 2; var w2 = Math.abs(w - dx) / 2;
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(1, 0), false)); constr.push(new ConnectionConstraint(new Point(1, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w * 0.75 + dx * 0.25, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.75 + dx * 0.25, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, (h + dy) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, (h + dy) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, h));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, (h + dy) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, (h + dy) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w * 0.25 - dx * 0.25, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.25 - dx * 0.25, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, dy * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy * 0.5));
return (constr); return (constr);
}; };
@ -5186,31 +5186,31 @@
let dx = Math.max(0, Math.min(w, parseFloat(utils.getValue(this.style, 'dx', this.dx)))); let dx = Math.max(0, Math.min(w, parseFloat(utils.getValue(this.style, 'dx', this.dx))));
let dy = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'dy', this.dy)))); let dy = Math.max(0, Math.min(h, parseFloat(utils.getValue(this.style, 'dy', this.dy))));
constr.push(new mxConnectionConstraint(new Point(0, 0), false)); constr.push(new ConnectionConstraint(new Point(0, 0), false));
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(1, 0), false)); constr.push(new ConnectionConstraint(new Point(1, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, dy)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, (h + dy) * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, (h + dy) * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, h));
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 1), false)); constr.push(new ConnectionConstraint(new Point(0, 1), false));
return (constr); return (constr);
}; };
CrossbarShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), false), CrossbarShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), false),
new mxConnectionConstraint(new Point(0, 0.5), false), new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(0, 1), false), new ConnectionConstraint(new Point(0, 1), false),
new mxConnectionConstraint(new Point(0.25, 0.5), false), new ConnectionConstraint(new Point(0.25, 0.5), false),
new mxConnectionConstraint(new Point(0.5, 0.5), false), new ConnectionConstraint(new Point(0.5, 0.5), false),
new mxConnectionConstraint(new Point(0.75, 0.5), false), new ConnectionConstraint(new Point(0.75, 0.5), false),
new mxConnectionConstraint(new Point(1, 0), false), new ConnectionConstraint(new Point(1, 0), false),
new mxConnectionConstraint(new Point(1, 0.5), false), new ConnectionConstraint(new Point(1, 0.5), false),
new mxConnectionConstraint(new Point(1, 1), false)]; new ConnectionConstraint(new Point(1, 1), false)];
SingleArrowShape.prototype.getConstraints = function(style, w, h) SingleArrowShape.prototype.getConstraints = function(style, w, h)
{ {
@ -5220,14 +5220,14 @@
let at = (h - aw) / 2; let at = (h - aw) / 2;
let ab = at + aw; let ab = at + aw;
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, at));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, at));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, 0));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - as, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, h - at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, h - at));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - at));
return (constr); return (constr);
}; };
@ -5240,14 +5240,14 @@
let at = (h - aw) / 2; let at = (h - aw) / 2;
let ab = at + aw; let ab = at + aw;
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, as, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, as, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w * 0.5, at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.5, at));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, 0));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w - as, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w * 0.5, h - at)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.5, h - at));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, as, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, as, h));
return (constr); return (constr);
}; };
@ -5262,49 +5262,49 @@
let l = (w - size) / 2; let l = (w - size) / 2;
let r = l + size; let r = l + size;
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, t * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, t * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, 0));
constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); constr.push(new ConnectionConstraint(new Point(0.5, 0), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, 0)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, 0));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, t * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, t * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, t));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, h - t * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, h - t * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, h));
constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); constr.push(new ConnectionConstraint(new Point(0.5, 1), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, h)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, h));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, h - t * 0.5)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, h - t * 0.5));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, r, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, t));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, t));
constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); constr.push(new ConnectionConstraint(new Point(1, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l * 0.5, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l * 0.5, t));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, t));
constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); constr.push(new ConnectionConstraint(new Point(0, 0.5), false));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l * 0.5, b)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l * 0.5, b));
constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, l, t)); constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, t));
return (constr); return (constr);
}; };
UmlLifeline.prototype.constraints = null; UmlLifeline.prototype.constraints = null;
OrShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.25), false), OrShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.25), false),
new mxConnectionConstraint(new Point(0, 0.5), false), new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(0, 0.75), false), new ConnectionConstraint(new Point(0, 0.75), false),
new mxConnectionConstraint(new Point(1, 0.5), false), new ConnectionConstraint(new Point(1, 0.5), false),
new mxConnectionConstraint(new Point(0.7, 0.1), false), new ConnectionConstraint(new Point(0.7, 0.1), false),
new mxConnectionConstraint(new Point(0.7, 0.9), false)]; new ConnectionConstraint(new Point(0.7, 0.9), false)];
XorShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.175, 0.25), false), XorShape.prototype.constraints = [new ConnectionConstraint(new Point(0.175, 0.25), false),
new mxConnectionConstraint(new Point(0.25, 0.5), false), new ConnectionConstraint(new Point(0.25, 0.5), false),
new mxConnectionConstraint(new Point(0.175, 0.75), false), new ConnectionConstraint(new Point(0.175, 0.75), false),
new mxConnectionConstraint(new Point(1, 0.5), false), new ConnectionConstraint(new Point(1, 0.5), false),
new mxConnectionConstraint(new Point(0.7, 0.1), false), new ConnectionConstraint(new Point(0.7, 0.1), false),
new mxConnectionConstraint(new Point(0.7, 0.9), false)]; new ConnectionConstraint(new Point(0.7, 0.9), false)];
RequiredInterfaceShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), RequiredInterfaceShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(1, 0.5), false)]; new ConnectionConstraint(new Point(1, 0.5), false)];
ProvidedRequiredInterfaceShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), ProvidedRequiredInterfaceShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false),
new mxConnectionConstraint(new Point(1, 0.5), false)]; new ConnectionConstraint(new Point(1, 0.5), false)];
})(); })();

4
docs/stashed/grapheditor/www/js/Sidebar.js
View File

@ -582,7 +582,7 @@ Sidebar.prototype.searchEntries = function(searchTerms, count, page, success, er
if (this.taglist != null && searchTerms != null) if (this.taglist != null && searchTerms != null)
{ {
let tmp = searchTerms.toLowerCase().split(' '); let tmp = searchTerms.toLowerCase().split(' ');
let dict = new mxDictionary(); let dict = new Dictionary();
let max = (page + 1) * count; let max = (page + 1) * count;
let results = []; let results = [];
let index = 0; let index = 0;
@ -592,7 +592,7 @@ Sidebar.prototype.searchEntries = function(searchTerms, count, page, success, er
if (tmp[i].length > 0) if (tmp[i].length > 0)
{ {
let entry = this.taglist[tmp[i]]; let entry = this.taglist[tmp[i]];
let tmpDict = new mxDictionary(); let tmpDict = new Dictionary();
if (entry != null) if (entry != null)
{ {

4
packages/core/src/editor/mxEditor.js
View File

@ -34,7 +34,7 @@ import {
import graph from '../view/Graph'; import graph from '../view/Graph';
import SwimlaneManager from '../view/layout/SwimlaneManager'; import SwimlaneManager from '../view/layout/SwimlaneManager';
import LayoutManager from '../view/layout/LayoutManager'; import LayoutManager from '../view/layout/LayoutManager';
import mxRubberband from '../view/selection/mxRubberband'; import RubberBand from '../view/selection/RubberBand';
import InternalEvent from '../view/event/InternalEvent'; import InternalEvent from '../view/event/InternalEvent';
import RootChange from '../view/model/RootChange'; import RootChange from '../view/model/RootChange';
import ValueChange from '../view/cell/ValueChange'; import ValueChange from '../view/cell/ValueChange';
@ -1584,7 +1584,7 @@ class mxEditor extends EventSource {
// Install rubberband selection as the last // Install rubberband selection as the last
// action handler in the chain // action handler in the chain
this.rubberband = new mxRubberband(this.graph); this.rubberband = new RubberBand(this.graph);
// Disables the context menu // Disables the context menu
if (this.disableContextMenu) { if (this.disableContextMenu) {

40
packages/core/src/index.ts
View File

@ -20,20 +20,20 @@ import mxEditor from './editor/mxEditor';
import mxCellHighlight from './view/selection/mxCellHighlight'; import mxCellHighlight from './view/selection/mxCellHighlight';
import CellMarker from './view/cell/CellMarker'; import CellMarker from './view/cell/CellMarker';
import mxCellTracker from './view/event/mxCellTracker'; import mxCellTracker from './view/event/mxCellTracker';
import mxConnectionHandler from './view/connection/mxConnectionHandler'; import ConnectionHandler from './view/connection/ConnectionHandler';
import mxConstraintHandler from './view/connection/mxConstraintHandler'; import ConstraintHandler from './view/connection/ConstraintHandler';
import mxEdgeHandler from './view/cell/edge/mxEdgeHandler'; import EdgeHandler from './view/cell/edge/EdgeHandler';
import mxEdgeSegmentHandler from './view/cell/edge/mxEdgeSegmentHandler'; import EdgeSegmentHandler from './view/cell/edge/EdgeSegmentHandler';
import mxElbowEdgeHandler from './view/cell/edge/mxElbowEdgeHandler'; import ElbowEdgeHandler from './view/cell/edge/ElbowEdgeHandler';
import GraphHandler from './view/GraphHandler'; import GraphHandler from './view/GraphHandler';
import mxHandle from './view/cell/edge/mxHandle'; import VertexHandle from './view/cell/vertex/VertexHandle';
import mxKeyHandler from './view/event/mxKeyHandler'; import mxKeyHandler from './view/event/mxKeyHandler';
import PanningHandler from './view/panning/PanningHandler'; import PanningHandler from './view/panning/PanningHandler';
import PopupMenuHandler from './view/popups_menus/PopupMenuHandler'; import PopupMenuHandler from './view/popups_menus/PopupMenuHandler';
import mxRubberband from './view/selection/mxRubberband'; import RubberBand from './view/selection/RubberBand';
import mxSelectionCellsHandler from './view/selection/mxSelectionCellsHandler'; import mxSelectionCellsHandler from './view/selection/mxSelectionCellsHandler';
import TooltipHandler from './view/tooltip/TooltipHandler'; import TooltipHandler from './view/tooltip/TooltipHandler';
import mxVertexHandler from './view/cell/vertex/mxVertexHandler'; import VertexHandler from './view/cell/vertex/VertexHandler';
import mxCircleLayout from './view/layout/layout/mxCircleLayout'; import mxCircleLayout from './view/layout/layout/mxCircleLayout';
import mxCompactTreeLayout from './view/layout/layout/mxCompactTreeLayout'; import mxCompactTreeLayout from './view/layout/layout/mxCompactTreeLayout';
@ -123,7 +123,7 @@ import mxAbstractCanvas2D from './util/canvas/mxAbstractCanvas2D';
import mxSvgCanvas2D from './util/canvas/mxSvgCanvas2D'; import mxSvgCanvas2D from './util/canvas/mxSvgCanvas2D';
import mxXmlCanvas2D from './util/canvas/mxXmlCanvas2D'; import mxXmlCanvas2D from './util/canvas/mxXmlCanvas2D';
import mxDictionary from './util/mxDictionary'; import Dictionary from './util/Dictionary';
import Geometry from './view/geometry/Geometry'; import Geometry from './view/geometry/Geometry';
import mxObjectIdentity from './util/mxObjectIdentity'; import mxObjectIdentity from './util/mxObjectIdentity';
import Point from './view/geometry/Point'; import Point from './view/geometry/Point';
@ -173,7 +173,7 @@ import CellState from './view/cell/datatypes/CellState';
import CellStatePreview from './view/cell/CellStatePreview'; import CellStatePreview from './view/cell/CellStatePreview';
import TemporaryCellStates from './view/cell/TemporaryCellStates'; import TemporaryCellStates from './view/cell/TemporaryCellStates';
import mxConnectionConstraint from './view/connection/mxConnectionConstraint'; import ConnectionConstraint from './view/connection/ConnectionConstraint';
import Multiplicity from './view/validation/Multiplicity'; import Multiplicity from './view/validation/Multiplicity';
import graph from './view/Graph'; import graph from './view/Graph';
@ -191,7 +191,7 @@ export default {
mxClient, mxClient,
mxLog, mxLog,
mxObjectIdentity, mxObjectIdentity,
mxDictionary, mxDictionary: Dictionary,
mxResources: Resources, mxResources: Resources,
mxPoint: Point, mxPoint: Point,
mxRectangle: Rectangle, mxRectangle: Rectangle,
@ -290,20 +290,20 @@ export default {
mxSwimlaneManager: SwimlaneManager, mxSwimlaneManager: SwimlaneManager,
mxTemporaryCellStates: TemporaryCellStates, mxTemporaryCellStates: TemporaryCellStates,
mxCellStatePreview: CellStatePreview, mxCellStatePreview: CellStatePreview,
mxConnectionConstraint, mxConnectionConstraint: ConnectionConstraint,
mxGraphHandler: GraphHandler, mxGraphHandler: GraphHandler,
mxPanningHandler: PanningHandler, mxPanningHandler: PanningHandler,
mxPopupMenuHandler: PopupMenuHandler, mxPopupMenuHandler: PopupMenuHandler,
mxCellMarker: CellMarker, mxCellMarker: CellMarker,
mxSelectionCellsHandler, mxSelectionCellsHandler,
mxConnectionHandler, mxConnectionHandler: ConnectionHandler,
mxConstraintHandler, mxConstraintHandler: ConstraintHandler,
mxRubberband, mxRubberband: RubberBand,
mxHandle, mxHandle: VertexHandle,
mxVertexHandler, mxVertexHandler: VertexHandler,
mxEdgeHandler, mxEdgeHandler: EdgeHandler,
mxElbowEdgeHandler, mxElbowEdgeHandler: ElbowEdgeHandler,
mxEdgeSegmentHandler, mxEdgeSegmentHandler: EdgeSegmentHandler,
mxKeyHandler, mxKeyHandler,
mxTooltipHandler: TooltipHandler, mxTooltipHandler: TooltipHandler,
mxCellTracker, mxCellTracker,

10
packages/core/src/util/mxDictionary.ts → packages/core/src/util/Dictionary.ts
View File

@ -7,9 +7,9 @@
import mxObjectIdentity from './mxObjectIdentity'; import mxObjectIdentity from './mxObjectIdentity';
type Dictionary<T, U> = { //type Dictionary<T, U> = {
[key: string]: U; // [key: string]: U;
}; //};
type Visitor<T, U> = (key: string, value: U) => void; type Visitor<T, U> = (key: string, value: U) => void;
@ -23,7 +23,7 @@ type Visitor<T, U> = (key: string, value: U) => void;
* *
* Constructs a new dictionary which allows object to be used as keys. * Constructs a new dictionary which allows object to be used as keys.
*/ */
class mxDictionary<T, U> { class Dictionary<T, U> {
constructor() { constructor() {
this.clear(); this.clear();
} }
@ -131,4 +131,4 @@ class mxDictionary<T, U> {
} }
} }
export default mxDictionary; export default Dictionary;

6
packages/core/src/util/Utils.ts
View File

@ -31,7 +31,7 @@ import {
PAGE_FORMAT_A4_PORTRAIT, PAGE_FORMAT_A4_PORTRAIT,
} from './Constants'; } from './Constants';
import Point from '../view/geometry/Point'; import Point from '../view/geometry/Point';
import mxDictionary from './mxDictionary'; import Dictionary from './Dictionary';
import CellPath from '../view/cell/datatypes/CellPath'; import CellPath from '../view/cell/datatypes/CellPath';
import Rectangle from '../view/geometry/Rectangle'; import Rectangle from '../view/geometry/Rectangle';
import { getFunctionName } from './StringUtils'; import { getFunctionName } from './StringUtils';
@ -473,7 +473,7 @@ export const equalEntries = (a: Properties | null, b: Properties | null) => {
* Removes all duplicates from the given array. * Removes all duplicates from the given array.
*/ */
export const removeDuplicates = (arr: any) => { export const removeDuplicates = (arr: any) => {
const dict = new mxDictionary(); const dict = new Dictionary();
const result = []; const result = [];
for (let i = 0; i < arr.length; i += 1) { for (let i = 0; i < arr.length; i += 1) {
@ -1626,7 +1626,7 @@ export const createImage = (src: string) => {
* Ascending is optional and defaults to true. * Ascending is optional and defaults to true.
*/ */
export const sortCells = (cells: CellArray, ascending = true): CellArray => { export const sortCells = (cells: CellArray, ascending = true): CellArray => {
const lookup = new mxDictionary<Cell, string[]>(); const lookup = new Dictionary<Cell, string[]>();
cells.sort((o1, o2) => { cells.sort((o1, o2) => {
let p1 = lookup.get(o1); let p1 = lookup.get(o1);

46
packages/core/src/view/Graph.ts
View File

@ -13,7 +13,7 @@ import Rectangle from './geometry/Rectangle';
import TooltipHandler from './tooltip/TooltipHandler'; import TooltipHandler from './tooltip/TooltipHandler';
import mxClient from '../mxClient'; import mxClient from '../mxClient';
import mxSelectionCellsHandler from './selection/mxSelectionCellsHandler'; import mxSelectionCellsHandler from './selection/mxSelectionCellsHandler';
import mxConnectionHandler from './connection/mxConnectionHandler'; import ConnectionHandler from './connection/ConnectionHandler';
import GraphHandler from './GraphHandler'; import GraphHandler from './GraphHandler';
import PanningHandler from './panning/PanningHandler'; import PanningHandler from './panning/PanningHandler';
import PopupMenuHandler from './popups_menus/PopupMenuHandler'; import PopupMenuHandler from './popups_menus/PopupMenuHandler';
@ -44,22 +44,22 @@ import CellState from './cell/datatypes/CellState';
import { isNode } from '../util/DomUtils'; import { isNode } from '../util/DomUtils';
import CellArray from "./cell/datatypes/CellArray"; import CellArray from "./cell/datatypes/CellArray";
import EdgeStyle from "./style/EdgeStyle"; import EdgeStyle from "./style/EdgeStyle";
import mxEdgeHandler from "./cell/edge/mxEdgeHandler"; import EdgeHandler from "./cell/edge/EdgeHandler";
import mxVertexHandler from "./cell/vertex/mxVertexHandler"; import VertexHandler from "./cell/vertex/VertexHandler";
import mxEdgeSegmentHandler from "./cell/edge/mxEdgeSegmentHandler"; import EdgeSegmentHandler from "./cell/edge/EdgeSegmentHandler";
import mxElbowEdgeHandler from "./cell/edge/mxElbowEdgeHandler"; import ElbowEdgeHandler from "./cell/edge/ElbowEdgeHandler";
/** /**
* Extends {@link EventSource} to implement a graph component for * Extends {@link EventSource} to implement a graph component for
* the browser. This is the main class of the package. To activate * the browser. This is the main class of the package. To activate
* panning and connections use {@link setPanning} and {@link setConnectable}. * panning and connections use {@link setPanning} and {@link setConnectable}.
* For rubberband selection you must create a new instance of * For rubberband selection you must create a new instance of
* {@link mxRubberband}. The following listeners are added to * {@link rubberband}. The following listeners are added to
* {@link mouseListeners} by default: * {@link mouseListeners} by default:
* *
* - tooltipHandler: {@link TooltipHandler} that displays tooltips * - tooltipHandler: {@link TooltipHandler} that displays tooltips
* - panningHandler: {@link PanningHandler} for panning and popup menus * - panningHandler: {@link PanningHandler} for panning and popup menus
* - connectionHandler: {@link mxConnectionHandler} for creating connections * - connectionHandler: {@link ConnectionHandler} for creating connections
* - graphHandler: {@link GraphHandler} for moving and cloning cells * - graphHandler: {@link GraphHandler} for moving and cloning cells
* *
* These listeners will be called in the above order if they are enabled. * These listeners will be called in the above order if they are enabled.
@ -143,7 +143,7 @@ class Graph extends EventSource {
tooltipHandler: TooltipHandler | null = null; tooltipHandler: TooltipHandler | null = null;
selectionCellsHandler: mxSelectionCellsHandler | null = null; selectionCellsHandler: mxSelectionCellsHandler | null = null;
popupMenuHandler: PopupMenuHandler | null = null; popupMenuHandler: PopupMenuHandler | null = null;
connectionHandler: mxConnectionHandler | null = null; connectionHandler: ConnectionHandler | null = null;
graphHandler: GraphHandler | null = null; graphHandler: GraphHandler | null = null;
graphModelChangeListener: Function | null = null; graphModelChangeListener: Function | null = null;
paintBackground: Function | null = null; paintBackground: Function | null = null;
@ -526,10 +526,10 @@ class Graph extends EventSource {
} }
/** /**
* Creates and returns a new {@link mxConnectionHandler} to be used in this graph. * Creates and returns a new {@link ConnectionHandler} to be used in this graph.
*/ */
createConnectionHandler(): mxConnectionHandler { createConnectionHandler(): ConnectionHandler {
return new mxConnectionHandler(this); return new ConnectionHandler(this);
} }
/** /**
@ -1028,15 +1028,15 @@ class Graph extends EventSource {
/** /**
* Creates a new handler for the given cell state. This implementation * Creates a new handler for the given cell state. This implementation
* returns a new {@link mxEdgeHandler} of the corresponding cell is an edge, * returns a new {@link EdgeHandler} of the corresponding cell is an edge,
* otherwise it returns an {@link mxVertexHandler}. * otherwise it returns an {@link VertexHandler}.
* *
* @param state {@link mxCellState} whose handler should be created. * @param state {@link mxCellState} whose handler should be created.
*/ */
createHandler( createHandler(
state: CellState state: CellState
): mxEdgeHandler | mxVertexHandler | null { ): mxEdgeHandler | VertexHandler | null {
let result: mxEdgeHandler | mxVertexHandler | null = null; let result: mxEdgeHandler | VertexHandler | null = null;
if (state.cell.isEdge()) { if (state.cell.isEdge()) {
const source = state.getVisibleTerminalState(true); const source = state.getVisibleTerminalState(true);
@ -1057,16 +1057,16 @@ class Graph extends EventSource {
} }
/** /**
* Hooks to create a new {@link mxVertexHandler} for the given {@link CellState}. * Hooks to create a new {@link VertexHandler} for the given {@link CellState}.
* *
* @param state {@link mxCellState} to create the handler for. * @param state {@link mxCellState} to create the handler for.
*/ */
createVertexHandler(state: CellState): mxVertexHandler { createVertexHandler(state: CellState): VertexHandler {
return new mxVertexHandler(state); return new VertexHandler(state);
} }
/** /**
* Hooks to create a new {@link mxEdgeHandler} for the given {@link CellState}. * Hooks to create a new {@link EdgeHandler} for the given {@link CellState}.
* *
* @param state {@link mxCellState} to create the handler for. * @param state {@link mxCellState} to create the handler for.
*/ */
@ -1091,7 +1091,7 @@ class Graph extends EventSource {
} }
/** /**
* Hooks to create a new {@link mxEdgeSegmentHandler} for the given {@link CellState}. * Hooks to create a new {@link EdgeSegmentHandler} for the given {@link CellState}.
* *
* @param state {@link mxCellState} to create the handler for. * @param state {@link mxCellState} to create the handler for.
*/ */
@ -1100,12 +1100,12 @@ class Graph extends EventSource {
} }
/** /**
* Hooks to create a new {@link mxElbowEdgeHandler} for the given {@link CellState}. * Hooks to create a new {@link ElbowEdgeHandler} for the given {@link CellState}.
* *
* @param state {@link mxCellState} to create the handler for. * @param state {@link mxCellState} to create the handler for.
*/ */
createElbowEdgeHandler(state: CellState): mxElbowEdgeHandler { createElbowEdgeHandler(state: CellState): ElbowEdgeHandler {
return new mxElbowEdgeHandler(state); return new ElbowEdgeHandler(state);
} }
/***************************************************************************** /*****************************************************************************

8
packages/core/src/view/GraphHandler.js
View File

@ -20,7 +20,7 @@ import {
INVALID_CONNECT_TARGET_COLOR, INVALID_CONNECT_TARGET_COLOR,
VALID_COLOR, VALID_COLOR,
} from '../util/Constants'; } from '../util/Constants';
import mxDictionary from '../util/mxDictionary'; import Dictionary from '../util/Dictionary';
import mxCellHighlight from './selection/mxCellHighlight'; import mxCellHighlight from './selection/mxCellHighlight';
import Rectangle from './geometry/Rectangle'; import Rectangle from './geometry/Rectangle';
import { import {
@ -848,7 +848,7 @@ class GraphHandler {
this.cells = cells != null ? cells : this.getCells(this.cell); this.cells = cells != null ? cells : this.getCells(this.cell);
this.bounds = this.graph.getView().getBounds(this.cells); this.bounds = this.graph.getView().getBounds(this.cells);
this.pBounds = this.getPreviewBounds(this.cells); this.pBounds = this.getPreviewBounds(this.cells);
this.allCells = new mxDictionary(); this.allCells = new Dictionary();
this.cloning = false; this.cloning = false;
this.cellCount = 0; this.cellCount = 0;
@ -862,7 +862,7 @@ class GraphHandler {
const ignore = parent.getChildCount() < 2; const ignore = parent.getChildCount() < 2;
// Uses connected states as guides // Uses connected states as guides
const connected = new mxDictionary(); const connected = new Dictionary();
const opps = this.graph.getOpposites( const opps = this.graph.getOpposites(
this.graph.getEdges(this.cell), this.graph.getEdges(this.cell),
this.cell this.cell
@ -1759,7 +1759,7 @@ class GraphHandler {
// Removes parent if all child cells are removed // Removes parent if all child cells are removed
if (!clone && target != null && this.removeEmptyParents) { if (!clone && target != null && this.removeEmptyParents) {
// Collects all non-selected parents // Collects all non-selected parents
const dict = new mxDictionary(); const dict = new Dictionary();
for (let i = 0; i < cells.length; i += 1) { for (let i = 0; i < cells.length; i += 1) {
dict.put(cells[i], true); dict.put(cells[i], true);

9
packages/core/src/view/cell/CellMarker.ts
View File

@ -331,8 +331,7 @@ class CellMarker extends EventSource {
* *
* Hides the marker and fires a <mark> event. * Hides the marker and fires a <mark> event.
*/ */
// unmark(): void; unmark(): void {
unmark() {
this.mark(); this.mark();
} }
@ -387,8 +386,7 @@ class CellMarker extends EventSource {
* Returns the <mxCellState> to be marked for the given <mxCellState> under * Returns the <mxCellState> to be marked for the given <mxCellState> under
* the mouse. This returns the given state. * the mouse. This returns the given state.
*/ */
// getStateToMark(state: mxCellState): mxCellState; getStateToMark(state: CellState): CellState {
getStateToMark(state) {
return state; return state;
} }
@ -418,8 +416,7 @@ class CellMarker extends EventSource {
* *
* Destroys the handler and all its resources and DOM nodes. * Destroys the handler and all its resources and DOM nodes.
*/ */
// destroy(): void; destroy(): void {
destroy() {
this.graph.getView().removeListener(this.resetHandler); this.graph.getView().removeListener(this.resetHandler);
this.graph.getModel().removeListener(this.resetHandler); this.graph.getModel().removeListener(this.resetHandler);
this.highlight.destroy(); this.highlight.destroy();

8
packages/core/src/view/cell/CellRenderer.ts
View File

@ -53,7 +53,7 @@ import StencilRegistry from '../geometry/shape/node/StencilRegistry';
import InternalEvent from '../event/InternalEvent'; import InternalEvent from '../event/InternalEvent';
import mxClient from '../../mxClient'; import mxClient from '../../mxClient';
import InternalMouseEvent from '../event/InternalMouseEvent'; import InternalMouseEvent from '../event/InternalMouseEvent';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import EventObject from '../event/EventObject'; import EventObject from '../event/EventObject';
import Point from '../geometry/Point'; import Point from '../geometry/Point';
import Shape from '../geometry/shape/Shape'; import Shape from '../geometry/shape/Shape';
@ -565,7 +565,7 @@ class CellRenderer {
let dict = null; let dict = null;
if (overlays != null) { if (overlays != null) {
dict = new mxDictionary(); dict = new Dictionary();
for (let i = 0; i < overlays.length; i += 1) { for (let i = 0; i < overlays.length; i += 1) {
const shape = const shape =
@ -637,7 +637,7 @@ class CellRenderer {
} }
overlay.fireEvent( overlay.fireEvent(
new EventObject(InternalEvent.CLICK, 'event', evt, 'cell', state.cell) new EventObject(InternalEvent.CLICK, {event: evt, cell: state.cell})
); );
}); });
@ -654,7 +654,7 @@ class CellRenderer {
if (mxClient.IS_TOUCH) { if (mxClient.IS_TOUCH) {
InternalEvent.addListener(shape.node, 'touchend', (evt: Event) => { InternalEvent.addListener(shape.node, 'touchend', (evt: Event) => {
overlay.fireEvent( overlay.fireEvent(
new EventObject(InternalEvent.CLICK, 'event', evt, 'cell', state.cell) new EventObject(InternalEvent.CLICK, {event: evt, cell: state.cell})
); );
}); });
} }

108
packages/core/src/view/cell/CellStatePreview.ts
View File

@ -6,11 +6,11 @@
*/ */
import Point from '../geometry/Point'; import Point from '../geometry/Point';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import CellState from './datatypes/CellState'; import CellState from './datatypes/CellState';
import Cell from './datatypes/Cell'; import Cell from './datatypes/Cell';
import graph from '../Graph'; import graph from '../Graph';
import GraphView from "../view/GraphView"; import GraphView from '../view/GraphView';
/** /**
* *
@ -20,32 +20,28 @@ import GraphView from "../view/GraphView";
*/ */
class CellStatePreview { class CellStatePreview {
constructor(graph: graph) { constructor(graph: graph) {
this.deltas = new mxDictionary(); this.deltas = new Dictionary();
this.graph = graph; this.graph = graph;
} }
/** /**
* Reference to the enclosing <mxGraph>. * Reference to the enclosing <mxGraph>.
*/ */
// graph: mxGraph;
graph: graph; graph: graph;
/** /**
* Reference to the enclosing <mxGraph>. * Reference to the enclosing <mxGraph>.
*/ */
// deltas: mxDictionary; deltas: Dictionary<Cell, {point: Point, state: CellState }>;
deltas: mxDictionary;
/** /**
* Contains the number of entries in the map. * Contains the number of entries in the map.
*/ */
// count: number;
count: number = 0; count: number = 0;
/** /**
* Returns true if this contains no entries. * Returns true if this contains no entries.
*/ */
// isEmpty(): boolean;
isEmpty(): boolean { isEmpty(): boolean {
return this.count === 0; return this.count === 0;
} }
@ -61,7 +57,6 @@ class CellStatePreview {
* @return {*} {mxPoint} * @return {*} {mxPoint}
* @memberof mxCellStatePreview * @memberof mxCellStatePreview
*/ */
// moveState(state: mxCellState, dx: number, dy: number, add: boolean, includeEdges: boolean): mxPoint;
moveState( moveState(
state: CellState, state: CellState,
dx: number, dx: number,
@ -96,19 +91,13 @@ class CellStatePreview {
* @param {Function} visitor * @param {Function} visitor
* @memberof mxCellStatePreview * @memberof mxCellStatePreview
*/ */
// show(visitor: Function): void; show(visitor: Function | null = null): void {
show(visitor: Function | null = null) {
this.deltas.visit((key: string, delta: any) => { this.deltas.visit((key: string, delta: any) => {
this.translateState(delta.state, delta.point.x, delta.point.y); this.translateState(delta.state, delta.point.x, delta.point.y);
}); });
this.deltas.visit((key: string, delta: any) => { this.deltas.visit((key: string, delta: any) => {
this.revalidateState( this.revalidateState(delta.state, delta.point.x, delta.point.y, visitor);
delta.state,
delta.point.x,
delta.point.y,
visitor
);
}); });
} }
@ -120,13 +109,10 @@ class CellStatePreview {
* @param {number} dy * @param {number} dy
* @memberof mxCellStatePreview * @memberof mxCellStatePreview
*/ */
// translateState(state: mxCellState, dx: number, dy: number): void; translateState(state: CellState, dx: number, dy: number): void {
translateState(state: CellState, dx: number, dy: number) {
if (state != null) { if (state != null) {
const model = this.graph.getModel();
if (state.cell.isVertex()) { if (state.cell.isVertex()) {
(<mxGraphView>state.view).updateCellState(state); (<GraphView>state.view).updateCellState(state);
const geo = state.cell.getGeometry(); const geo = state.cell.getGeometry();
// Moves selection cells and non-relative vertices in // Moves selection cells and non-relative vertices in
@ -142,14 +128,8 @@ class CellStatePreview {
} }
} }
const childCount = state.cell.getChildCount(); for (const child of state.cell.getChildren()) {
this.translateState(<CellState>state.view.getState(child), dx, dy);
for (let i = 0; i < childCount; i += 1) {
this.translateState(
<CellState>(state.view).getState(state.cell.getChildAt(i)),
dx,
dy
);
} }
} }
} }
@ -163,56 +143,42 @@ class CellStatePreview {
* @param {Function} visitor * @param {Function} visitor
* @memberof mxCellStatePreview * @memberof mxCellStatePreview
*/ */
// revalidateState(state: mxCellState, dx: number, dy: number, visitor: Function): void;
revalidateState( revalidateState(
state: CellState | null = null, state: CellState,
dx: number, dx: number,
dy: number, dy: number,
visitor: Function | null = null visitor: Function | null = null
): void { ): void {
if (state != null) { // Updates the edge terminal points and restores the
const model = this.graph.getModel(); // (relative) positions of any (relative) children
if (state.cell.isEdge()) {
state.view.updateCellState(state);
}
// Updates the edge terminal points and restores the const geo = (<Cell>state.cell).getGeometry();
// (relative) positions of any (relative) children const pState = state.view.getState(<Cell>state.cell.getParent());
if (state.cell.isEdge()) {
state.view.updateCellState(state);
}
const geo = (<Cell>state.cell).getGeometry(); // Moves selection vertices which are relative
const pState = state.view.getState(<Cell>state.cell.getParent()); if (
(dx !== 0 || dy !== 0) &&
geo != null &&
geo.relative &&
state.cell.isVertex() &&
(pState == null || pState.cell.isVertex() || this.deltas.get(state.cell) != null)
) {
state.x += dx;
state.y += dy;
}
// Moves selection vertices which are relative this.graph.cellRenderer.redraw(state);
if (
(dx !== 0 || dy !== 0) &&
geo != null &&
geo.relative &&
state.cell.isVertex() &&
(pState == null ||
pState.cell.isVertex() ||
this.deltas.get(state.cell) != null)
) {
state.x += dx;
state.y += dy;
}
this.graph.cellRenderer.redraw(state); // Invokes the visitor on the given state
if (visitor != null) {
visitor(state);
}
// Invokes the visitor on the given state for (const child of state.cell.getChildren()) {
if (visitor != null) { this.revalidateState(<CellState>this.graph.view.getState(child), dx, dy, visitor);
visitor(state);
}
const childCount = state.cell.getChildCount();
for (let i = 0; i < childCount; i += 1) {
this.revalidateState(
this.graph.view.getState(state.cell.getChildAt(i)),
dx,
dy,
visitor
);
}
} }
} }
@ -222,9 +188,7 @@ class CellStatePreview {
* @param {CellState} state * @param {CellState} state
* @memberof mxCellStatePreview * @memberof mxCellStatePreview
*/ */
// addEdges(state: mxCellState): void;
addEdges(state: CellState): void { addEdges(state: CellState): void {
const model = this.graph.getModel();
const edgeCount = state.cell.getEdgeCount(); const edgeCount = state.cell.getEdgeCount();
for (let i = 0; i < edgeCount; i += 1) { for (let i = 0; i < edgeCount; i += 1) {

14
packages/core/src/view/cell/GraphCells.ts
View File

@ -35,7 +35,7 @@ import EventObject from '../event/EventObject';
import InternalEvent from '../event/InternalEvent'; import InternalEvent from '../event/InternalEvent';
import ImageBundle from '../image/ImageBundle'; import ImageBundle from '../image/ImageBundle';
import Rectangle from '../geometry/Rectangle'; import Rectangle from '../geometry/Rectangle';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import Point from '../geometry/Point'; import Point from '../geometry/Point';
import Label from '../geometry/shape/Label'; import Label from '../geometry/shape/Label';
import { htmlEntities } from '../../util/StringUtils'; import { htmlEntities } from '../../util/StringUtils';
@ -541,7 +541,7 @@ class GraphCells {
let clones; let clones;
// Creates a dictionary for fast lookups // Creates a dictionary for fast lookups
const dict = new mxDictionary(); const dict = new Dictionary();
const tmp = []; const tmp = [];
for (const cell of cells) { for (const cell of cells) {
@ -733,7 +733,7 @@ class GraphCells {
const o1 = parentState != null ? parentState.origin : null; const o1 = parentState != null ? parentState.origin : null;
const zero = new Point(0, 0); const zero = new Point(0, 0);
for (const cell of cells) { cells.forEach((cell, i) => {
if (cell == null) { if (cell == null) {
index--; index--;
} else { } else {
@ -803,7 +803,7 @@ class GraphCells {
this.cellConnected(cell, target, false); this.cellConnected(cell, target, false);
} }
} }
} });
this.graph.fireEvent( this.graph.fireEvent(
new EventObject(InternalEvent.CELLS_ADDED, { new EventObject(InternalEvent.CELLS_ADDED, {
@ -869,7 +869,7 @@ class GraphCells {
// Removes edges that are currently not // Removes edges that are currently not
// visible as those cannot be updated // visible as those cannot be updated
const edges = <CellArray>this.getDeletableCells(this.graph.edge.getAllEdges(cells)); const edges = <CellArray>this.getDeletableCells(this.graph.edge.getAllEdges(cells));
const dict = new mxDictionary(); const dict = new Dictionary();
for (const cell of cells) { for (const cell of cells) {
dict.put(cell, true); dict.put(cell, true);
@ -906,7 +906,7 @@ class GraphCells {
this.graph.batchUpdate(() => { this.graph.batchUpdate(() => {
// Creates hashtable for faster lookup // Creates hashtable for faster lookup
const dict = new mxDictionary(); const dict = new Dictionary();
for (const cell of cells) { for (const cell of cells) {
dict.put(cell, true); dict.put(cell, true);
@ -1601,7 +1601,7 @@ class GraphCells {
this.graph.batchUpdate(() => { this.graph.batchUpdate(() => {
// Faster cell lookups to remove relative edge labels with selected // Faster cell lookups to remove relative edge labels with selected
// terminals to avoid explicit and implicit move at same time // terminals to avoid explicit and implicit move at same time
const dict = new mxDictionary(); const dict = new Dictionary();
for (const cell of cells) { for (const cell of cells) {
dict.put(cell, true); dict.put(cell, true);

9
packages/core/src/view/cell/TemporaryCellStates.ts
View File

@ -9,7 +9,7 @@
*/ */
import Rectangle from '../geometry/Rectangle'; import Rectangle from '../geometry/Rectangle';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import GraphView from '../view/GraphView'; import GraphView from '../view/GraphView';
import Cell from './datatypes/Cell'; import Cell from './datatypes/Cell';
import CellState from './datatypes/CellState'; import CellState from './datatypes/CellState';
@ -98,14 +98,14 @@ class TemporaryCellStates {
* @default 0 * @default 0
*/ */
// view: number; // view: number;
view: mxGraphView | null = null; view: GraphView | null = null;
/** /**
* Holds the height of the rectangle. * Holds the height of the rectangle.
* @default 0 * @default 0
*/ */
// oldStates: number; // oldStates: number;
oldStates: mxDictionary | null = null; oldStates: Dictionary | null = null;
/** /**
* Holds the height of the rectangle. * Holds the height of the rectangle.
@ -118,7 +118,6 @@ class TemporaryCellStates {
* Holds the height of the rectangle. * Holds the height of the rectangle.
* @default 0 * @default 0
*/ */
// oldScale: number;
oldScale: number = 0; oldScale: number = 0;
/** /**
@ -127,7 +126,7 @@ class TemporaryCellStates {
*/ */
// destroy(): void; // destroy(): void;
destroy(): void { destroy(): void {
const view = <mxGraphView>this.view; const view = <GraphView>this.view;
view.setScale(this.oldScale); view.setScale(this.oldScale);
view.setStates(this.oldStates); view.setStates(this.oldStates);
view.setGraphBounds(<Rectangle>this.oldBounds); view.setGraphBounds(<Rectangle>this.oldBounds);

12
packages/core/src/view/cell/TreeTraversal.ts
View File

@ -1,9 +1,11 @@
import Cell from "./datatypes/Cell"; import Cell from "./datatypes/Cell";
import CellArray from "./datatypes/CellArray"; import CellArray from "./datatypes/CellArray";
import mxDictionary from "../../util/mxDictionary"; import Dictionary from "../../util/Dictionary";
import Graph from "../Graph"; import Graph from "../Graph";
class TreeTraversal { class TreeTraversal {
dependencies = ['connections'];
constructor(graph: Graph) { constructor(graph: Graph) {
this.graph = graph; this.graph = graph;
} }
@ -40,12 +42,12 @@ class TreeTraversal {
for (const cell of parent.getChildren()) { for (const cell of parent.getChildren()) {
if (cell.isVertex() && cell.isVisible()) { if (cell.isVertex() && cell.isVisible()) {
const conns = this.getConnections(cell, isolate ? parent : null); const conns = this.graph.connection.getConnections(cell, isolate ? parent : null);
let fanOut = 0; let fanOut = 0;
let fanIn = 0; let fanIn = 0;
for (let j = 0; j < conns.length; j++) { for (let j = 0; j < conns.length; j++) {
const src = this.getView().getVisibleTerminal(conns[j], true); const src = this.graph.view.getVisibleTerminal(conns[j], true);
if (src == cell) { if (src == cell) {
fanOut++; fanOut++;
@ -115,13 +117,13 @@ class TreeTraversal {
directed: boolean = true, directed: boolean = true,
func: Function | null = null, func: Function | null = null,
edge: Cell | null = null, edge: Cell | null = null,
visited: mxDictionary | null = null, visited: Dictionary | null = null,
inverse: boolean = false inverse: boolean = false
): void { ): void {
if (func != null && vertex != null) { if (func != null && vertex != null) {
directed = directed != null ? directed : true; directed = directed != null ? directed : true;
inverse = inverse != null ? inverse : false; inverse = inverse != null ? inverse : false;
visited = visited || new mxDictionary(); visited = visited || new Dictionary();
if (!visited.get(vertex)) { if (!visited.get(vertex)) {
visited.put(vertex, true); visited.put(vertex, true);

6
packages/core/src/view/cell/datatypes/CellArray.ts
View File

@ -1,5 +1,5 @@
import Cell from "./Cell"; import Cell from "./Cell";
import mxDictionary from "../../../util/mxDictionary"; import Dictionary from "../../../util/Dictionary";
import mxObjectIdentity from "../../../util/mxObjectIdentity"; import mxObjectIdentity from "../../../util/mxObjectIdentity";
class CellArray extends Array<Cell> { class CellArray extends Array<Cell> {
@ -102,7 +102,7 @@ class CellArray extends Array<Cell> {
* removed in the cells array to improve performance. * removed in the cells array to improve performance.
*/ */
getTopmostCells(): CellArray { getTopmostCells(): CellArray {
const dict = new mxDictionary(); const dict = new Dictionary();
const tmp = new CellArray(); const tmp = new CellArray();
for (let i = 0; i < this.length; i += 1) { for (let i = 0; i < this.length; i += 1) {
@ -135,7 +135,7 @@ class CellArray extends Array<Cell> {
*/ */
getParents(): Cell[] { getParents(): Cell[] {
const parents = []; const parents = [];
const dict = new mxDictionary(); const dict = new Dictionary();
for (const cell of this) { for (const cell of this) {
const parent = cell.getParent(); const parent = cell.getParent();

4
packages/core/src/view/cell/datatypes/CellState.ts
View File

@ -11,7 +11,7 @@ import Cell from './Cell';
import GraphView from '../../view/GraphView'; import GraphView from '../../view/GraphView';
import Shape from '../../geometry/shape/Shape'; import Shape from '../../geometry/shape/Shape';
import mxText from '../../geometry/shape/mxText'; import mxText from '../../geometry/shape/mxText';
import mxDictionary from '../../../util/mxDictionary'; import Dictionary from '../../../util/Dictionary';
import type { CellStateStyles } from '../../../types'; import type { CellStateStyles } from '../../../types';
import Image from "../../image/Image"; import Image from "../../image/Image";
@ -69,7 +69,7 @@ class CellState extends Rectangle {
control: Shape | null = null; control: Shape | null = null;
// Used by mxCellRenderer's createCellOverlays() // Used by mxCellRenderer's createCellOverlays()
overlays: mxDictionary<Cell, Shape> | null = null; overlays: Dictionary<Cell, Shape> | null = null;
/** /**
* Variable: view * Variable: view

36
packages/core/src/view/cell/edge/mxEdgeHandler.js → packages/core/src/view/cell/edge/EdgeHandler.ts
View File

@ -34,9 +34,9 @@ import {
import utils from '../../../util/Utils'; import utils from '../../../util/Utils';
import ImageShape from '../../geometry/shape/node/ImageShape'; import ImageShape from '../../geometry/shape/node/ImageShape';
import RectangleShape from '../../geometry/shape/node/RectangleShape'; import RectangleShape from '../../geometry/shape/node/RectangleShape';
import mxConnectionConstraint from '../../connection/mxConnectionConstraint'; import ConnectionConstraint from '../../connection/ConnectionConstraint';
import InternalEvent from '../../event/InternalEvent'; import InternalEvent from '../../event/InternalEvent';
import mxConstraintHandler from '../../connection/mxConstraintHandler'; import ConstraintHandler from '../../connection/ConstraintHandler';
import Rectangle from '../../geometry/Rectangle'; import Rectangle from '../../geometry/Rectangle';
import mxClient from '../../../mxClient'; import mxClient from '../../../mxClient';
import EdgeStyle from '../../style/EdgeStyle'; import EdgeStyle from '../../style/EdgeStyle';
@ -47,6 +47,9 @@ import {
isMouseEvent, isMouseEvent,
isShiftDown, isShiftDown,
} from '../../../util/EventUtils'; } from '../../../util/EventUtils';
import Graph from '../../Graph';
import CellState from '../datatypes/CellState';
import Shape from '../../geometry/shape/Shape';
/** /**
* Graph event handler that reconnects edges and modifies control points and the edge * Graph event handler that reconnects edges and modifies control points and the edge
@ -60,9 +63,9 @@ import {
* mxEdgeHandler.prototype.removeEnabled = true; * mxEdgeHandler.prototype.removeEnabled = true;
* ``` * ```
* Note: This experimental feature is not recommended for production use. * Note: This experimental feature is not recommended for production use.
* @class mxEdgeHandler * @class EdgeHandler
*/ */
class mxEdgeHandler { class EdgeHandler {
constructor(state) { constructor(state) {
if (state != null && state.shape != null) { if (state != null && state.shape != null) {
this.state = state; this.state = state;
@ -91,16 +94,14 @@ class mxEdgeHandler {
* *
* Reference to the enclosing <mxGraph>. * Reference to the enclosing <mxGraph>.
*/ */
// graph: mxGraph; graph: Graph;
graph = null;
/** /**
* Variable: state * Variable: state
* *
* Reference to the <mxCellState> being modified. * Reference to the <mxCellState> being modified.
*/ */
// state: mxCellState; state: CellState = null;
state = null;
/** /**
* Variable: marker * Variable: marker
@ -116,24 +117,21 @@ class mxEdgeHandler {
* Holds the <mxConstraintHandler> used for drawing and highlighting * Holds the <mxConstraintHandler> used for drawing and highlighting
* constraints. * constraints.
*/ */
// constraintHandler: mxConstraintHandler; constraintHandler: ConstraintHandler = null;
constraintHandler = null;
/** /**
* Variable: error * Variable: error
* *
* Holds the current validation error while a connection is being changed. * Holds the current validation error while a connection is being changed.
*/ */
// error: string; error: string = null;
error = null;
/** /**
* Variable: shape * Variable: shape
* *
* Holds the <mxShape> that represents the preview edge. * Holds the <mxShape> that represents the preview edge.
*/ */
// shape: mxShape; shape: Shape = null;
shape = null;
/** /**
* Variable: bends * Variable: bends
@ -373,7 +371,7 @@ class mxEdgeHandler {
init() { init() {
this.graph = this.state.view.graph; this.graph = this.state.view.graph;
this.marker = this.createMarker(); this.marker = this.createMarker();
this.constraintHandler = new mxConstraintHandler(this.graph); this.constraintHandler = new ConstraintHandler(this.graph);
// Clones the original points from the cell // Clones the original points from the cell
// and makes sure at least one point exists // and makes sure at least one point exists
@ -1512,7 +1510,7 @@ class mxEdgeHandler {
this.constraintHandler.currentConstraint = constraint; this.constraintHandler.currentConstraint = constraint;
this.constraintHandler.currentPoint = point; this.constraintHandler.currentPoint = point;
} else { } else {
constraint = new mxConnectionConstraint(); constraint = new ConnectionConstraint();
} }
} }
@ -2040,7 +2038,7 @@ class mxEdgeHandler {
let constraint = this.constraintHandler.currentConstraint; let constraint = this.constraintHandler.currentConstraint;
if (constraint == null) { if (constraint == null) {
constraint = new mxConnectionConstraint(); constraint = new ConnectionConstraint();
} }
this.graph.connectCell(edge, terminal, isSource, constraint); this.graph.connectCell(edge, terminal, isSource, constraint);
@ -2080,7 +2078,7 @@ class mxEdgeHandler {
edge, edge,
null, null,
isSource, isSource,
new mxConnectionConstraint() new ConnectionConstraint()
); );
} }
} finally { } finally {
@ -2671,4 +2669,4 @@ class mxEdgeHandler {
} }
} }
export default mxEdgeHandler; export default EdgeHandler;

70
packages/core/src/view/cell/edge/mxEdgeSegmentHandler.js → packages/core/src/view/cell/edge/EdgeSegmentHandler.ts
View File

@ -7,22 +7,25 @@
import Point from '../../geometry/Point'; import Point from '../../geometry/Point';
import { CURSOR_TERMINAL_HANDLE } from '../../../util/Constants'; import { CURSOR_TERMINAL_HANDLE } from '../../../util/Constants';
import Rectangle from '../../geometry/Rectangle'; import Rectangle from '../../geometry/Rectangle';
import utils from '../../../util/Utils'; import utils, { contains, setOpacity } from '../../../util/Utils';
import mxElbowEdgeHandler from './mxElbowEdgeHandler'; import ElbowEdgeHandler from './ElbowEdgeHandler';
import CellState from '../datatypes/CellState';
import Cell from '../datatypes/Cell';
class mxEdgeSegmentHandler extends mxElbowEdgeHandler { class EdgeSegmentHandler extends ElbowEdgeHandler {
constructor(state) { constructor(state: CellState) {
// WARNING: should be super of mxEdgeHandler! // WARNING: should be super of mxEdgeHandler!
super(state); super(state);
} }
points: Point[] | null = null;
/** /**
* Function: getCurrentPoints * Function: getCurrentPoints
* *
* Returns the current absolute points. * Returns the current absolute points.
*/ */
// getCurrentPoints(): mxPoint[]; getCurrentPoints(): Point[] {
getCurrentPoints() {
let pts = this.state.absolutePoints; let pts = this.state.absolutePoints;
if (pts != null) { if (pts != null) {
@ -57,8 +60,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* *
* Updates the given preview state taking into account the state of the constraint handler. * Updates the given preview state taking into account the state of the constraint handler.
*/ */
// getPreviewPoints(point: mxPoint): mxPoint[]; getPreviewPoints(point: Point): Point[] {
getPreviewPoints(point) {
if (this.isSource || this.isTarget) { if (this.isSource || this.isTarget) {
return super.getPreviewPoints(point); return super.getPreviewPoints(point);
} }
@ -100,8 +102,8 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
const y = result[0].y * scale + tr.y; const y = result[0].y * scale + tr.y;
if ( if (
(source != null && utils.contains(source, x, y)) || (source != null && contains(source, x, y)) ||
(target != null && utils.contains(target, x, y)) (target != null && contains(target, x, y))
) { ) {
result = [point, point]; result = [point, point];
} }
@ -115,8 +117,11 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* *
* Overridden to perform optimization of the edge style result. * Overridden to perform optimization of the edge style result.
*/ */
// updatePreviewState(edge: mxCell, point: mxPoint, terminalState: mxCellState, me: mxMouseEvent): void; updatePreviewState(edge: Cell,
updatePreviewState(edge, point, terminalState, me) { point: Point,
terminalState: CellState,
me: MouseEvent): void {
super.updatePreviewState(edge, point, terminalState, me); super.updatePreviewState(edge, point, terminalState, me);
// Checks and corrects preview by running edge style again // Checks and corrects preview by running edge style again
@ -186,10 +191,10 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
let ye = view.getRoutingCenterY(target) / scale - tr.y; let ye = view.getRoutingCenterY(target) / scale - tr.y;
// Use fixed connection point y-coordinate if one exists // Use fixed connection point y-coordinate if one exists
const tc = this.graph.getConnectionConstraint(edge, target, false); const tc = this.graph.connection.getConnectionConstraint(edge, target, false);
if (tc) { if (tc) {
const pt = this.graph.getConnectionPoint(target, tc); const pt = this.graph.connection.getConnectionPoint(target, tc);
if (pt != null) { if (pt != null) {
this.convertPoint(pt, false); this.convertPoint(pt, false);
@ -197,7 +202,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
} }
} }
result = [new point(point.x, y0), new point(point.x, ye)]; result = [new Point(point.x, y0), new Point(point.x, ye)];
} }
this.points = result; this.points = result;
@ -212,8 +217,12 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
/** /**
* Overriden to merge edge segments. * Overriden to merge edge segments.
*/ */
// connect(edge: mxCell, terminal: mxCell, isSource: boolean, isClone: boolean, me: mxMouseEvent): mxCell; connect(edge: Cell,
connect(edge, terminal, isSource, isClone, me) { terminal: Cell,
isSource: boolean,
isClone: boolean,
me: MouseEvent): Cell {
const model = this.graph.getModel(); const model = this.graph.getModel();
let geo = edge.getGeometry(); let geo = edge.getGeometry();
let result = null; let result = null;
@ -242,8 +251,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
} }
} }
model.beginUpdate(); this.graph.batchUpdate(() => {
try {
if (result != null) { if (result != null) {
geo = edge.getGeometry(); geo = edge.getGeometry();
@ -254,11 +262,8 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
model.setGeometry(edge, geo); model.setGeometry(edge, geo);
} }
} }
edge = super.connect(edge, terminal, isSource, isClone, me); edge = super.connect(edge, terminal, isSource, isClone, me);
} finally { });
model.endUpdate();
}
return edge; return edge;
} }
@ -268,8 +273,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* *
* Returns no tooltips. * Returns no tooltips.
*/ */
// getTooltipForNode(node: any): string; getTooltipForNode(node: any): string {
getTooltipForNode(node) {
return null; return null;
} }
@ -279,7 +283,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* Adds custom bends for the center of each segment. * Adds custom bends for the center of each segment.
*/ */
// start(x: number, y: number, index: number): void; // start(x: number, y: number, index: number): void;
start(x, y, index) { start(x: number, y: number, index: number): void {
super.start(x, y, index); super.start(x, y, index);
if ( if (
@ -288,7 +292,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
!this.isSource && !this.isSource &&
!this.isTarget !this.isTarget
) { ) {
utils.setOpacity(this.bends[index].node, 100); setOpacity(this.bends[index].node, 100);
} }
} }
@ -343,8 +347,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* *
* Overridden to invoke <refresh> before the redraw. * Overridden to invoke <refresh> before the redraw.
*/ */
// redraw(): void; redraw(): void {
redraw() {
this.refresh(); this.refresh();
super.redraw(); super.redraw();
} }
@ -354,8 +357,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
* *
* Updates the position of the custom bends. * Updates the position of the custom bends.
*/ */
// redrawInnerBends(p0: mxPoint, pe: mxPoint): void; redrawInnerBends(p0: Point, pe: Point): void {
redrawInnerBends(p0, pe) {
if (this.graph.isCellBendable(this.state.cell)) { if (this.graph.isCellBendable(this.state.cell)) {
const pts = this.getCurrentPoints(); const pts = this.getCurrentPoints();
@ -405,12 +407,12 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
} }
if (straight) { if (straight) {
utils.setOpacity(this.bends[1].node, this.virtualBendOpacity); setOpacity(this.bends[1].node, this.virtualBendOpacity);
utils.setOpacity(this.bends[3].node, this.virtualBendOpacity); setOpacity(this.bends[3].node, this.virtualBendOpacity);
} }
} }
} }
} }
} }
export default mxEdgeSegmentHandler; export default EdgeSegmentHandler;

6
packages/core/src/view/cell/edge/mxElbowEdgeHandler.js → packages/core/src/view/cell/edge/ElbowEdgeHandler.ts
View File

@ -4,7 +4,7 @@
* Updated to ES9 syntax by David Morrissey 2021 * Updated to ES9 syntax by David Morrissey 2021
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import mxEdgeHandler from './mxEdgeHandler'; import EdgeHandler from './EdgeHandler';
import { import {
CURSOR_TERMINAL_HANDLE, CURSOR_TERMINAL_HANDLE,
EDGESTYLE_ELBOW, EDGESTYLE_ELBOW,
@ -37,7 +37,7 @@ import { isConsumed } from '../../../util/EventUtils';
* *
* state - <mxCellState> of the cell to be modified. * state - <mxCellState> of the cell to be modified.
*/ */
class mxElbowEdgeHandler extends mxEdgeHandler { class ElbowEdgeHandler extends EdgeHandler {
constructor(state) { constructor(state) {
super(state); super(state);
} }
@ -254,4 +254,4 @@ class mxElbowEdgeHandler extends mxEdgeHandler {
} }
} }
export default mxElbowEdgeHandler; export default ElbowEdgeHandler;

159
packages/core/src/view/cell/edge/Edge.ts → packages/core/src/view/cell/edge/GraphEdge.ts
View File

@ -7,10 +7,10 @@ import {
import Geometry from "../../geometry/Geometry"; import Geometry from "../../geometry/Geometry";
import EventObject from "../../event/EventObject"; import EventObject from "../../event/EventObject";
import InternalEvent from "../../event/InternalEvent"; import InternalEvent from "../../event/InternalEvent";
import mxDictionary from "../../../util/mxDictionary"; import Dictionary from "../../../util/Dictionary";
import Graph from "../../Graph"; import Graph from "../../Graph";
class Edge { class GraphEdge {
constructor(graph: Graph) { constructor(graph: Graph) {
this.graph = graph; this.graph = graph;
} }
@ -77,6 +77,75 @@ class Edge {
*/ */
edgeLabelsMovable: boolean = true; edgeLabelsMovable: boolean = true;
/*****************************************************************************
* Group: Graph Behaviour
*****************************************************************************/
/**
* Returns {@link edgeLabelsMovable}.
*/
isEdgeLabelsMovable(): boolean {
return this.edgeLabelsMovable;
}
/**
* Sets {@link edgeLabelsMovable}.
*/
setEdgeLabelsMovable(value: boolean): void {
this.edgeLabelsMovable = value;
}
/**
* Specifies if dangling edges are allowed, that is, if edges are allowed
* that do not have a source and/or target terminal defined.
*
* @param value Boolean indicating if dangling edges are allowed.
*/
setAllowDanglingEdges(value: boolean): void {
this.allowDanglingEdges = value;
}
/**
* Returns {@link allowDanglingEdges} as a boolean.
*/
isAllowDanglingEdges(): boolean {
return this.allowDanglingEdges;
}
/**
* Specifies if edges should be connectable.
*
* @param value Boolean indicating if edges should be connectable.
*/
setConnectableEdges(value: boolean): void {
this.connectableEdges = value;
}
/**
* Returns {@link connectableEdges} as a boolean.
*/
isConnectableEdges(): boolean {
return this.connectableEdges;
}
/**
* Specifies if edges should be inserted when cloned but not valid wrt.
* {@link getEdgeValidationError}. If false such edges will be silently ignored.
*
* @param value Boolean indicating if cloned invalid edges should be
* inserted into the graph or ignored.
*/
setCloneInvalidEdges(value: boolean): void {
this.cloneInvalidEdges = value;
}
/**
* Returns {@link cloneInvalidEdges} as a boolean.
*/
isCloneInvalidEdges(): boolean {
return this.cloneInvalidEdges;
}
/***************************************************************************** /*****************************************************************************
* Group: Cell alignment and orientation * Group: Cell alignment and orientation
*****************************************************************************/ *****************************************************************************/
@ -109,22 +178,19 @@ class Edge {
// flipEdge(edge: mxCell): mxCell; // flipEdge(edge: mxCell): mxCell;
flipEdge(edge: Cell): Cell { flipEdge(edge: Cell): Cell {
if (this.alternateEdgeStyle != null) { if (this.alternateEdgeStyle != null) {
this.getModel().beginUpdate(); this.graph.batchUpdate(() => {
try {
const style = edge.getStyle(); const style = edge.getStyle();
if (style == null || style.length === 0) { if (style == null || style.length === 0) {
this.getModel().setStyle(edge, this.alternateEdgeStyle); this.graph.model.setStyle(edge, this.alternateEdgeStyle);
} else { } else {
this.getModel().setStyle(edge, null); this.graph.model.setStyle(edge, null);
} }
// Removes all existing control points // Removes all existing control points
this.resetEdge(edge); this.resetEdge(edge);
this.fireEvent(new EventObject(InternalEvent.FLIP_EDGE, 'edge', edge)); this.graph.fireEvent(new EventObject(InternalEvent.FLIP_EDGE, 'edge', edge));
} finally { });
this.getModel().endUpdate();
}
} }
return edge; return edge;
} }
@ -507,7 +573,7 @@ class Edge {
resetEdges(cells: CellArray): void { resetEdges(cells: CellArray): void {
if (cells != null) { if (cells != null) {
// Prepares faster cells lookup // Prepares faster cells lookup
const dict = new mxDictionary(); const dict = new Dictionary();
for (let i = 0; i < cells.length; i += 1) { for (let i = 0; i < cells.length; i += 1) {
dict.put(cells[i], true); dict.put(cells[i], true);
@ -562,75 +628,6 @@ class Edge {
} }
return edge; return edge;
} }
/*****************************************************************************
* Group: Graph Behaviour
*****************************************************************************/
/**
* Returns {@link edgeLabelsMovable}.
*/
isEdgeLabelsMovable(): boolean {
return this.edgeLabelsMovable;
}
/**
* Sets {@link edgeLabelsMovable}.
*/
setEdgeLabelsMovable(value: boolean): void {
this.edgeLabelsMovable = value;
}
/**
* Specifies if dangling edges are allowed, that is, if edges are allowed
* that do not have a source and/or target terminal defined.
*
* @param value Boolean indicating if dangling edges are allowed.
*/
setAllowDanglingEdges(value: boolean): void {
this.allowDanglingEdges = value;
}
/**
* Returns {@link allowDanglingEdges} as a boolean.
*/
isAllowDanglingEdges(): boolean {
return this.allowDanglingEdges;
}
/**
* Specifies if edges should be connectable.
*
* @param value Boolean indicating if edges should be connectable.
*/
setConnectableEdges(value: boolean): void {
this.connectableEdges = value;
}
/**
* Returns {@link connectableEdges} as a boolean.
*/
isConnectableEdges(): boolean {
return this.connectableEdges;
}
/**
* Specifies if edges should be inserted when cloned but not valid wrt.
* {@link getEdgeValidationError}. If false such edges will be silently ignored.
*
* @param value Boolean indicating if cloned invalid edges should be
* inserted into the graph or ignored.
*/
setCloneInvalidEdges(value: boolean): void {
this.cloneInvalidEdges = value;
}
/**
* Returns {@link cloneInvalidEdges} as a boolean.
*/
isCloneInvalidEdges(): boolean {
return this.cloneInvalidEdges;
}
} }
export default Edge; export default GraphEdge;

4
packages/core/src/view/cell/vertex/Vertex.ts → packages/core/src/view/cell/vertex/GraphVertex.ts
View File

@ -2,7 +2,7 @@ import Cell from "../datatypes/Cell";
import Geometry from "../../geometry/Geometry"; import Geometry from "../../geometry/Geometry";
import CellArray from "../datatypes/CellArray"; import CellArray from "../datatypes/CellArray";
class Vertex { class GraphVertex {
/** /**
* Specifies the return value for vertices in {@link isLabelMovable}. * Specifies the return value for vertices in {@link isLabelMovable}.
@ -175,3 +175,5 @@ class Vertex {
this.vertexLabelsMovable = value; this.vertexLabelsMovable = value;
} }
} }
export default GraphVertex;

145
packages/core/src/view/cell/edge/mxHandle.js → packages/core/src/view/cell/vertex/VertexHandle.ts
View File

@ -5,12 +5,13 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import utils from '../../../util/Utils'; import utils, { getRotatedPoint, toRadians } from '../../../util/Utils';
import Point from '../../geometry/Point'; import Point from '../../geometry/Point';
import ImageShape from '../../geometry/shape/node/ImageShape'; import ImageShape from '../../geometry/shape/node/ImageShape';
import Rectangle from '../../geometry/Rectangle'; import Rectangle from '../../geometry/Rectangle';
import RectangleShape from '../../geometry/shape/node/RectangleShape'; import RectangleShape from '../../geometry/shape/node/RectangleShape';
import { import {
DIALECT_MIXEDHTML,
DIALECT_STRICTHTML, DIALECT_STRICTHTML,
DIALECT_SVG, DIALECT_SVG,
HANDLE_FILLCOLOR, HANDLE_FILLCOLOR,
@ -18,71 +19,78 @@ import {
HANDLE_STROKECOLOR, HANDLE_STROKECOLOR,
} from '../../../util/Constants'; } from '../../../util/Constants';
import InternalEvent from '../../event/InternalEvent'; import InternalEvent from '../../event/InternalEvent';
import Shape from '../../geometry/shape/Shape';
import InternalMouseEvent from '../../event/InternalMouseEvent';
import Image from '../../image/Image';
import Graph from '../../Graph';
import CellState from '../datatypes/CellState';
/** /**
* Implements a single custom handle for vertices. * Implements a single custom handle for vertices.
* *
* @class mxHandle * @class VertexHandle
*/ */
class mxHandle { class VertexHandle {
constructor(state, cursor, image, shape) { dependencies = ['snap', 'cells'];
constructor(state: CellState,
cursor: string | null = 'default',
image: Image | null = null,
shape: Shape | null = null) {
this.graph = state.view.graph; this.graph = state.view.graph;
this.state = state; this.state = state;
this.cursor = cursor != null ? cursor : this.cursor; this.cursor = cursor != null ? cursor : this.cursor;
this.image = image != null ? image : this.image; this.image = image != null ? image : this.image;
this.shape = shape != null ? shape : null; this.shape = shape;
this.init(); this.init();
} }
graph: Graph;
state: CellState;
shape: Shape | ImageShape | null;
/** /**
* Specifies the cursor to be used for this handle. Default is 'default'. * Specifies the cursor to be used for this handle. Default is 'default'.
*/ */
// cursor: string; cursor: string = 'default';
cursor = 'default';
/** /**
* Specifies the <mxImage> to be used to render the handle. Default is null. * Specifies the <mxImage> to be used to render the handle. Default is null.
*/ */
// image: mxImage; image: Image | null = null;
image = null;
/** /**
* Default is false. * Default is false.
*/ */
// ignoreGrid: boolean; ignoreGrid: boolean = false;
ignoreGrid = false;
/** /**
* Hook for subclassers to return the current position of the handle. * Hook for subclassers to return the current position of the handle.
*/ */
// getPosition(bounds: mxRectangle): any; getPosition(bounds: Rectangle) {}
getPosition(bounds) {}
/** /**
* Hooks for subclassers to update the style in the <state>. * Hooks for subclassers to update the style in the <state>.
*/ */
// setPosition(bounds: mxRectangle, pt: any, me: any): any; setPosition(bounds: Rectangle, pt: Point, me: InternalMouseEvent) {}
setPosition(bounds, pt, me) {}
/** /**
* Hook for subclassers to execute the handle. * Hook for subclassers to execute the handle.
*/ */
// execute(me: mxMouseEvent): void; execute(me: InternalMouseEvent): void {}
execute(me) {}
/** /**
* Sets the cell style with the given name to the corresponding value in <state>. * Sets the cell style with the given name to the corresponding value in <state>.
*/ */
// copyStyle(key: string): void; copyStyle(key: string): void {
copyStyle(key) {
this.graph.setCellStyles(key, this.state.style[key], [this.state.cell]); this.graph.setCellStyles(key, this.state.style[key], [this.state.cell]);
} }
/** /**
* Processes the given <mxMouseEvent> and invokes <setPosition>. * Processes the given <mxMouseEvent> and invokes <setPosition>.
*/ */
// processEvent(me: mxMouseEvent): void; processEvent(me: InternalMouseEvent): void {
processEvent(me) {
const { scale } = this.graph.view; const { scale } = this.graph.view;
const tr = this.graph.view.translate; const tr = this.graph.view.translate;
let pt = new Point( let pt = new Point(
@ -97,13 +105,13 @@ class mxHandle {
} }
// Snaps to grid for the rotated position then applies the rotation for the direction after that // Snaps to grid for the rotated position then applies the rotation for the direction after that
const alpha1 = -utils.toRadians(this.getRotation()); const alpha1 = -toRadians(this.getRotation());
const alpha2 = -utils.toRadians(this.getTotalRotation()) - alpha1; const alpha2 = -toRadians(this.getTotalRotation()) - alpha1;
pt = this.flipPoint( pt = this.flipPoint(
this.rotatePoint( this.rotatePoint(
this.snapPoint( this.snapPoint(
this.rotatePoint(pt, alpha1), this.rotatePoint(pt, alpha1),
this.ignoreGrid || !this.graph.isGridEnabledEvent(me.getEvent()) this.ignoreGrid || !this.graph.snap.isGridEnabledEvent(me.getEvent())
), ),
alpha2 alpha2
) )
@ -116,8 +124,7 @@ class mxHandle {
* Should be called after <setPosition> in <processEvent>. * Should be called after <setPosition> in <processEvent>.
* This repaints the state using <mxCellRenderer>. * This repaints the state using <mxCellRenderer>.
*/ */
// positionChanged(): void; positionChanged(): void {
positionChanged() {
if (this.state.text != null) { if (this.state.text != null) {
this.state.text.apply(this.state); this.state.text.apply(this.state);
} }
@ -132,12 +139,10 @@ class mxHandle {
/** /**
* Returns the rotation defined in the style of the cell. * Returns the rotation defined in the style of the cell.
*/ */
// getRotation(): number; getRotation(): number {
getRotation() {
if (this.state.shape != null) { if (this.state.shape != null) {
return this.state.shape.getRotation(); return this.state.shape.getRotation();
} }
return 0; return 0;
} }
@ -145,20 +150,17 @@ class mxHandle {
* Returns the rotation from the style and the rotation from the direction of * Returns the rotation from the style and the rotation from the direction of
* the cell. * the cell.
*/ */
// getTotalRotation(): number; getTotalRotation(): number {
getTotalRotation() {
if (this.state.shape != null) { if (this.state.shape != null) {
return this.state.shape.getShapeRotation(); return this.state.shape.getShapeRotation();
} }
return 0; return 0;
} }
/** /**
* Creates and initializes the shapes required for this handle. * Creates and initializes the shapes required for this handle.
*/ */
// init(): void; init(): void {
init() {
const html = this.isHtmlRequired(); const html = this.isHtmlRequired();
if (this.image != null) { if (this.image != null) {
@ -177,53 +179,53 @@ class mxHandle {
/** /**
* Creates and returns the shape for this handle. * Creates and returns the shape for this handle.
*/ */
// createShape(html: any): mxShape; createShape(html: any): Shape {
createShape(html) {
const bounds = new Rectangle(0, 0, HANDLE_SIZE, HANDLE_SIZE); const bounds = new Rectangle(0, 0, HANDLE_SIZE, HANDLE_SIZE);
return new RectangleShape(bounds, HANDLE_FILLCOLOR, HANDLE_STROKECOLOR); return new RectangleShape(bounds, HANDLE_FILLCOLOR, HANDLE_STROKECOLOR);
} }
/** /**
* Initializes <shape> and sets its cursor. * Initializes <shape> and sets its cursor.
*/ */
// initShape(html: any): void; initShape(html: any): void {
initShape(html) { const shape = <Shape>this.shape;
if (html && this.shape.isHtmlAllowed()) {
this.shape.dialect = DIALECT_STRICTHTML; if (html && shape.isHtmlAllowed()) {
this.shape.init(this.graph.container); shape.dialect = DIALECT_STRICTHTML;
shape.init(this.graph.container);
} else { } else {
this.shape.dialect = shape.dialect =
this.graph.dialect !== DIALECT_SVG ? DIALECT_MIXEDHTML : DIALECT_SVG; this.graph.dialect !== DIALECT_SVG ? DIALECT_MIXEDHTML : DIALECT_SVG;
if (this.cursor != null) { if (this.cursor != null) {
this.shape.init(this.graph.getView().getOverlayPane()); shape.init(this.graph.getView().getOverlayPane());
} }
} }
InternalEvent.redirectMouseEvents(this.shape.node, this.graph, this.state); InternalEvent.redirectMouseEvents(shape.node, this.graph, this.state);
this.shape.node.style.cursor = this.cursor; shape.node.style.cursor = this.cursor;
} }
/** /**
* Renders the shape for this handle. * Renders the shape for this handle.
*/ */
// redraw(): void; redraw(): void {
redraw() {
if (this.shape != null && this.state.shape != null) { if (this.shape != null && this.state.shape != null) {
let pt = this.getPosition(this.state.getPaintBounds()); let pt = this.getPosition(this.state.getPaintBounds());
if (pt != null) { if (pt != null) {
const alpha = utils.toRadians(this.getTotalRotation()); const alpha = toRadians(this.getTotalRotation());
pt = this.rotatePoint(this.flipPoint(pt), alpha); pt = this.rotatePoint(this.flipPoint(pt), alpha);
const { scale } = this.graph.view; const { scale } = this.graph.view;
const tr = this.graph.view.translate; const tr = this.graph.view.translate;
this.shape.bounds.x = Math.floor( const shapeBounds = <Rectangle>this.shape.bounds;
(pt.x + tr.x) * scale - this.shape.bounds.width / 2
shapeBounds.x = Math.floor(
(pt.x + tr.x) * scale - shapeBounds.width / 2
); );
this.shape.bounds.y = Math.floor( shapeBounds.y = Math.floor(
(pt.y + tr.y) * scale - this.shape.bounds.height / 2 (pt.y + tr.y) * scale - shapeBounds.height / 2
); );
// Needed to force update of text bounds // Needed to force update of text bounds
@ -236,8 +238,7 @@ class mxHandle {
* Returns true if this handle should be rendered in HTML. This returns true if * Returns true if this handle should be rendered in HTML. This returns true if
* the text node is in the graph container. * the text node is in the graph container.
*/ */
// isHtmlRequired(): boolean; isHtmlRequired(): boolean {
isHtmlRequired() {
return ( return (
this.state.text != null && this.state.text != null &&
this.state.text.node.parentNode === this.graph.container this.state.text.node.parentNode === this.graph.container
@ -247,23 +248,21 @@ class mxHandle {
/** /**
* Rotates the point by the given angle. * Rotates the point by the given angle.
*/ */
// rotatePoint(pt: mxPoint, alpha: boolean): mxPoint; rotatePoint(pt: Point, alpha: number): Point {
rotatePoint(pt, alpha) { const bounds = <Rectangle>this.state.getCellBounds();
const bounds = this.state.getCellBounds();
const cx = new Point(bounds.getCenterX(), bounds.getCenterY()); const cx = new Point(bounds.getCenterX(), bounds.getCenterY());
const cos = Math.cos(alpha); const cos = Math.cos(alpha);
const sin = Math.sin(alpha); const sin = Math.sin(alpha);
return utils.getRotatedPoint(pt, cos, sin, cx); return getRotatedPoint(pt, cos, sin, cx);
} }
/** /**
* Flips the given point vertically and/or horizontally. * Flips the given point vertically and/or horizontally.
*/ */
// flipPoint(pt: mxPoint): mxPoint; flipPoint(pt: Point): Point {
flipPoint(pt) {
if (this.state.shape != null) { if (this.state.shape != null) {
const bounds = this.state.getCellBounds(); const bounds = <Rectangle>this.state.getCellBounds();
if (this.state.shape.flipH) { if (this.state.shape.flipH) {
pt.x = 2 * bounds.x + bounds.width - pt.x; pt.x = 2 * bounds.x + bounds.width - pt.x;
@ -273,7 +272,6 @@ class mxHandle {
pt.y = 2 * bounds.y + bounds.height - pt.y; pt.y = 2 * bounds.y + bounds.height - pt.y;
} }
} }
return pt; return pt;
} }
@ -281,21 +279,18 @@ class mxHandle {
* Snaps the given point to the grid if ignore is false. This modifies * Snaps the given point to the grid if ignore is false. This modifies
* the given point in-place and also returns it. * the given point in-place and also returns it.
*/ */
// snapPoint(pt: mxPoint, ignore: boolean): mxPoint; snapPoint(pt: Point, ignore: boolean): Point {
snapPoint(pt, ignore) {
if (!ignore) { if (!ignore) {
pt.x = this.graph.snap(pt.x); pt.x = this.graph.snap.snap(pt.x);
pt.y = this.graph.snap(pt.y); pt.y = this.graph.snap.snap(pt.y);
} }
return pt; return pt;
} }
/** /**
* Shows or hides this handle. * Shows or hides this handle.
*/ */
// setVisible(visible: boolean): void; setVisible(visible: boolean): void {
setVisible(visible) {
if (this.shape != null && this.shape.node != null) { if (this.shape != null && this.shape.node != null) {
this.shape.node.style.display = visible ? '' : 'none'; this.shape.node.style.display = visible ? '' : 'none';
} }
@ -304,18 +299,16 @@ class mxHandle {
/** /**
* Resets the state of this handle by setting its visibility to true. * Resets the state of this handle by setting its visibility to true.
*/ */
// reset(): void; reset(): void {
reset() {
this.setVisible(true); this.setVisible(true);
this.state.style = this.graph.getCellStyle(this.state.cell); this.state.style = this.graph.cells.getCellStyle(this.state.cell);
this.positionChanged(); this.positionChanged();
} }
/** /**
* Destroys this handle. * Destroys this handle.
*/ */
// destroy(): void; destroy(): void {
destroy() {
if (this.shape != null) { if (this.shape != null) {
this.shape.destroy(); this.shape.destroy();
this.shape = null; this.shape = null;
@ -323,4 +316,4 @@ class mxHandle {
} }
} }
export default mxHandle; export default VertexHandle;

107
packages/core/src/view/cell/vertex/mxVertexHandler.js → packages/core/src/view/cell/vertex/VertexHandler.ts
View File

@ -28,6 +28,10 @@ import Point from '../../geometry/Point';
import utils from '../../../util/Utils'; import utils from '../../../util/Utils';
import mxClient from '../../../mxClient'; import mxClient from '../../../mxClient';
import { isMouseEvent, isShiftDown } from '../../../util/EventUtils'; import { isMouseEvent, isShiftDown } from '../../../util/EventUtils';
import Graph from '../../Graph';
import CellState from '../datatypes/CellState';
import Image from '../../image/Image';
import Cell from '../datatypes/Cell';
/** /**
* Class: mxVertexHandler * Class: mxVertexHandler
@ -44,46 +48,49 @@ import { isMouseEvent, isShiftDown } from '../../../util/EventUtils';
* *
* state - <mxCellState> of the cell to be resized. * state - <mxCellState> of the cell to be resized.
*/ */
class mxVertexHandler { class VertexHandler {
constructor(state) { dependencies = ['selection', 'cells'];
if (state != null) {
this.state = state;
this.init();
// Handles escape keystrokes constructor(state: CellState) {
this.escapeHandler = (sender, evt) => { this.state = state;
if (this.livePreview && this.index != null) { this.init();
// Redraws the live preview
this.state.view.graph.cellRenderer.redraw(this.state, true);
// Redraws connected edges // Handles escape keystrokes
this.state.view.invalidate(this.state.cell); this.escapeHandler = (sender, evt) => {
this.state.invalid = false; if (this.livePreview && this.index != null) {
this.state.view.validate(); // Redraws the live preview
} this.state.view.graph.cellRenderer.redraw(this.state, true);
this.reset(); // Redraws connected edges
}; this.state.view.invalidate(this.state.cell);
this.state.invalid = false;
this.state.view.validate();
}
this.state.view.graph.addListener(InternalEvent.ESCAPE, this.escapeHandler); this.reset();
} };
this.state.view.graph.addListener(InternalEvent.ESCAPE, this.escapeHandler);
} }
escapeHandler: Function;
selectionBounds?: Rectangle;
bounds?: Rectangle;
selectionBorder?: RectangleShape;
/** /**
* Variable: graph * Variable: graph
* *
* Reference to the enclosing <mxGraph>. * Reference to the enclosing <mxGraph>.
*/ */
// graph: mxGraph; graph?: Graph;
graph = null;
/** /**
* Variable: state * Variable: state
* *
* Reference to the <mxCellState> being modified. * Reference to the <mxCellState> being modified.
*/ */
// state: mxCellState; state: CellState;
state = null;
/** /**
* Variable: singleSizer * Variable: singleSizer
@ -91,16 +98,14 @@ class mxVertexHandler {
* Specifies if only one sizer handle at the bottom, right corner should be * Specifies if only one sizer handle at the bottom, right corner should be
* used. Default is false. * used. Default is false.
*/ */
// singleSizer: boolean; singleSizer: boolean = false;
singleSizer = false;
/** /**
* Variable: index * Variable: index
* *
* Holds the index of the current handle. * Holds the index of the current handle.
*/ */
// index: number; index: number | null = null;
index = null;
/** /**
* Variable: allowHandleBoundsCheck * Variable: allowHandleBoundsCheck
@ -108,16 +113,14 @@ class mxVertexHandler {
* Specifies if the bounds of handles should be used for hit-detection in IE or * Specifies if the bounds of handles should be used for hit-detection in IE or
* if <tolerance> > 0. Default is true. * if <tolerance> > 0. Default is true.
*/ */
// allowHandleBoundsCheck: boolean; allowHandleBoundsCheck: boolean = true;
allowHandleBoundsCheck = true;
/** /**
* Variable: handleImage * Variable: handleImage
* *
* Optional <mxImage> to be used as handles. Default is null. * Optional <mxImage> to be used as handles. Default is null.
*/ */
// handleImage: mxImage; handleImage: Image | null = null;
handleImage = null;
/** /**
* Variable: handlesVisible * Variable: handlesVisible
@ -131,16 +134,14 @@ class mxVertexHandler {
* *
* Optional tolerance for hit-detection in <getHandleForEvent>. Default is 0. * Optional tolerance for hit-detection in <getHandleForEvent>. Default is 0.
*/ */
// tolerance: number; tolerance: number = 0;
tolerance = 0;
/** /**
* Variable: rotationEnabled * Variable: rotationEnabled
* *
* Specifies if a rotation handle should be visible. Default is false. * Specifies if a rotation handle should be visible. Default is false.
*/ */
// rotationEnabled: boolean; rotationEnabled: boolean = false;
rotationEnabled = false;
/** /**
* Variable: parentHighlightEnabled * Variable: parentHighlightEnabled
@ -148,8 +149,7 @@ class mxVertexHandler {
* Specifies if the parent should be highlighted if a child cell is selected. * Specifies if the parent should be highlighted if a child cell is selected.
* Default is false. * Default is false.
*/ */
// parentHighlightEnabled: boolean; parentHighlightEnabled: boolean = false;
parentHighlightEnabled = false;
/** /**
* Variable: rotationRaster * Variable: rotationRaster
@ -157,16 +157,14 @@ class mxVertexHandler {
* Specifies if rotation steps should be "rasterized" depening on the distance * Specifies if rotation steps should be "rasterized" depening on the distance
* to the handle. Default is true. * to the handle. Default is true.
*/ */
// rotationRaster: boolean; rotationRaster: boolean = true;
rotationRaster = true;
/** /**
* Variable: rotationCursor * Variable: rotationCursor
* *
* Specifies the cursor for the rotation handle. Default is 'crosshair'. * Specifies the cursor for the rotation handle. Default is 'crosshair'.
*/ */
// rotationCursor: string; rotationCursor: string = 'crosshair';
rotationCursor = 'crosshair';
/** /**
* Variable: livePreview * Variable: livePreview
@ -174,15 +172,14 @@ class mxVertexHandler {
* Specifies if resize should change the cell in-place. This is an experimental * Specifies if resize should change the cell in-place. This is an experimental
* feature for non-touch devices. Default is false. * feature for non-touch devices. Default is false.
*/ */
// livePreview: boolean; livePreview: boolean = false;
livePreview = false;
/** /**
* Variable: movePreviewToFront * Variable: movePreviewToFront
* *
* Specifies if the live preview should be moved to the front. * Specifies if the live preview should be moved to the front.
*/ */
movePreviewToFront = false; movePreviewToFront: boolean = false;
/** /**
* Variable: manageSizers * Variable: manageSizers
@ -190,8 +187,7 @@ class mxVertexHandler {
* Specifies if sizers should be hidden and spaced if the vertex is small. * Specifies if sizers should be hidden and spaced if the vertex is small.
* Default is false. * Default is false.
*/ */
// manageSizers: boolean; manageSizers: boolean = false;
manageSizers = false;
/** /**
* Variable: constrainGroupByChildren * Variable: constrainGroupByChildren
@ -199,16 +195,14 @@ class mxVertexHandler {
* Specifies if the size of groups should be constrained by the children. * Specifies if the size of groups should be constrained by the children.
* Default is false. * Default is false.
*/ */
// constrainGroupByChildren: boolean; constrainGroupByChildren: boolean = false;
constrainGroupByChildren = false;
/** /**
* Variable: rotationHandleVSpacing * Variable: rotationHandleVSpacing
* *
* Vertical spacing for rotation icon. Default is -16. * Vertical spacing for rotation icon. Default is -16.
*/ */
// rotationHandleVSpacing: number; rotationHandleVSpacing: number = -16;
rotationHandleVSpacing = -16;
/** /**
* Variable: horizontalOffset * Variable: horizontalOffset
@ -216,8 +210,7 @@ class mxVertexHandler {
* The horizontal offset for the handles. This is updated in <redrawHandles> * The horizontal offset for the handles. This is updated in <redrawHandles>
* if <manageSizers> is true and the sizers are offset horizontally. * if <manageSizers> is true and the sizers are offset horizontally.
*/ */
// horizontalOffset: number; horizontalOffset: number = 0;
horizontalOffset = 0;
/** /**
* Variable: verticalOffset * Variable: verticalOffset
@ -225,16 +218,14 @@ class mxVertexHandler {
* The horizontal offset for the handles. This is updated in <redrawHandles> * The horizontal offset for the handles. This is updated in <redrawHandles>
* if <manageSizers> is true and the sizers are offset vertically. * if <manageSizers> is true and the sizers are offset vertically.
*/ */
// verticalOffset: number; verticalOffset: number = 0;
verticalOffset = 0;
/** /**
* Function: init * Function: init
* *
* Initializes the shapes required for this vertex handler. * Initializes the shapes required for this vertex handler.
*/ */
// init(): void; init(): void {
init() {
this.graph = this.state.view.graph; this.graph = this.state.view.graph;
this.selectionBounds = this.getSelectionBounds(this.state); this.selectionBounds = this.getSelectionBounds(this.state);
this.bounds = new Rectangle( this.bounds = new Rectangle(
@ -264,7 +255,7 @@ class mxVertexHandler {
// Adds the sizer handles // Adds the sizer handles
if ( if (
this.graph.graphHandler.maxCells <= 0 || this.graph.graphHandler.maxCells <= 0 ||
this.graph.getSelectionCount() < this.graph.graphHandler.maxCells this.graph.selection.getSelectionCount() < this.graph.graphHandler.maxCells
) { ) {
const resizable = this.graph.isCellResizable(this.state.cell); const resizable = this.graph.isCellResizable(this.state.cell);
this.sizers = []; this.sizers = [];
@ -2309,4 +2300,4 @@ class mxVertexHandler {
} }
} }
export default mxVertexHandler; export default VertexHandler;

9
packages/core/src/view/connection/mxConnectionConstraint.ts → packages/core/src/view/connection/ConnectionConstraint.ts
View File

@ -9,9 +9,9 @@ import Point from '../geometry/Point';
/** /**
* Defines an object that contains the constraints about how to connect one side of an edge to its terminal. * Defines an object that contains the constraints about how to connect one side of an edge to its terminal.
* @class mxConnectionConstraint * @class ConnectionConstraint
*/ */
class mxConnectionConstraint { class ConnectionConstraint {
constructor( constructor(
point: Point | null = null, point: Point | null = null,
perimeter: boolean = true, perimeter: boolean = true,
@ -31,7 +31,6 @@ class mxConnectionConstraint {
* *
* <mxPoint> that specifies the fixed location of the connection point. * <mxPoint> that specifies the fixed location of the connection point.
*/ */
// point: mxPoint;
point: Point | null = null; point: Point | null = null;
/** /**
@ -40,7 +39,6 @@ class mxConnectionConstraint {
* Boolean that specifies if the point should be projected onto the perimeter * Boolean that specifies if the point should be projected onto the perimeter
* of the terminal. * of the terminal.
*/ */
// perimeter: boolean;
perimeter: boolean = true; perimeter: boolean = true;
/** /**
@ -48,7 +46,6 @@ class mxConnectionConstraint {
* *
* Optional string that specifies the name of the constraint. * Optional string that specifies the name of the constraint.
*/ */
// name: string;
name: string | null = null; name: string | null = null;
/** /**
@ -66,4 +63,4 @@ class mxConnectionConstraint {
dy: number | null = null; dy: number | null = null;
} }
export default mxConnectionConstraint; export default ConnectionConstraint;

38
packages/core/src/view/connection/mxConnectionHandler.ts → packages/core/src/view/connection/ConnectionHandler.ts
View File

@ -23,7 +23,7 @@ import utils from '../../util/Utils';
import InternalMouseEvent from '../event/InternalMouseEvent'; import InternalMouseEvent from '../event/InternalMouseEvent';
import ImageShape from '../geometry/shape/node/ImageShape'; import ImageShape from '../geometry/shape/node/ImageShape';
import CellMarker from '../cell/CellMarker'; import CellMarker from '../cell/CellMarker';
import mxConstraintHandler from './mxConstraintHandler'; import ConstraintHandler from './ConstraintHandler';
import mxPolyline from '../geometry/shape/edge/mxPolyline'; import mxPolyline from '../geometry/shape/edge/mxPolyline';
import EventSource from '../event/EventSource'; import EventSource from '../event/EventSource';
import Rectangle from '../geometry/Rectangle'; import Rectangle from '../geometry/Rectangle';
@ -38,6 +38,7 @@ import {
import graph from '../Graph'; import graph from '../Graph';
import Image from '../image/Image'; import Image from '../image/Image';
import CellState from '../cell/datatypes/CellState'; import CellState from '../cell/datatypes/CellState';
import Graph from '../Graph';
type FactoryMethod = (source: Cell, target: Cell, style?: string) => Cell; type FactoryMethod = (source: Cell, target: Cell, style?: string) => Cell;
@ -197,8 +198,8 @@ type FactoryMethod = (source: Cell, target: Cell, style?: string) => Cell;
* optional cell style from the preview as the third argument. It returns * optional cell style from the preview as the third argument. It returns
* the <mxCell> that represents the new edge. * the <mxCell> that represents the new edge.
*/ */
class mxConnectionHandler extends EventSource { class ConnectionHandler extends EventSource {
constructor(graph: graph, factoryMethod: FactoryMethod | null = null) { constructor(graph: Graph, factoryMethod: FactoryMethod | null = null) {
super(); super();
this.graph = graph; this.graph = graph;
@ -218,8 +219,7 @@ class mxConnectionHandler extends EventSource {
* *
* Reference to the enclosing <mxGraph>. * Reference to the enclosing <mxGraph>.
*/ */
// graph: mxGraph; graph: Graph;
graph: graph;
/** /**
* Variable: factoryMethod * Variable: factoryMethod
@ -228,7 +228,6 @@ class mxConnectionHandler extends EventSource {
* source and target <mxCell> as the first and second argument and returns * source and target <mxCell> as the first and second argument and returns
* a new <mxCell> that represents the edge. This is used in <createEdge>. * a new <mxCell> that represents the edge. This is used in <createEdge>.
*/ */
// factoryMethod: (source: mxCell, target: mxCell, style?: string) => mxCell;
factoryMethod: FactoryMethod | null = null; factoryMethod: FactoryMethod | null = null;
/** /**
@ -298,7 +297,7 @@ class mxConnectionHandler extends EventSource {
* *
* Holds the <mxTerminalMarker> used for finding source and target cells. * Holds the <mxTerminalMarker> used for finding source and target cells.
*/ */
marker: CellMarker; marker?: CellMarker;
/** /**
* Variable: constraintHandler * Variable: constraintHandler
@ -306,15 +305,14 @@ class mxConnectionHandler extends EventSource {
* Holds the <mxConstraintHandler> used for drawing and highlighting * Holds the <mxConstraintHandler> used for drawing and highlighting
* constraints. * constraints.
*/ */
constraintHandler: mxConstraintHandler | null = null; constraintHandler: ConstraintHandler | null = null;
/** /**
* Variable: error * Variable: error
* *
* Holds the current validation error while connections are being created. * Holds the current validation error while connections are being created.
*/ */
// error: any; error: any = null;
error = null;
/** /**
* Variable: waypointsEnabled * Variable: waypointsEnabled
@ -364,16 +362,14 @@ class mxConnectionHandler extends EventSource {
* *
* Holds the change event listener for later removal. * Holds the change event listener for later removal.
*/ */
// changeHandler: any; changeHandler: any = null;
changeHandler = null;
/** /**
* Variable: drillHandler * Variable: drillHandler
* *
* Holds the drill event listener for later removal. * Holds the drill event listener for later removal.
*/ */
// drillHandler: any; drillHandler: any = null;
drillHandler = null;
/** /**
* Variable: mouseDownCounter * Variable: mouseDownCounter
@ -414,8 +410,7 @@ class mxConnectionHandler extends EventSource {
* *
* Specifies the cursor to be used while the handler is active. Default is null. * Specifies the cursor to be used while the handler is active. Default is null.
*/ */
// cursor: string; cursor: string = null;
cursor = null;
/** /**
* Variable: insertBeforeSource * Variable: insertBeforeSource
@ -528,11 +523,10 @@ class mxConnectionHandler extends EventSource {
* be invoked if <mxGraph.container> is assigned after the connection * be invoked if <mxGraph.container> is assigned after the connection
* handler has been created. * handler has been created.
*/ */
// init(): void; init(): void {
init() { this.graph.event.addMouseListener(this);
this.graph.addMouseListener(this); this.marker = <CellMarker>this.createMarker();
this.marker = this.createMarker(); this.constraintHandler = new ConstraintHandler(this.graph);
this.constraintHandler = new mxConstraintHandler(this.graph);
// Redraws the icons if the graph changes // Redraws the icons if the graph changes
this.changeHandler = (sender) => { this.changeHandler = (sender) => {
@ -2342,4 +2336,4 @@ class mxConnectionHandler extends EventSource {
} }
} }
export default mxConnectionHandler; export default ConnectionHandler;

4
packages/core/src/view/connection/mxConstraintHandler.js → packages/core/src/view/connection/ConstraintHandler.ts
View File

@ -26,9 +26,9 @@ import { isShiftDown } from '../../util/EventUtils';
* showing fixed points when the mouse is over a vertex and handles constraints * showing fixed points when the mouse is over a vertex and handles constraints
* to establish new connections. * to establish new connections.
* *
* @class mxConstraintHandler * @class ConstraintHandler
*/ */
class mxConstraintHandler { class ConstraintHandler {
constructor(graph) { constructor(graph) {
this.graph = graph; this.graph = graph;

52
packages/core/src/view/connection/GraphConnections.ts
View File

@ -1,7 +1,7 @@
import Point from "../geometry/Point"; import Point from "../geometry/Point";
import CellState from "../cell/datatypes/CellState"; import CellState from "../cell/datatypes/CellState";
import InternalMouseEvent from "../event/InternalMouseEvent"; import InternalMouseEvent from "../event/InternalMouseEvent";
import mxConnectionConstraint from "./mxConnectionConstraint"; import ConnectionConstraint from "./ConnectionConstraint";
import Rectangle from "../geometry/Rectangle"; import Rectangle from "../geometry/Rectangle";
import {DIRECTION_NORTH, DIRECTION_SOUTH, DIRECTION_WEST} from "../../util/Constants"; import {DIRECTION_NORTH, DIRECTION_SOUTH, DIRECTION_WEST} from "../../util/Constants";
import utils, {getRotatedPoint, getValue, toRadians} from "../../util/Utils"; import utils, {getRotatedPoint, getValue, toRadians} from "../../util/Utils";
@ -9,10 +9,10 @@ import Cell from "../cell/datatypes/Cell";
import CellArray from "../cell/datatypes/CellArray"; import CellArray from "../cell/datatypes/CellArray";
import EventObject from "../event/EventObject"; import EventObject from "../event/EventObject";
import InternalEvent from "../event/InternalEvent"; import InternalEvent from "../event/InternalEvent";
import mxDictionary from "../../util/mxDictionary"; import Dictionary from "../../util/Dictionary";
import Geometry from "../geometry/Geometry"; import Geometry from "../geometry/Geometry";
import Graph from "../Graph"; import Graph from "../Graph";
import mxConnectionHandler from "./mxConnectionHandler"; import ConnectionHandler from "./ConnectionHandler";
class GraphConnections { class GraphConnections {
constructor(graph: Graph) { constructor(graph: Graph) {
@ -32,10 +32,10 @@ class GraphConnections {
point: Point, point: Point,
terminalState: CellState, terminalState: CellState,
me: InternalMouseEvent me: InternalMouseEvent
): mxConnectionConstraint | null { ): ConnectionConstraint | null {
if (terminalState.shape != null) { if (terminalState.shape != null) {
const bounds = <Rectangle>( const bounds = <Rectangle>(
this.getView().getPerimeterBounds(terminalState) this.graph.view.getPerimeterBounds(terminalState)
); );
const direction = terminalState.style.direction; const direction = terminalState.style.direction;
@ -111,7 +111,7 @@ class GraphConnections {
? 0 ? 0
: Math.round(((point.y - bounds.y) * 1000) / bounds.height) / 1000; : Math.round(((point.y - bounds.y) * 1000) / bounds.height) / 1000;
return new mxConnectionConstraint(new point(x, y), false); return new ConnectionConstraint(new point(x, y), false);
} }
return null; return null;
} }
@ -127,7 +127,7 @@ class GraphConnections {
getAllConnectionConstraints( getAllConnectionConstraints(
terminal: CellState, terminal: CellState,
source: boolean source: boolean
): mxConnectionConstraint[] | null { ): ConnectionConstraint[] | null {
if ( if (
terminal != null && terminal != null &&
terminal.shape != null && terminal.shape != null &&
@ -139,7 +139,7 @@ class GraphConnections {
} }
/** /**
* Returns an {@link mxConnectionConstraint} that describes the given connection * Returns an {@link ConnectionConstraint} that describes the given connection
* point. This result can then be passed to {@link getConnectionPoint}. * point. This result can then be passed to {@link getConnectionPoint}.
* *
* @param edge {@link mxCellState} that represents the edge. * @param edge {@link mxCellState} that represents the edge.
@ -150,7 +150,7 @@ class GraphConnections {
edge: CellState, edge: CellState,
terminal: CellState | null = null, terminal: CellState | null = null,
source: boolean = false source: boolean = false
): mxConnectionConstraint { ): ConnectionConstraint {
let point = null; let point = null;
// @ts-ignore // @ts-ignore
const x = <string>edge.style[source ? 'exitX' : 'entryX']; const x = <string>edge.style[source ? 'exitX' : 'entryX'];
@ -189,25 +189,25 @@ class GraphConnections {
dy = Number.isFinite(dy) ? dy : 0; dy = Number.isFinite(dy) ? dy : 0;
} }
return new mxConnectionConstraint(point, perimeter, null, dx, dy); return new ConnectionConstraint(point, perimeter, null, dx, dy);
} }
/** /**
* Sets the {@link mxConnectionConstraint} that describes the given connection point. * Sets the {@link ConnectionConstraint} that describes the given connection point.
* If no constraint is given then nothing is changed. To remove an existing * If no constraint is given then nothing is changed. To remove an existing
* constraint from the given edge, use an empty constraint instead. * constraint from the given edge, use an empty constraint instead.
* *
* @param edge {@link mxCell} that represents the edge. * @param edge {@link mxCell} that represents the edge.
* @param terminal {@link mxCell} that represents the terminal. * @param terminal {@link mxCell} that represents the terminal.
* @param source Boolean indicating if the terminal is the source or target. * @param source Boolean indicating if the terminal is the source or target.
* @param constraint Optional {@link mxConnectionConstraint} to be used for this * @param constraint Optional {@link ConnectionConstraint} to be used for this
* connection. * connection.
*/ */
setConnectionConstraint( setConnectionConstraint(
edge: Cell, edge: Cell,
terminal: Cell, terminal: Cell,
source: boolean = false, source: boolean = false,
constraint: mxConnectionConstraint | null = null constraint: ConnectionConstraint | null = null
): void { ): void {
if (constraint != null) { if (constraint != null) {
this.getModel().beginUpdate(); this.getModel().beginUpdate();
@ -276,13 +276,13 @@ class GraphConnections {
*/ */
getConnectionPoint( getConnectionPoint(
vertex: CellState, vertex: CellState,
constraint: mxConnectionConstraint, constraint: ConnectionConstraint,
round: boolean = true round: boolean = true
): Point { ): Point {
let point = null; let point = null;
if (vertex != null && constraint.point != null) { if (vertex != null && constraint.point != null) {
const bounds = <Rectangle>this.getView().getPerimeterBounds(vertex); const bounds = <Rectangle>this.graph.view.getPerimeterBounds(vertex);
const cx = new point(bounds.getCenterX(), bounds.getCenterY()); const cx = new point(bounds.getCenterX(), bounds.getCenterY());
const direction = vertex.style.direction; const direction = vertex.style.direction;
let r1 = 0; let r1 = 0;
@ -336,7 +336,7 @@ class GraphConnections {
point = getRotatedPoint(point, cos, sin, cx); point = getRotatedPoint(point, cos, sin, cx);
} }
point = this.getView().getPerimeterPoint(vertex, point, false); point = this.graph.view.getPerimeterPoint(vertex, point, false);
} else { } else {
r2 += r1; r2 += r1;
@ -393,14 +393,14 @@ class GraphConnections {
* @param edge {@link mxCell} whose terminal should be updated. * @param edge {@link mxCell} whose terminal should be updated.
* @param terminal {@link mxCell} that represents the new terminal to be used. * @param terminal {@link mxCell} that represents the new terminal to be used.
* @param source Boolean indicating if the new terminal is the source or target. * @param source Boolean indicating if the new terminal is the source or target.
* @param constraint Optional {@link mxConnectionConstraint} to be used for this * @param constraint Optional {@link ConnectionConstraint} to be used for this
* connection. * connection.
*/ */
connectCell( connectCell(
edge: Cell, edge: Cell,
terminal: Cell, terminal: Cell,
source: boolean = false, source: boolean = false,
constraint: mxConnectionConstraint | null = null constraint: ConnectionConstraint | null = null
): Cell { ): Cell {
this.getModel().beginUpdate(); this.getModel().beginUpdate();
try { try {
@ -439,7 +439,7 @@ class GraphConnections {
edge: Cell, edge: Cell,
terminal: Cell, terminal: Cell,
source: boolean = false, source: boolean = false,
constraint: mxConnectionConstraint | null = null constraint: ConnectionConstraint | null = null
): void { ): void {
if (edge != null) { if (edge != null) {
this.getModel().beginUpdate(); this.getModel().beginUpdate();
@ -500,10 +500,10 @@ class GraphConnections {
this.getModel().beginUpdate(); this.getModel().beginUpdate();
try { try {
const { scale } = this.view; const { scale } = this.view;
const tr = this.getView().translate; const tr = this.graph.view.translate;
// Fast lookup for finding cells in array // Fast lookup for finding cells in array
const dict = new mxDictionary(); const dict = new Dictionary();
for (let i = 0; i < cells.length; i += 1) { for (let i = 0; i < cells.length; i += 1) {
dict.put(cells[i], true); dict.put(cells[i], true);
@ -514,9 +514,9 @@ class GraphConnections {
let geo = <Geometry>cell.getGeometry(); let geo = <Geometry>cell.getGeometry();
if (geo != null) { if (geo != null) {
const state = this.getView().getState(cell); const state = this.graph.view.getState(cell);
const pstate = <CellState>( const pstate = <CellState>(
this.getView().getState(cell.getParent()) this.graph.view.getState(cell.getParent())
); );
if (state != null && pstate != null) { if (state != null && pstate != null) {
@ -733,19 +733,19 @@ class GraphConnections {
/** /**
* Specifies if the graph should allow new connections. This implementation * Specifies if the graph should allow new connections. This implementation
* updates {@link mxConnectionHandler.enabled} in {@link connectionHandler}. * updates {@link ConnectionHandler.enabled} in {@link connectionHandler}.
* *
* @param connectable Boolean indicating if new connections should be allowed. * @param connectable Boolean indicating if new connections should be allowed.
*/ */
setConnectable(connectable: boolean): void { setConnectable(connectable: boolean): void {
(<mxConnectionHandler>this.connectionHandler).setEnabled(connectable); (<ConnectionHandler>this.connectionHandler).setEnabled(connectable);
} }
/** /**
* Returns true if the {@link connectionHandler} is enabled. * Returns true if the {@link connectionHandler} is enabled.
*/ */
isConnectable(): boolean { isConnectable(): boolean {
return (<mxConnectionHandler>this.connectionHandler).isEnabled(); return (<ConnectionHandler>this.connectionHandler).isEnabled();
} }
} }

0
packages/core/src/view/drag_drop/DragSource.js → packages/core/src/view/drag_drop/DragSource.ts
View File

4
packages/core/src/view/editing/InPlaceEditing.ts → packages/core/src/view/editing/GraphEditing.ts
View File

@ -6,7 +6,7 @@ import CellEditor from "./CellEditor";
import InternalMouseEvent from "../event/InternalMouseEvent"; import InternalMouseEvent from "../event/InternalMouseEvent";
import Graph from "../Graph"; import Graph from "../Graph";
class InPlaceEditing { class GraphEditing {
constructor(graph: Graph) { constructor(graph: Graph) {
this.graph = graph; this.graph = graph;
} }
@ -248,4 +248,4 @@ class InPlaceEditing {
} }
} }
export default InPlaceEditing; export default GraphEditing;

57
packages/core/src/view/event/EventSource.js → packages/core/src/view/event/EventSource.ts
View File

@ -30,8 +30,8 @@ import EventObject from './EventObject';
* Constructs a new event source. * Constructs a new event source.
*/ */
class EventSource { class EventSource {
constructor(eventSource) { constructor(eventSource: EventSource) {
this.setEventSource(eventSource); this.eventSource = eventSource;
} }
/** /**
@ -41,32 +41,28 @@ class EventSource {
* contains the event name followed by the respective listener for each * contains the event name followed by the respective listener for each
* registered listener. * registered listener.
*/ */
// eventListeners: any[]; eventListeners: ({funct: Function, name: string})[] = [];
eventListeners = null;
/** /**
* Variable: eventsEnabled * Variable: eventsEnabled
* *
* Specifies if events can be fired. Default is true. * Specifies if events can be fired. Default is true.
*/ */
// eventsEnabled: boolean; eventsEnabled: boolean = true;
eventsEnabled = true;
/** /**
* Variable: eventSource * Variable: eventSource
* *
* Optional source for events. Default is null. * Optional source for events. Default is null.
*/ */
// eventSource: any; eventSource: EventSource;
eventSource = null;
/** /**
* Function: isEventsEnabled * Function: isEventsEnabled
* *
* Returns <eventsEnabled>. * Returns <eventsEnabled>.
*/ */
// isEventsEnabled(): boolean; isEventsEnabled(): boolean {
isEventsEnabled() {
return this.eventsEnabled; return this.eventsEnabled;
} }
@ -75,8 +71,7 @@ class EventSource {
* *
* Sets <eventsEnabled>. * Sets <eventsEnabled>.
*/ */
// setEventsEnabled(value: boolean): void; setEventsEnabled(value: boolean): void {
setEventsEnabled(value) {
this.eventsEnabled = value; this.eventsEnabled = value;
} }
@ -85,8 +80,7 @@ class EventSource {
* *
* Returns <eventSource>. * Returns <eventSource>.
*/ */
// getEventSource(): any; getEventSource(): EventSource {
getEventSource() {
return this.eventSource; return this.eventSource;
} }
@ -95,8 +89,7 @@ class EventSource {
* *
* Sets <eventSource>. * Sets <eventSource>.
*/ */
// setEventSource(value: any): void; setEventSource(value: EventSource): void {
setEventSource(value) {
this.eventSource = value; this.eventSource = value;
} }
@ -108,14 +101,13 @@ class EventSource {
* *
* The parameters of the listener are the sender and an <mxEventObject>. * The parameters of the listener are the sender and an <mxEventObject>.
*/ */
// addListener(name: string, funct: (...args: any[]) => any): void; addListener(name: string,
addListener(name, funct) { funct: (...args: any[]) => any): void {
if (this.eventListeners == null) { if (this.eventListeners == null) {
this.eventListeners = []; this.eventListeners = [];
} }
this.eventListeners.push({name, funct});
this.eventListeners.push(name);
this.eventListeners.push(funct);
} }
/** /**
@ -123,16 +115,15 @@ class EventSource {
* *
* Removes all occurrences of the given listener from <eventListeners>. * Removes all occurrences of the given listener from <eventListeners>.
*/ */
// removeListener(funct: (...args: any[]) => any): void; removeListener(funct: (...args: any[]) => any): void {
removeListener(funct) {
if (this.eventListeners != null) { if (this.eventListeners != null) {
let i = 0; let i = 0;
while (i < this.eventListeners.length) { while (i < this.eventListeners.length) {
if (this.eventListeners[i + 1] === funct) { if (this.eventListeners[i].funct === funct) {
this.eventListeners.splice(i, 2); this.eventListeners.splice(i, 1);
} else { } else {
i += 2; i += 1;
} }
} }
} }
@ -157,8 +148,7 @@ class EventSource {
* sender - Optional sender to be passed to the listener. Default value is * sender - Optional sender to be passed to the listener. Default value is
* the return value of <getEventSource>. * the return value of <getEventSource>.
*/ */
// fireEvent(evt: mxEventObject, sender: any): void; fireEvent(evt: EventObject, sender: any = null): void {
fireEvent(evt, sender) {
if (this.eventListeners != null && this.isEventsEnabled()) { if (this.eventListeners != null && this.isEventsEnabled()) {
if (evt == null) { if (evt == null) {
evt = new EventObject(); evt = new EventObject();
@ -167,18 +157,13 @@ class EventSource {
if (sender == null) { if (sender == null) {
sender = this.getEventSource(); sender = this.getEventSource();
} }
if (sender == null) { if (sender == null) {
sender = this; sender = this;
} }
const args = [sender, evt]; for (const eventListener of this.eventListeners) {
if (eventListener.name == null || eventListener.name === evt.getName()) {
for (let i = 0; i < this.eventListeners.length; i += 2) { eventListener.funct.apply(this, [sender, evt]);
const listen = this.eventListeners[i];
if (listen == null || listen === evt.getName()) {
this.eventListeners[i + 1].apply(this, args);
} }
} }
} }

8
packages/core/src/view/event/GraphEvents.ts
View File

@ -13,7 +13,7 @@ import {
import CellState from "../cell/datatypes/CellState"; import CellState from "../cell/datatypes/CellState";
import Cell from "../cell/datatypes/Cell"; import Cell from "../cell/datatypes/Cell";
import PanningHandler from "../panning/PanningHandler"; import PanningHandler from "../panning/PanningHandler";
import mxConnectionHandler from "../connection/mxConnectionHandler"; import ConnectionHandler from "../connection/ConnectionHandler";
import Point from "../geometry/Point"; import Point from "../geometry/Point";
import {convertPoint, getValue} from "../../util/Utils"; import {convertPoint, getValue} from "../../util/Utils";
import {NONE, SHAPE_SWIMLANE} from "../../util/Constants"; import {NONE, SHAPE_SWIMLANE} from "../../util/Constants";
@ -360,7 +360,7 @@ class GraphEvents {
me.getCell() me.getCell()
); );
const panningHandler = <PanningHandler>this.panningHandler; const panningHandler = <PanningHandler>this.panningHandler;
const connectionHandler = <mxConnectionHandler>this.connectionHandler; const connectionHandler = <ConnectionHandler>this.connectionHandler;
// LATER: Check if event should be consumed if me is consumed // LATER: Check if event should be consumed if me is consumed
this.graph.fireEvent(mxe); this.graph.fireEvent(mxe);
@ -1083,8 +1083,8 @@ class GraphEvents {
*/ */
getPointForEvent(evt: InternalMouseEvent, addOffset: boolean = true): Point { getPointForEvent(evt: InternalMouseEvent, addOffset: boolean = true): Point {
const p = convertPoint(this.container, getClientX(evt), getClientY(evt)); const p = convertPoint(this.container, getClientX(evt), getClientY(evt));
const s = this.getView().scale; const s = this.graph.view.scale;
const tr = this.getView().translate; const tr = this.graph.view.translate;
const off = addOffset ? this.gridSize / 2 : 0; const off = addOffset ? this.gridSize / 2 : 0;
p.x = this.snap(p.x / s - tr.x - off); p.x = this.snap(p.x / s - tr.x - off);

62
packages/core/src/view/event/InternalMouseEvent.js → packages/core/src/view/event/InternalMouseEvent.ts
View File

@ -6,6 +6,9 @@
*/ */
import {getClientX, getClientY, getSource, isMouseEvent, isPopupTrigger} from '../../util/EventUtils'; import {getClientX, getClientY, getSource, isMouseEvent, isPopupTrigger} from '../../util/EventUtils';
import { isAncestorNode } from '../../util/DomUtils'; import { isAncestorNode } from '../../util/DomUtils';
import CellState from '../cell/datatypes/CellState';
import Shape from '../geometry/shape/Shape';
import Cell from '../cell/datatypes/Cell';
/** /**
* Class: mxMouseEvent * Class: mxMouseEvent
@ -42,7 +45,7 @@ import { isAncestorNode } from '../../util/DomUtils';
* *
*/ */
class InternalMouseEvent { class InternalMouseEvent {
constructor(evt, state) { constructor(evt: MouseEvent, state?: CellState) {
this.evt = evt; this.evt = evt;
this.state = state; this.state = state;
this.sourceState = state; this.sourceState = state;
@ -53,16 +56,14 @@ class InternalMouseEvent {
* *
* Holds the consumed state of this event. * Holds the consumed state of this event.
*/ */
// consumed: boolean; consumed: boolean = false;
consumed = false;
/** /**
* Variable: evt * Variable: evt
* *
* Holds the inner event object. * Holds the inner event object.
*/ */
// evt: Event; evt: MouseEvent;
evt = null;
/** /**
* Variable: graphX * Variable: graphX
@ -70,8 +71,7 @@ class InternalMouseEvent {
* Holds the x-coordinate of the event in the graph. This value is set in * Holds the x-coordinate of the event in the graph. This value is set in
* <mxGraph.fireMouseEvent>. * <mxGraph.fireMouseEvent>.
*/ */
// graphX: number; graphX?: number;
graphX = null;
/** /**
* Variable: graphY * Variable: graphY
@ -79,16 +79,14 @@ class InternalMouseEvent {
* Holds the y-coordinate of the event in the graph. This value is set in * Holds the y-coordinate of the event in the graph. This value is set in
* <mxGraph.fireMouseEvent>. * <mxGraph.fireMouseEvent>.
*/ */
// graphY: number; graphY?: number;
graphY = null;
/** /**
* Variable: state * Variable: state
* *
* Holds the optional <mxCellState> associated with this event. * Holds the optional <mxCellState> associated with this event.
*/ */
// state: mxCellState; state?: CellState;
state = null;
/** /**
* Variable: sourceState * Variable: sourceState
@ -96,16 +94,14 @@ class InternalMouseEvent {
* Holds the <mxCellState> that was passed to the constructor. This can be * Holds the <mxCellState> that was passed to the constructor. This can be
* different from <state> depending on the result of <mxGraph.getEventState>. * different from <state> depending on the result of <mxGraph.getEventState>.
*/ */
// sourceState: mxCellState; sourceState?: CellState;
sourceState = null;
/** /**
* Function: getEvent * Function: getEvent
* *
* Returns <evt>. * Returns <evt>.
*/ */
// getEvent(): MouseEvent; getEvent(): MouseEvent {
getEvent() {
return this.evt; return this.evt;
} }
@ -114,8 +110,7 @@ class InternalMouseEvent {
* *
* Returns the target DOM element using <mxEvent.getSource> for <evt>. * Returns the target DOM element using <mxEvent.getSource> for <evt>.
*/ */
// getSource(): Element; getSource(): Element {
getSource() {
return getSource(this.evt); return getSource(this.evt);
} }
@ -124,12 +119,10 @@ class InternalMouseEvent {
* *
* Returns true if the given <mxShape> is the source of <evt>. * Returns true if the given <mxShape> is the source of <evt>.
*/ */
// isSource(shape: mxShape): boolean; isSource(shape: Shape): boolean {
isSource(shape) {
if (shape != null) { if (shape != null) {
return isAncestorNode(shape.node, this.getSource()); return isAncestorNode(shape.node, this.getSource());
} }
return false; return false;
} }
@ -138,8 +131,7 @@ class InternalMouseEvent {
* *
* Returns <evt.clientX>. * Returns <evt.clientX>.
*/ */
// getX(): number; getX(): number {
getX() {
return getClientX(this.getEvent()); return getClientX(this.getEvent());
} }
@ -148,8 +140,7 @@ class InternalMouseEvent {
* *
* Returns <evt.clientY>. * Returns <evt.clientY>.
*/ */
// getY(): number; getY(): number {
getY() {
return getClientY(this.getEvent()); return getClientY(this.getEvent());
} }
@ -158,8 +149,7 @@ class InternalMouseEvent {
* *
* Returns <graphX>. * Returns <graphX>.
*/ */
// getGraphX(): number; getGraphX(): number | undefined {
getGraphX() {
return this.graphX; return this.graphX;
} }
@ -168,8 +158,7 @@ class InternalMouseEvent {
* *
* Returns <graphY>. * Returns <graphY>.
*/ */
// getGraphY(): number; getGraphY(): number | undefined {
getGraphY() {
return this.graphY; return this.graphY;
} }
@ -178,8 +167,7 @@ class InternalMouseEvent {
* *
* Returns <state>. * Returns <state>.
*/ */
// getState(): mxCellState; getState(): CellState | undefined {
getState() {
return this.state; return this.state;
} }
@ -188,14 +176,11 @@ class InternalMouseEvent {
* *
* Returns the <mxCell> in <state> is not null. * Returns the <mxCell> in <state> is not null.
*/ */
// getCell(): mxCell; getCell(): Cell | null {
getCell() {
const state = this.getState(); const state = this.getState();
if (state != null) { if (state != null) {
return state.cell; return state.cell;
} }
return null; return null;
} }
@ -204,8 +189,7 @@ class InternalMouseEvent {
* *
* Returns true if the event is a popup trigger. * Returns true if the event is a popup trigger.
*/ */
// isPopupTrigger(): boolean; isPopupTrigger(): boolean {
isPopupTrigger() {
return isPopupTrigger(this.getEvent()); return isPopupTrigger(this.getEvent());
} }
@ -214,8 +198,7 @@ class InternalMouseEvent {
* *
* Returns <consumed>. * Returns <consumed>.
*/ */
// isConsumed(): boolean; isConsumed(): boolean {
isConsumed() {
return this.consumed; return this.consumed;
} }
@ -232,8 +215,7 @@ class InternalMouseEvent {
* preventDefault - Specifies if the native event should be canceled. Default * preventDefault - Specifies if the native event should be canceled. Default
* is true. * is true.
*/ */
// consume(preventDefault?: boolean): void; consume(preventDefault?: boolean): void {
consume(preventDefault) {
preventDefault = preventDefault =
preventDefault != null preventDefault != null
? preventDefault ? preventDefault

0
packages/core/src/view/event/mxCellTracker.js → packages/core/src/view/event/mxCellTracker.ts
View File

0
packages/core/src/view/event/mxKeyHandler.js → packages/core/src/view/event/mxKeyHandler.ts
View File

6
packages/core/src/view/geometry/shape/node/Stencil.ts
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import mxConnectionConstraint from '../../../connection/mxConnectionConstraint'; import ConnectionConstraint from '../../../connection/ConnectionConstraint';
import Rectangle from '../../Rectangle'; import Rectangle from '../../Rectangle';
import Shape from '../Shape'; import Shape from '../Shape';
import Resources from '../../../../util/Resources'; import Resources from '../../../../util/Resources';
@ -64,7 +64,7 @@ class Stencil extends Shape {
* *
* Holds an array of <mxConnectionConstraints> as defined in the shape. * Holds an array of <mxConnectionConstraints> as defined in the shape.
*/ */
constraints: mxConnectionConstraint[] = []; constraints: ConnectionConstraint[] = [];
/** /**
* Variable: aspect * Variable: aspect
@ -168,7 +168,7 @@ class Stencil extends Shape {
const perimeter = node.getAttribute('perimeter') == '1'; const perimeter = node.getAttribute('perimeter') == '1';
const name = node.getAttribute('name'); const name = node.getAttribute('name');
return new mxConnectionConstraint(new Point(x, y), perimeter, name); return new ConnectionConstraint(new Point(x, y), perimeter, name);
} }
/** /**

6
packages/core/src/view/layout/layout/hierarchical/model/mxGraphHierarchyModel.js
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import mxDictionary from '../../../../../util/mxDictionary'; import Dictionary from '../../../../../util/Dictionary';
import mxGraphHierarchyNode from './mxGraphHierarchyNode'; import mxGraphHierarchyNode from './mxGraphHierarchyNode';
import mxGraphHierarchyEdge from './mxGraphHierarchyEdge'; import mxGraphHierarchyEdge from './mxGraphHierarchyEdge';
@ -42,8 +42,8 @@ class mxGraphHierarchyModel {
// map of cells to internal cell needed for second run through // map of cells to internal cell needed for second run through
// to setup the sink of edges correctly // to setup the sink of edges correctly
this.vertexMapper = new mxDictionary(); this.vertexMapper = new Dictionary();
this.edgeMapper = new mxDictionary(); this.edgeMapper = new Dictionary();
this.maxRank = 0; this.maxRank = 0;
const internalVertices = []; const internalVertices = [];

4
packages/core/src/view/layout/layout/hierarchical/model/mxSwimlaneModel.js
View File

@ -42,8 +42,8 @@ class mxSwimlaneModel {
// map of cells to internal cell needed for second run through // map of cells to internal cell needed for second run through
// to setup the sink of edges correctly // to setup the sink of edges correctly
this.vertexMapper = new mxDictionary(); this.vertexMapper = new Dictionary();
this.edgeMapper = new mxDictionary(); this.edgeMapper = new Dictionary();
this.maxRank = 0; this.maxRank = 0;
const internalVertices = []; const internalVertices = [];

8
packages/core/src/view/layout/layout/hierarchical/mxHierarchicalLayout.js
View File

@ -7,7 +7,7 @@
import mxGraphLayout from '../mxGraphLayout'; import mxGraphLayout from '../mxGraphLayout';
import { DIRECTION_NORTH } from '../../../../util/Constants'; import { DIRECTION_NORTH } from '../../../../util/Constants';
import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle';
import mxDictionary from '../../../../util/mxDictionary'; import Dictionary from '../../../../util/Dictionary';
import mxGraphHierarchyModel from './model/mxGraphHierarchyModel'; import mxGraphHierarchyModel from './model/mxGraphHierarchyModel';
import mxObjectIdentity from '../../../../util/mxObjectIdentity'; import mxObjectIdentity from '../../../../util/mxObjectIdentity';
import mxMinimumCycleRemover from './stage/mxMinimumCycleRemover'; import mxMinimumCycleRemover from './stage/mxMinimumCycleRemover';
@ -208,9 +208,9 @@ class mxHierarchicalLayout extends mxGraphLayout {
execute(parent, roots) { execute(parent, roots) {
this.parent = parent; this.parent = parent;
const { model } = this.graph; const { model } = this.graph;
this.edgesCache = new mxDictionary(); this.edgesCache = new Dictionary();
this.edgeSourceTermCache = new mxDictionary(); this.edgeSourceTermCache = new Dictionary();
this.edgesTargetTermCache = new mxDictionary(); this.edgesTargetTermCache = new Dictionary();
if (roots != null && !(roots instanceof Array)) { if (roots != null && !(roots instanceof Array)) {
roots = [roots]; roots = [roots];

8
packages/core/src/view/layout/layout/hierarchical/mxSwimlaneLayout.js
View File

@ -8,7 +8,7 @@
import mxGraphLayout from '../mxGraphLayout'; import mxGraphLayout from '../mxGraphLayout';
import { DIRECTION_NORTH } from '../../../../util/Constants'; import { DIRECTION_NORTH } from '../../../../util/Constants';
import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle';
import mxDictionary from '../../../../util/mxDictionary'; import Dictionary from '../../../../util/Dictionary';
import Rectangle from '../../../geometry/Rectangle'; import Rectangle from '../../../geometry/Rectangle';
import mxSwimlaneModel from './model/mxSwimlaneModel'; import mxSwimlaneModel from './model/mxSwimlaneModel';
import mxObjectIdentity from '../../../../util/mxObjectIdentity'; import mxObjectIdentity from '../../../../util/mxObjectIdentity';
@ -223,9 +223,9 @@ class mxSwimlaneLayout extends mxGraphLayout {
execute(parent, swimlanes) { execute(parent, swimlanes) {
this.parent = parent; this.parent = parent;
const { model } = this.graph; const { model } = this.graph;
this.edgesCache = new mxDictionary(); this.edgesCache = new Dictionary();
this.edgeSourceTermCache = new mxDictionary(); this.edgeSourceTermCache = new Dictionary();
this.edgesTargetTermCache = new mxDictionary(); this.edgesTargetTermCache = new Dictionary();
// If the roots are set and the parent is set, only // If the roots are set and the parent is set, only
// use the roots that are some dependent of the that // use the roots that are some dependent of the that

4
packages/core/src/view/layout/layout/hierarchical/stage/mxCoordinateAssignment.js
View File

@ -13,7 +13,7 @@ import {
} from '../../../../../util/Constants'; } from '../../../../../util/Constants';
import mxLog from '../../../../../util/gui/mxLog'; import mxLog from '../../../../../util/gui/mxLog';
import WeightedCellSorter from '../../WeightedCellSorter'; import WeightedCellSorter from '../../WeightedCellSorter';
import mxDictionary from '../../../../../util/mxDictionary'; import Dictionary from '../../../../../util/Dictionary';
import Point from '../../../../geometry/Point'; import Point from '../../../../geometry/Point';
import mxHierarchicalEdgeStyle from '../mxHierarchicalEdgeStyle'; import mxHierarchicalEdgeStyle from '../mxHierarchicalEdgeStyle';
@ -331,7 +331,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage {
const nodeList = []; const nodeList = [];
// Need to be able to map from cell to cellWrapper // Need to be able to map from cell to cellWrapper
const map = new mxDictionary(); const map = new Dictionary();
const rank = []; const rank = [];
for (let i = 0; i <= model.maxRank; i += 1) { for (let i = 0; i <= model.maxRank; i += 1) {

4
packages/core/src/view/layout/layout/mxCompactTreeLayout.js
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import mxDictionary from '../../../util/mxDictionary'; import Dictionary from '../../../util/Dictionary';
import Point from '../../geometry/Point'; import Point from '../../geometry/Point';
import mxGraphLayout from './mxGraphLayout'; import mxGraphLayout from './mxGraphLayout';
import CellPath from '../../cell/datatypes/CellPath'; import CellPath from '../../cell/datatypes/CellPath';
@ -414,7 +414,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
*/ */
// sortOutgoingEdges(source: mxCell, edges: Array<mxCell>): void; // sortOutgoingEdges(source: mxCell, edges: Array<mxCell>): void;
sortOutgoingEdges(source, edges) { sortOutgoingEdges(source, edges) {
const lookup = new mxDictionary(); const lookup = new Dictionary();
edges.sort((e1, e2) => { edges.sort((e1, e2) => {
const end1 = e1.getTerminal(e1.getTerminal(false) == source); const end1 = e1.getTerminal(e1.getTerminal(false) == source);

6
packages/core/src/view/layout/layout/mxGraphLayout.js
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import mxDictionary from '../../../util/mxDictionary'; import Dictionary from '../../../util/Dictionary';
import Rectangle from '../../geometry/Rectangle'; import Rectangle from '../../geometry/Rectangle';
import Geometry from '../../geometry/Geometry'; import Geometry from '../../geometry/Geometry';
import Point from '../../geometry/Point'; import Point from '../../geometry/Point';
@ -136,13 +136,13 @@ class mxGraphLayout {
* edge as arguments. The traversal stops if the function returns false. * edge as arguments. The traversal stops if the function returns false.
* @param edge Optional {@link mxCell} that represents the incoming edge. This is * @param edge Optional {@link mxCell} that represents the incoming edge. This is
* null for the first step of the traversal. * null for the first step of the traversal.
* @param visited Optional {@link mxDictionary} of cell paths for the visited cells. * @param visited Optional {@link Dictionary} of cell paths for the visited cells.
*/ */
// traverse(vertex: mxCell, directed?: boolean, func?: Function, edge?: mxCell, visited?: mxDictionary): void; // traverse(vertex: mxCell, directed?: boolean, func?: Function, edge?: mxCell, visited?: mxDictionary): void;
traverse(vertex, directed, func, edge, visited) { traverse(vertex, directed, func, edge, visited) {
if (func != null && vertex != null) { if (func != null && vertex != null) {
directed = directed != null ? directed : true; directed = directed != null ? directed : true;
visited = visited || new mxDictionary(); visited = visited || new Dictionary();
if (!visited.get(vertex)) { if (!visited.get(vertex)) {
visited.put(vertex, true); visited.put(vertex, true);

37
packages/core/src/view/model/Model.ts
View File

@ -223,46 +223,39 @@ class Model extends EventSource {
* layers of the diagram as child cells. That is, the actual elements of the * layers of the diagram as child cells. That is, the actual elements of the
* diagram are supposed to live in the third generation of cells and below. * diagram are supposed to live in the third generation of cells and below.
*/ */
// root: mxCell;
root: Cell | null = null; root: Cell | null = null;
/** /**
* Maps from Ids to cells. * Maps from Ids to cells.
*/ */
// cells: any;
cells: any = {}; cells: any = {};
/** /**
* Specifies if edges should automatically be moved into the nearest common * Specifies if edges should automatically be moved into the nearest common
* ancestor of their terminals. Default is true. * ancestor of their terminals. Default is true.
*/ */
// maintainEdgeParent: boolean;
maintainEdgeParent: boolean = true; maintainEdgeParent: boolean = true;
/** /**
* Specifies if relative edge parents should be ignored for finding the nearest * Specifies if relative edge parents should be ignored for finding the nearest
* common ancestors of an edge's terminals. Default is true. * common ancestors of an edge's terminals. Default is true.
*/ */
// ignoreRelativeEdgeParent: boolean;
ignoreRelativeEdgeParent: boolean = true; ignoreRelativeEdgeParent: boolean = true;
/** /**
* Specifies if the model should automatically create Ids for new cells. * Specifies if the model should automatically create Ids for new cells.
* Default is true. * Default is true.
*/ */
// createIds: boolean;
createIds: boolean = true; createIds: boolean = true;
/** /**
* Defines the prefix of new Ids. Default is an empty string. * Defines the prefix of new Ids. Default is an empty string.
*/ */
// prefix: string;
prefix: string = ''; prefix: string = '';
/** /**
* Defines the postfix of new Ids. Default is an empty string. * Defines the postfix of new Ids. Default is an empty string.
*/ */
// postfix: string;
postfix: string = ''; postfix: string = '';
/** /**
@ -276,7 +269,6 @@ class Model extends EventSource {
* closed then a new object is created for this variable using * closed then a new object is created for this variable using
* {@link createUndoableEdit}. * {@link createUndoableEdit}.
*/ */
// currentEdit: any;
currentEdit: any = null; currentEdit: any = null;
/** /**
@ -285,19 +277,16 @@ class Model extends EventSource {
* it. When the counter reaches 0, the transaction is closed and the * it. When the counter reaches 0, the transaction is closed and the
* respective events are fired. Initial value is 0. * respective events are fired. Initial value is 0.
*/ */
// updateLevel: number;
updateLevel: number = 0; updateLevel: number = 0;
/** /**
* True if the program flow is currently inside endUpdate. * True if the program flow is currently inside endUpdate.
*/ */
// endingUpdate: boolean;
endingUpdate: boolean = false; endingUpdate: boolean = false;
/** /**
* Sets a new root using {@link createRoot}. * Sets a new root using {@link createRoot}.
*/ */
// clear(): void;
clear(): void { clear(): void {
this.setRoot(this.createRoot()); this.setRoot(this.createRoot());
} }
@ -305,7 +294,6 @@ class Model extends EventSource {
/** /**
* Returns {@link createIds}. * Returns {@link createIds}.
*/ */
// isCreateIds(): boolean;
isCreateIds(): boolean { isCreateIds(): boolean {
return this.createIds; return this.createIds;
} }
@ -313,7 +301,6 @@ class Model extends EventSource {
/** /**
* Sets {@link createIds}. * Sets {@link createIds}.
*/ */
// setCreateIds(value: boolean): void;
setCreateIds(value: boolean): void { setCreateIds(value: boolean): void {
this.createIds = value; this.createIds = value;
} }
@ -321,7 +308,6 @@ class Model extends EventSource {
/** /**
* Creates a new root cell with a default layer (child 0). * Creates a new root cell with a default layer (child 0).
*/ */
// createRoot(): mxCell;
createRoot(): Cell { createRoot(): Cell {
const cell = new Cell(); const cell = new Cell();
cell.insert(new Cell()); cell.insert(new Cell());
@ -334,7 +320,6 @@ class Model extends EventSource {
* *
* @param {string} id A string representing the Id of the cell. * @param {string} id A string representing the Id of the cell.
*/ */
// getCell(id: string): mxCell;
getCell(id: string): Cell | null { getCell(id: string): Cell | null {
return this.cells != null ? this.cells[id] : null; return this.cells != null ? this.cells[id] : null;
} }
@ -364,7 +349,6 @@ class Model extends EventSource {
* *
* @param {Cell} root that specifies the new root. * @param {Cell} root that specifies the new root.
*/ */
// setRoot(root: mxCell): mxCell;
setRoot(root: Cell | null): Cell | null { setRoot(root: Cell | null): Cell | null {
this.execute(new RootChange(this, root)); this.execute(new RootChange(this, root));
return root; return root;
@ -513,7 +497,6 @@ class Model extends EventSource {
* *
* @param {Cell} cell to create the Id for. * @param {Cell} cell to create the Id for.
*/ */
// createId(cell: mxCell): string;
createId(cell: Cell): string { createId(cell: Cell): string {
const id = this.nextId; const id = this.nextId;
this.nextId++; this.nextId++;
@ -524,7 +507,6 @@ class Model extends EventSource {
* Updates the parent for all edges that are connected to cell or one of * Updates the parent for all edges that are connected to cell or one of
* its descendants using {@link updateEdgeParent}. * its descendants using {@link updateEdgeParent}.
*/ */
// updateEdgeParents(cell: mxCell, root: mxCell): void;
updateEdgeParents(cell: Cell, updateEdgeParents(cell: Cell,
root: Cell=<Cell>this.getRoot(cell)): void { root: Cell=<Cell>this.getRoot(cell)): void {
@ -563,7 +545,6 @@ class Model extends EventSource {
* @param {Cell} edge that specifies the edge. * @param {Cell} edge that specifies the edge.
* @param {Cell} root that represents the current root of the model. * @param {Cell} root that represents the current root of the model.
*/ */
// updateEdgeParent(edge: mxCell, root: mxCell): void;
updateEdgeParent(edge: Cell, updateEdgeParent(edge: Cell,
root: Cell): void { root: Cell): void {
@ -630,8 +611,7 @@ class Model extends EventSource {
* *
* @param {Cell} cell that should be removed. * @param {Cell} cell that should be removed.
*/ */
// remove(cell: mxCell): mxCell; remove(cell: Cell): Cell {
remove(cell: Cell) {
if (cell === this.root) { if (cell === this.root) {
this.setRoot(null); this.setRoot(null);
} else if (cell.getParent() != null) { } else if (cell.getParent() != null) {
@ -645,8 +625,7 @@ class Model extends EventSource {
* *
* @param {Cell} cell that specifies the cell that has been removed. * @param {Cell} cell that specifies the cell that has been removed.
*/ */
// cellRemoved(cell: mxCell): void; cellRemoved(cell: Cell): void {
cellRemoved(cell: Cell) {
if (cell != null && this.cells != null) { if (cell != null && this.cells != null) {
// Recursively processes child cells // Recursively processes child cells
const childCount = cell.getChildCount(); const childCount = cell.getChildCount();
@ -890,9 +869,8 @@ class Model extends EventSource {
* @param style String of the form [stylename;|key=value;] to specify * @param style String of the form [stylename;|key=value;] to specify
* the new cell style. * the new cell style.
*/ */
// setStyle(cell: mxCell, style: string): string;
setStyle(cell: Cell, setStyle(cell: Cell,
style: any): any { style: string): string {
if (style !== cell.getStyle()) { if (style !== cell.getStyle()) {
this.execute(new StyleChange(this, cell, style)); this.execute(new StyleChange(this, cell, style));
@ -908,7 +886,6 @@ class Model extends EventSource {
* @param style String of the form [stylename;|key=value;] to specify * @param style String of the form [stylename;|key=value;] to specify
* the new cell style. * the new cell style.
*/ */
// styleForCellChanged(cell: mxCell, style: string): string;
styleForCellChanged(cell: Cell, styleForCellChanged(cell: Cell,
style: string): string | null { style: string): string | null {
@ -956,9 +933,8 @@ class Model extends EventSource {
* @param {Cell} cell whose visible state should be changed. * @param {Cell} cell whose visible state should be changed.
* @param visible Boolean that specifies the new visible state. * @param visible Boolean that specifies the new visible state.
*/ */
// setVisible(cell: mxCell, visible: boolean): boolean;
setVisible(cell: Cell, setVisible(cell: Cell,
visible: boolean) { visible: boolean): boolean {
if (visible !== cell.isVisible()) { if (visible !== cell.isVisible()) {
this.execute(new VisibleChange(this, cell, visible)); this.execute(new VisibleChange(this, cell, visible));
@ -974,7 +950,6 @@ class Model extends EventSource {
* @param {Cell} cell that specifies the cell to be updated. * @param {Cell} cell that specifies the cell to be updated.
* @param visible Boolean that specifies the new visible state. * @param visible Boolean that specifies the new visible state.
*/ */
// visibleStateForCellChanged(cell: mxCell, visible: boolean): boolean;
visibleStateForCellChanged(cell: Cell, visibleStateForCellChanged(cell: Cell,
visible: boolean): boolean { visible: boolean): boolean {
const previous = cell.isVisible(); const previous = cell.isVisible();
@ -993,7 +968,6 @@ class Model extends EventSource {
* *
* @param change Object that described the change. * @param change Object that described the change.
*/ */
// execute(change: any): void;
execute(change: any): void { execute(change: any): void {
change.execute(); change.execute();
this.beginUpdate(); this.beginUpdate();
@ -1041,7 +1015,6 @@ class Model extends EventSource {
* graph.addCells([v1, v2]). * graph.addCells([v1, v2]).
* ``` * ```
*/ */
// beginUpdate(): void;
beginUpdate(): void { beginUpdate(): void {
this.updateLevel += 1; this.updateLevel += 1;
this.fireEvent(new EventObject(InternalEvent.BEGIN_UPDATE)); this.fireEvent(new EventObject(InternalEvent.BEGIN_UPDATE));
@ -1063,7 +1036,6 @@ class Model extends EventSource {
* function is invoked, that is, on undo and redo of * function is invoked, that is, on undo and redo of
* the edit. * the edit.
*/ */
// endUpdate(): void;
endUpdate(): void { endUpdate(): void {
this.updateLevel -= 1; this.updateLevel -= 1;
@ -1226,7 +1198,6 @@ class Model extends EventSource {
* *
* @param {Cell} cell to be cloned. * @param {Cell} cell to be cloned.
*/ */
// cloneCell(cell: mxCell): mxCell;
cloneCell(cell: Cell | null, cloneCell(cell: Cell | null,
includeChildren: boolean): Cell | null { includeChildren: boolean): Cell | null {
if (cell != null) { if (cell != null) {

120
packages/core/src/view/selection/mxRubberband.js → packages/core/src/view/selection/RubberBand.ts
View File

@ -3,7 +3,7 @@
* Copyright (c) 2006-2016, Gaudenz Alder * Copyright (c) 2006-2016, Gaudenz Alder
*/ */
import utils from '../../util/Utils'; import utils, { getOffset, getScrollOrigin } from '../../util/Utils';
import InternalEvent from '../event/InternalEvent'; import InternalEvent from '../event/InternalEvent';
import Point from '../geometry/Point'; import Point from '../geometry/Point';
import InternalMouseEvent from '../event/InternalMouseEvent'; import InternalMouseEvent from '../event/InternalMouseEvent';
@ -11,61 +11,65 @@ import mxClient from '../../mxClient';
import Rectangle from '../geometry/Rectangle'; import Rectangle from '../geometry/Rectangle';
import { isAltDown, isMultiTouchEvent } from '../../util/EventUtils'; import { isAltDown, isMultiTouchEvent } from '../../util/EventUtils';
import { clearSelection } from '../../util/DomUtils'; import { clearSelection } from '../../util/DomUtils';
import Graph from '../Graph';
/** /**
* Event handler that selects rectangular regions. * Event handler that selects rectangular regions.
* This is not built-into [mxGraph]. * This is not built-into [mxGraph].
* To enable rubberband selection in a graph, use the following code. * To enable rubberband selection in a graph, use the following code.
*/ */
class mxRubberband { class RubberBand {
constructor(graph) { forceRubberbandHandler: Function;
if (graph != null) { panHandler: Function;
this.graph = graph; gestureHandler: Function;
this.graph.addMouseListener(this); graph: Graph;
first: Point | null = null;
destroyed: boolean = false;
dragHandler?: Function;
dropHandler?: Function;
// Handles force rubberband event constructor(graph: Graph) {
this.forceRubberbandHandler = (sender, evt) => { this.graph = graph;
const evtName = evt.getProperty('eventName'); this.graph.addMouseListener(this);
const me = evt.getProperty('event');
if (evtName === InternalEvent.MOUSE_DOWN && this.isForceRubberbandEvent(me)) { // Handles force rubberband event
const offset = utils.getOffset(this.graph.container); this.forceRubberbandHandler = (sender, evt) => {
const origin = utils.getScrollOrigin(this.graph.container); const evtName = evt.getProperty('eventName');
origin.x -= offset.x; const me = evt.getProperty('event');
origin.y -= offset.y;
this.start(me.getX() + origin.x, me.getY() + origin.y);
me.consume(false);
}
};
this.graph.addListener( if (evtName === InternalEvent.MOUSE_DOWN && this.isForceRubberbandEvent(me)) {
InternalEvent.FIRE_MOUSE_EVENT, const offset = getOffset(this.graph.container);
this.forceRubberbandHandler const origin = getScrollOrigin(this.graph.container);
); origin.x -= offset.x;
origin.y -= offset.y;
this.start(me.getX() + origin.x, me.getY() + origin.y);
me.consume(false);
}
};
// Repaints the marquee after autoscroll this.graph.addListener(InternalEvent.FIRE_MOUSE_EVENT, this.forceRubberbandHandler);
this.panHandler = () => {
this.repaint();
};
this.graph.addListener(InternalEvent.PAN, this.panHandler); // Repaints the marquee after autoscroll
this.panHandler = () => {
this.repaint();
};
// Does not show menu if any touch gestures take place after the trigger this.graph.addListener(InternalEvent.PAN, this.panHandler);
this.gestureHandler = (sender, eo) => {
if (this.first != null) {
this.reset();
}
};
this.graph.addListener(InternalEvent.GESTURE, this.gestureHandler); // Does not show menu if any touch gestures take place after the trigger
} this.gestureHandler = (sender, eo) => {
if (this.first != null) {
this.reset();
}
};
this.graph.addListener(InternalEvent.GESTURE, this.gestureHandler);
} }
/** /**
* Specifies the default opacity to be used for the rubberband div. Default is 20. * Specifies the default opacity to be used for the rubberband div. Default is 20.
*/ */
// defaultOpacity: number; defaultOpacity: number = 20;
defaultOpacity = 20;
/** /**
* Variable: enabled * Variable: enabled
@ -105,14 +109,12 @@ class mxRubberband {
/** /**
* Optional fade out effect. Default is false. * Optional fade out effect. Default is false.
*/ */
// fadeOut: boolean; fadeOut: boolean = false;
fadeOut = false;
/** /**
* Creates the rubberband selection shape. * Creates the rubberband selection shape.
*/ */
// isEnabled(): boolean; isEnabled(): boolean {
isEnabled() {
return this.enabled; return this.enabled;
} }
@ -122,7 +124,7 @@ class mxRubberband {
* Enables or disables event handling. This implementation updates * Enables or disables event handling. This implementation updates
* <enabled>. * <enabled>.
*/ */
setEnabled(enabled) { setEnabled(enabled: boolean) {
this.enabled = enabled; this.enabled = enabled;
} }
@ -132,7 +134,7 @@ class mxRubberband {
* Returns true if the given <mxMouseEvent> should start rubberband selection. * Returns true if the given <mxMouseEvent> should start rubberband selection.
* This implementation returns true if the alt key is pressed. * This implementation returns true if the alt key is pressed.
*/ */
isForceRubberbandEvent(me) { isForceRubberbandEvent(me: InternalMouseEvent) {
return isAltDown(me.getEvent()); return isAltDown(me.getEvent());
} }
@ -143,7 +145,8 @@ class mxRubberband {
* event all subsequent events of the gesture are redirected to this * event all subsequent events of the gesture are redirected to this
* handler. * handler.
*/ */
mouseDown(sender, me) { mouseDown(sender: any,
me: InternalMouseEvent): void {
if ( if (
!me.isConsumed() && !me.isConsumed() &&
this.isEnabled() && this.isEnabled() &&
@ -169,8 +172,7 @@ class mxRubberband {
/** /**
* Creates the rubberband selection shape. * Creates the rubberband selection shape.
*/ */
// start(x: number, y: number): void; start(x: number, y: number): void {
start(x, y) {
this.first = new Point(x, y); this.first = new Point(x, y);
const { container } = this.graph; const { container } = this.graph;
@ -185,11 +187,11 @@ class mxRubberband {
return me; return me;
} }
this.dragHandler = evt => { this.dragHandler = (evt) => {
this.mouseMove(this.graph, createMouseEvent(evt)); this.mouseMove(this.graph, createMouseEvent(evt));
}; };
this.dropHandler = evt => { this.dropHandler = (evt) => {
this.mouseUp(this.graph, createMouseEvent(evt)); this.mouseUp(this.graph, createMouseEvent(evt));
}; };
@ -209,10 +211,12 @@ class mxRubberband {
* *
* Handles the event by updating therubberband selection. * Handles the event by updating therubberband selection.
*/ */
mouseMove(sender, me) { mouseMove(sender: any,
me: InternalMouseEvent): void {
if (!me.isConsumed() && this.first != null) { if (!me.isConsumed() && this.first != null) {
const origin = utils.getScrollOrigin(this.graph.container); const origin = getScrollOrigin(this.graph.container);
const offset = utils.getOffset(this.graph.container); const offset = getOffset(this.graph.container);
origin.x -= offset.x; origin.x -= offset.x;
origin.y -= offset.y; origin.y -= offset.y;
const x = me.getX() + origin.x; const x = me.getX() + origin.x;
@ -239,8 +243,7 @@ class mxRubberband {
/** /**
* Creates the rubberband selection shape. * Creates the rubberband selection shape.
*/ */
// createShape(): HTMLElement; createShape(): HTMLElement {
createShape() {
if (this.sharedDiv == null) { if (this.sharedDiv == null) {
this.sharedDiv = document.createElement('div'); this.sharedDiv = document.createElement('div');
this.sharedDiv.className = 'mxRubberband'; this.sharedDiv.className = 'mxRubberband';
@ -262,7 +265,8 @@ class mxRubberband {
* *
* Returns true if this handler is active. * Returns true if this handler is active.
*/ */
isActive(sender, me) { isActive(sender: any,
me: InternalMouseEvent): boolean {
return this.div != null && this.div.style.display !== 'none'; return this.div != null && this.div.style.display !== 'none';
} }
@ -272,7 +276,9 @@ class mxRubberband {
* Handles the event by selecting the region of the rubberband using * Handles the event by selecting the region of the rubberband using
* <mxGraph.selectRegion>. * <mxGraph.selectRegion>.
*/ */
mouseUp(sender, me) { mouseUp(sender: any,
me: InternalMouseEvent): void {
const active = this.isActive(); const active = this.isActive();
this.reset(); this.reset();
@ -388,4 +394,4 @@ class mxRubberband {
} }
} }
export default mxRubberband; export default RubberBand;

12
packages/core/src/view/selection/Selection.ts
View File

@ -3,11 +3,11 @@ import CellArray from "../cell/datatypes/CellArray";
import Rectangle from "../geometry/Rectangle"; import Rectangle from "../geometry/Rectangle";
import InternalMouseEvent from "../event/InternalMouseEvent"; import InternalMouseEvent from "../event/InternalMouseEvent";
import CellState from "../cell/datatypes/CellState"; import CellState from "../cell/datatypes/CellState";
import mxEdgeHandler from "../cell/edge/mxEdgeHandler"; import EdgeHandler from "../cell/edge/EdgeHandler";
import mxVertexHandler from "../cell/vertex/mxVertexHandler"; import VertexHandler from "../cell/vertex/VertexHandler";
import EdgeStyle from "../style/EdgeStyle"; import EdgeStyle from "../style/EdgeStyle";
import mxEdgeSegmentHandler from "../cell/edge/mxEdgeSegmentHandler"; import EdgeSegmentHandler from "../cell/edge/EdgeSegmentHandler";
import mxElbowEdgeHandler from "../cell/edge/mxElbowEdgeHandler"; import ElbowEdgeHandler from "../cell/edge/ElbowEdgeHandler";
import graph from "../Graph"; import graph from "../Graph";
import mxClient from "../../mxClient"; import mxClient from "../../mxClient";
import SelectionChange from "./SelectionChange"; import SelectionChange from "./SelectionChange";
@ -15,7 +15,7 @@ import mxUndoableEdit from "../model/mxUndoableEdit";
import EventObject from "../event/EventObject"; import EventObject from "../event/EventObject";
import InternalEvent from "../event/InternalEvent"; import InternalEvent from "../event/InternalEvent";
import EventSource from "../event/EventSource"; import EventSource from "../event/EventSource";
import mxDictionary from "../../util/mxDictionary"; import Dictionary from "../../util/Dictionary";
import RootChange from "../model/RootChange"; import RootChange from "../model/RootChange";
import ChildChange from "../model/ChildChange"; import ChildChange from "../model/ChildChange";
@ -631,7 +631,7 @@ class Selection extends EventSource {
changes: any[], changes: any[],
ignoreFn: Function | null = null ignoreFn: Function | null = null
): CellArray { ): CellArray {
const dict = new mxDictionary(); const dict = new Dictionary();
const cells: CellArray = new CellArray(); const cells: CellArray = new CellArray();
const addCell = (cell: Cell) => { const addCell = (cell: Cell) => {

22
packages/core/src/view/selection/mxSelectionCellsHandler.js
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project * Type definitions from the typed-mxgraph project
*/ */
import EventSource from '../event/EventSource'; import EventSource from '../event/EventSource';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import EventObject from '../event/EventObject'; import EventObject from '../event/EventObject';
import InternalEvent from '../event/InternalEvent'; import InternalEvent from '../event/InternalEvent';
import utils from '../../util/Utils'; import utils from '../../util/Utils';
@ -37,7 +37,7 @@ class mxSelectionCellsHandler extends EventSource {
super(); super();
this.graph = graph; this.graph = graph;
this.handlers = new mxDictionary(); this.handlers = new Dictionary();
this.graph.addMouseListener(this); this.graph.addMouseListener(this);
this.refreshHandler = (sender, evt) => { this.refreshHandler = (sender, evt) => {
@ -46,9 +46,7 @@ class mxSelectionCellsHandler extends EventSource {
} }
}; };
this.graph this.graph.getSelectionModel().addListener(InternalEvent.CHANGE, this.refreshHandler);
.getSelectionModel()
.addListener(InternalEvent.CHANGE, this.refreshHandler);
this.graph.getModel().addListener(InternalEvent.CHANGE, this.refreshHandler); this.graph.getModel().addListener(InternalEvent.CHANGE, this.refreshHandler);
this.graph.getView().addListener(InternalEvent.SCALE, this.refreshHandler); this.graph.getView().addListener(InternalEvent.SCALE, this.refreshHandler);
this.graph.getView().addListener(InternalEvent.TRANSLATE, this.refreshHandler); this.graph.getView().addListener(InternalEvent.TRANSLATE, this.refreshHandler);
@ -168,7 +166,7 @@ class mxSelectionCellsHandler extends EventSource {
refresh() { refresh() {
// Removes all existing handlers // Removes all existing handlers
const oldHandlers = this.handlers; const oldHandlers = this.handlers;
this.handlers = new mxDictionary(); this.handlers = new Dictionary();
// Creates handles for all selection cells // Creates handles for all selection cells
const tmp = utils.sortCells(this.getHandledSelectionCells(), false); const tmp = utils.sortCells(this.getHandledSelectionCells(), false);
@ -200,14 +198,10 @@ class mxSelectionCellsHandler extends EventSource {
} }
// Destroys unused handlers // Destroys unused handlers
oldHandlers.visit( oldHandlers.visit((key, handler) => {
(key, handler) => { this.fireEvent(new EventObject(InternalEvent.REMOVE, 'state', handler.state));
this.fireEvent( handler.destroy();
new EventObject(InternalEvent.REMOVE, 'state', handler.state) });
);
handler.destroy();
}
);
// Creates new handlers and updates parent highlight on existing handlers // Creates new handlers and updates parent highlight on existing handlers
for (let i = 0; i < tmp.length; i += 1) { for (let i = 0; i < tmp.length; i += 1) {

4
packages/core/src/view/terminal/GraphTerminal.ts
View File

@ -1,6 +1,6 @@
import CellArray from "../cell/datatypes/CellArray"; import CellArray from "../cell/datatypes/CellArray";
import Cell from "../cell/datatypes/Cell"; import Cell from "../cell/datatypes/Cell";
import mxDictionary from "../../util/mxDictionary"; import Dictionary from "../../util/Dictionary";
class GraphTerminal { class GraphTerminal {
/***************************************************************************** /*****************************************************************************
@ -47,7 +47,7 @@ class GraphTerminal {
const terminals = new CellArray(); const terminals = new CellArray();
// Fast lookup to avoid duplicates in terminals array // Fast lookup to avoid duplicates in terminals array
const dict = new mxDictionary(); const dict = new Dictionary();
for (let i = 0; i < edges.length; i += 1) { for (let i = 0; i < edges.length; i += 1) {
const state = this.view.getState(edges[i]); const state = this.view.getState(edges[i]);

14
packages/core/src/view/view/GraphView.ts
View File

@ -7,7 +7,7 @@
import Point from '../geometry/Point'; import Point from '../geometry/Point';
import Rectangle from '../geometry/Rectangle'; import Rectangle from '../geometry/Rectangle';
import mxDictionary from '../../util/mxDictionary'; import Dictionary from '../../util/Dictionary';
import EventSource from '../event/EventSource'; import EventSource from '../event/EventSource';
import EventObject from '../event/EventObject'; import EventObject from '../event/EventObject';
import RectangleShape from '../geometry/shape/node/RectangleShape'; import RectangleShape from '../geometry/shape/node/RectangleShape';
@ -45,7 +45,7 @@ import CurrentRootChange from './CurrentRootChange';
import Model from '../model/Model'; import Model from '../model/Model';
import Shape from '../geometry/shape/Shape'; import Shape from '../geometry/shape/Shape';
import Geometry from '../geometry/Geometry'; import Geometry from '../geometry/Geometry';
import mxConnectionConstraint from '../connection/mxConnectionConstraint'; import ConnectionConstraint from '../connection/ConnectionConstraint';
import PopupMenuHandler from '../popups_menus/PopupMenuHandler'; import PopupMenuHandler from '../popups_menus/PopupMenuHandler';
import { import {
getClientX, getClientX,
@ -178,7 +178,7 @@ class GraphView extends EventSource {
*/ */
translate = new Point(); translate = new Point();
states = new mxDictionary<CellState>(); states = new Dictionary<CellState>();
/** /**
* Specifies if the style should be updated in each validation step. If this * Specifies if the style should be updated in each validation step. If this
@ -319,7 +319,7 @@ class GraphView extends EventSource {
* Sets {@link states}. * Sets {@link states}.
*/ */
// setStates(value: mxDictionary<mxCellState>): void; // setStates(value: mxDictionary<mxCellState>): void;
setStates(value: mxDictionary): void { setStates(value: Dictionary): void {
this.states = value; this.states = value;
} }
@ -1240,7 +1240,7 @@ class GraphView extends EventSource {
edge: CellState, edge: CellState,
terminal: CellState, terminal: CellState,
source: boolean, source: boolean,
constraint: mxConnectionConstraint constraint: ConnectionConstraint
) { ) {
edge.setAbsoluteTerminalPoint( edge.setAbsoluteTerminalPoint(
<Point>this.getFixedTerminalPoint(edge, terminal, source, constraint), <Point>this.getFixedTerminalPoint(edge, terminal, source, constraint),
@ -1264,7 +1264,7 @@ class GraphView extends EventSource {
edge: CellState, edge: CellState,
terminal: CellState, terminal: CellState,
source: boolean, source: boolean,
constraint: mxConnectionConstraint constraint: ConnectionConstraint
): Point | null { ): Point | null {
let pt = null; let pt = null;
@ -2155,7 +2155,7 @@ class GraphView extends EventSource {
* this returns {@link states}. * this returns {@link states}.
*/ */
// getCellStates(cells: mxCellArray): mxCellState[]; // getCellStates(cells: mxCellArray): mxCellState[];
getCellStates(cells: CellArray | null): CellState[] | mxDictionary | null { getCellStates(cells: CellArray | null): CellState[] | Dictionary | null {
if (cells == null) { if (cells == null) {
return this.states; return this.states;
} }

2
packages/html/stories/JsonData.stories.js
View File

@ -63,7 +63,7 @@ const Template = ({ label, ...args }) => {
// Enables rubberband selection // Enables rubberband selection
if (args.rubberBand) if (args.rubberBand)
new mxRubberband(graph); new RubberBand(graph);
// Gets the default parent for inserting new cells. This // Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0). // is normally the first child of the root (ie. layer 0).

2
packages/html/stories/UserObject.stories.js
View File

@ -155,7 +155,7 @@ const Template = ({ label, ...args }) => {
// Enables rubberband selection // Enables rubberband selection
if (args.rubberBand) if (args.rubberBand)
new mxRubberband(graph); new RubberBand(graph);
const buttons = document.createElement('div'); const buttons = document.createElement('div');
div.appendChild(buttons); div.appendChild(buttons);