diff --git a/.prettierrc b/.prettierrc index 51f8ac7d9..d226ccfd1 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,5 +1,6 @@ { "tabWidth": 2, "trailingComma": "es5", - "singleQuote": true + "singleQuote": true, + "printWidth": 90 } \ No newline at end of file diff --git a/docs/stashed/Schema.js b/docs/stashed/Schema.js index 8c6ab246b..758750c6f 100644 --- a/docs/stashed/Schema.js +++ b/docs/stashed/Schema.js @@ -69,7 +69,7 @@ export default MYNAMEHERE; // Defines an icon for creating new connections in the connection handler. // 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 // to avoid problems with the auto-layout diff --git a/docs/stashed/Scrollbars.js b/docs/stashed/Scrollbars.js index 53c0d878e..4afa24c16 100644 --- a/docs/stashed/Scrollbars.js +++ b/docs/stashed/Scrollbars.js @@ -96,7 +96,7 @@ export default Scrollbars; // 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 // is aligned to the grid during the preview. - mxConnectionHandler.prototype.movePreviewAway = false; + ConnectionHandler.prototype.movePreviewAway = false; // Disables foreignObjects mxClient.NO_FO = true; @@ -105,17 +105,17 @@ export default Scrollbars; GraphHandler.prototype.htmlPreview = true; // 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. // 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 mxEvent.disableContextMenu(container); // 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 // by using the currentRowNode assigned in updateRow @@ -138,7 +138,7 @@ export default Scrollbars; }; // 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(); @@ -159,7 +159,7 @@ export default Scrollbars; }; // Disables connections to invalid rows - mxConnectionHandler.prototype.isValidTarget = function(cell) + ConnectionHandler.prototype.isValidTarget = function(cell) { return this.currentRowNode != null; }; diff --git a/docs/stashed/Touch.js b/docs/stashed/Touch.js index 7cc7a479d..43b282b1e 100644 --- a/docs/stashed/Touch.js +++ b/docs/stashed/Touch.js @@ -265,13 +265,13 @@ export default Touch; (function() { // Enables rotation handle - mxVertexHandler.prototype.rotationEnabled = true; + VertexHandler.prototype.rotationEnabled = true; // Enables managing of sizers - mxVertexHandler.prototype.manageSizers = true; + VertexHandler.prototype.manageSizers = true; // Enables live preview - mxVertexHandler.prototype.livePreview = true; + VertexHandler.prototype.livePreview = true; // Sets constants for touch style mxConstants.HANDLE_SIZE = 16; @@ -281,7 +281,7 @@ export default Touch; if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) { Shape.prototype.svgStrokeTolerance = 18; - mxVertexHandler.prototype.tolerance = 12; + VertexHandler.prototype.tolerance = 12; mxEdgeHandler.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 - mxConnectionHandler.prototype.selectCells = function(edge, target) + ConnectionHandler.prototype.selectCells = function(edge, target) { if (target != null) { @@ -337,7 +337,7 @@ export default Touch; // Rounded edge and vertex handles let touchHandle = new Image('images/handle-main.png', 17, 17); - mxVertexHandler.prototype.handleImage = touchHandle; + VertexHandler.prototype.handleImage = touchHandle; mxEdgeHandler.prototype.handleImage = touchHandle; Outline.prototype.sizerImage = touchHandle; @@ -347,8 +347,8 @@ export default Touch; // Adds connect icon to selected vertex let connectorSrc = 'images/handle-connect.png'; - let vertexHandlerInit = mxVertexHandler.prototype.init; - mxVertexHandler.prototype.init = function() + let vertexHandlerInit = VertexHandler.prototype.init; + VertexHandler.prototype.init = function() { // TODO: Use 4 sizers, move outside of shape //this.singleSizer = this.state.width < 30 && this.state.height < 30; @@ -393,8 +393,8 @@ export default Touch; this.redrawHandles(); }; - let vertexHandlerHideSizers = mxVertexHandler.prototype.hideSizers; - mxVertexHandler.prototype.hideSizers = function() + let vertexHandlerHideSizers = VertexHandler.prototype.hideSizers; + VertexHandler.prototype.hideSizers = function() { vertexHandlerHideSizers.apply(this, arguments); @@ -404,8 +404,8 @@ export default Touch; } }; - let vertexHandlerReset = mxVertexHandler.prototype.reset; - mxVertexHandler.prototype.reset = function() + let vertexHandlerReset = VertexHandler.prototype.reset; + VertexHandler.prototype.reset = function() { vertexHandlerReset.apply(this, arguments); @@ -415,8 +415,8 @@ export default Touch; } }; - let vertexHandlerRedrawHandles = mxVertexHandler.prototype.redrawHandles; - mxVertexHandler.prototype.redrawHandles = function() + let vertexHandlerRedrawHandles = VertexHandler.prototype.redrawHandles; + VertexHandler.prototype.redrawHandles = function() { vertexHandlerRedrawHandles.apply(this); @@ -426,7 +426,7 @@ export default Touch; let s = this.state; // Top right for single-sizer - if (mxVertexHandler.prototype.singleSizer) + if (VertexHandler.prototype.singleSizer) { pt.x = s.x + s.width - this.connectorImg.offsetWidth / 2; pt.y = s.y - this.connectorImg.offsetHeight / 2; @@ -453,8 +453,8 @@ export default Touch; } }; - let vertexHandlerDestroy = mxVertexHandler.prototype.destroy; - mxVertexHandler.prototype.destroy = function(sender, me) + let vertexHandlerDestroy = VertexHandler.prototype.destroy; + VertexHandler.prototype.destroy = function(sender, me) { vertexHandlerDestroy.apply(this, arguments); diff --git a/docs/stashed/grapheditor/www/js/Editor.js b/docs/stashed/grapheditor/www/js/Editor.js index 1a80f2412..d78536c1b 100644 --- a/docs/stashed/grapheditor/www/js/Editor.js +++ b/docs/stashed/grapheditor/www/js/Editor.js @@ -2591,8 +2591,8 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types) }; // Overrides to ignore hotspot only for target terminal - let mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker; - mxConnectionHandler.prototype.createMarker = function() + let mxConnectionHandlerCreateMarker = ConnectionHandler.prototype.createMarker; + ConnectionHandler.prototype.createMarker = function() { let marker = mxConnectionHandlerCreateMarker.apply(this, arguments); diff --git a/docs/stashed/grapheditor/www/js/EditorUi.js b/docs/stashed/grapheditor/www/js/EditorUi.js index c647f79de..c8fd71ec1 100644 --- a/docs/stashed/grapheditor/www/js/EditorUi.js +++ b/docs/stashed/grapheditor/www/js/EditorUi.js @@ -34,9 +34,9 @@ EditorUi = function(editor, container, lightbox) } // 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 @@ -4100,7 +4100,7 @@ EditorUi.prototype.ctrlEnter = function() try { let cells = graph.getSelectionCells(); - let lookup = new mxDictionary(); + let lookup = new Dictionary(); let newCells = []; for (let i = 0; i < cells.length; i++) diff --git a/docs/stashed/grapheditor/www/js/Graph.js b/docs/stashed/grapheditor/www/js/Graph.js index 1cb6e2b4a..c03930101 100644 --- a/docs/stashed/grapheditor/www/js/Graph.js +++ b/docs/stashed/grapheditor/www/js/Graph.js @@ -639,7 +639,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone) }; // All code below not available and not needed in embed mode - if (typeof mxVertexHandler !== 'undefined') + if (typeof VertexHandler !== 'undefined') { this.setConnectable(true); this.setDropEnabled(true); @@ -738,7 +738,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone) this.graphHandler.getCells = function(initialCell) { let cells = graphHandlerGetCells.apply(this, arguments); - let lookup = new mxDictionary(); + let lookup = new Dictionary(); let newCells = []; 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); - 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() { @@ -6113,7 +6113,7 @@ StencilRegistry.parseStencilSet = function(root, postStencilLoad, install) /** * These overrides are only added if mxVertexHandler is defined (ie. not in embedded graph) */ -if (typeof mxVertexHandler != 'undefined') +if (typeof VertexHandler != 'undefined') { (function() { @@ -6142,7 +6142,7 @@ if (typeof mxVertexHandler != 'undefined') GraphHandler.prototype.removeEmptyParents = true; // Enables fading of rubberband - mxRubberband.prototype.fadeOut = true; + RubberBand.prototype.fadeOut = true; // Alt-move disables guides mxGuide.prototype.isEnabledForEvent = function(evt) @@ -6160,14 +6160,14 @@ if (typeof mxVertexHandler != 'undefined') // Extends connection handler to enable ctrl+drag for cloning source cell // since copyOnConnect is now disabled by default - let mxConnectionHandlerCreateTarget = mxConnectionHandler.prototype.isCreateTarget; - mxConnectionHandler.prototype.isCreateTarget = function(evt) + let mxConnectionHandlerCreateTarget = ConnectionHandler.prototype.isCreateTarget; + ConnectionHandler.prototype.isCreateTarget = function(evt) { return this.graph.isCloneEvent(evt) || mxConnectionHandlerCreateTarget.apply(this, arguments); }; // Overrides highlight shape for connection points - mxConstraintHandler.prototype.createHighlightShape = function() + ConstraintHandler.prototype.createHighlightShape = function() { let hl = new Ellipse(null, this.highlightColor, this.highlightColor, 0); hl.opacity = mxConstants.HIGHLIGHT_OPACITY; @@ -6176,11 +6176,11 @@ if (typeof mxVertexHandler != 'undefined') }; // Overrides edge preview to use current edge shape and default style - mxConnectionHandler.prototype.livePreview = true; - mxConnectionHandler.prototype.cursor = 'crosshair'; + ConnectionHandler.prototype.livePreview = true; + ConnectionHandler.prototype.cursor = 'crosshair'; // Uses current edge style for connect preview - mxConnectionHandler.prototype.createEdgeState = function(me) + ConnectionHandler.prototype.createEdgeState = function(me) { let style = this.graph.createCurrentEdgeStyle(); 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 - let connectionHandlerCreateShape = mxConnectionHandler.prototype.createShape; - mxConnectionHandler.prototype.createShape = function() + let connectionHandlerCreateShape = ConnectionHandler.prototype.createShape; + ConnectionHandler.prototype.createShape = function() { let shape = connectionHandlerCreateShape.apply(this, arguments); @@ -6206,14 +6206,14 @@ if (typeof mxVertexHandler != 'undefined') } // Overrides live preview to keep current style - mxConnectionHandler.prototype.updatePreview = function(valid) + ConnectionHandler.prototype.updatePreview = function(valid) { // do not change color of preview }; // Overrides connection handler to ignore edges instead of not allowing connections - let mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker; - mxConnectionHandler.prototype.createMarker = function() + let mxConnectionHandlerCreateMarker = ConnectionHandler.prototype.createMarker; + ConnectionHandler.prototype.createMarker = function() { let marker = mxConnectionHandlerCreateMarker.apply(this, arguments); @@ -6500,7 +6500,7 @@ if (typeof mxVertexHandler != 'undefined') let clones = this.cloneCells(cells, null, cloneMap); // Creates a dictionary for fast lookups - let dict = new mxDictionary(); + let dict = new Dictionary(); for (let i = 0; i < cells.length; i++) { @@ -6931,7 +6931,7 @@ if (typeof mxVertexHandler != 'undefined') for (let i = 0; i < c.length; 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)); } } @@ -7430,7 +7430,7 @@ if (typeof mxVertexHandler != 'undefined') { if (cells != null) { - let dict = new mxDictionary(); + let dict = new Dictionary(); for (let i = 0; i < cells.length; i++) { @@ -9556,7 +9556,7 @@ if (typeof mxVertexHandler != 'undefined') }; 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())) { @@ -10195,7 +10195,7 @@ if (typeof mxVertexHandler != 'undefined') mxSelectionCellsHandler.prototype.getHandledSelectionCells = function() { let cells = selectionCellsHandlerGetHandledSelectionCells.apply(this, arguments); - let dict = new mxDictionary(); + let dict = new Dictionary(); let model = this.graph.model; let result = []; @@ -10230,8 +10230,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Creates the shape used to draw the selection border. */ - let vertexHandlerCreateParentHighlightShape = mxVertexHandler.prototype.createParentHighlightShape; - mxVertexHandler.prototype.createParentHighlightShape = function(bounds) + let vertexHandlerCreateParentHighlightShape = VertexHandler.prototype.createParentHighlightShape; + VertexHandler.prototype.createParentHighlightShape = function(bounds) { let shape = vertexHandlerCreateParentHighlightShape.apply(this, arguments); @@ -10258,8 +10258,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Moves rotation handle to top, right corner. */ - mxVertexHandler.prototype.rotationHandleVSpacing = -12; - mxVertexHandler.prototype.getRotationHandlePosition = function() + VertexHandler.prototype.rotationHandleVSpacing = -12; + VertexHandler.prototype.getRotationHandlePosition = function() { let padding = this.getHandlePadding(); @@ -10270,7 +10270,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Enables recursive resize for groups. */ - mxVertexHandler.prototype.isRecursiveResize = function(state, me) + VertexHandler.prototype.isRecursiveResize = function(state, me) { return this.graph.isRecursiveVertexResize(state) && !mxEvent.isControlDown(me.getEvent()); @@ -10279,7 +10279,7 @@ if (typeof mxVertexHandler != 'undefined') /** * 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 && !state.cell.isCollapsed() && @@ -10292,8 +10292,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Hides rotation handle for table cells and rows. */ - let vertexHandlerIsRotationHandleVisible = mxVertexHandler.prototype.isRotationHandleVisible; - mxVertexHandler.prototype.isRotationHandleVisible = function() + let vertexHandlerIsRotationHandleVisible = VertexHandler.prototype.isRotationHandleVisible; + VertexHandler.prototype.isRotationHandleVisible = function() { return vertexHandlerIsRotationHandleVisible.apply(this, arguments) && !this.graph.isTableCell(this.state.cell) && @@ -10304,7 +10304,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Hides rotation handle for table cells and rows. */ - mxVertexHandler.prototype.getSizerBounds = function() + VertexHandler.prototype.getSizerBounds = function() { if (this.graph.isTableCell(this.state.cell)) { @@ -10319,8 +10319,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Hides rotation handle for table cells and rows. */ - let vertexHandlerIsParentHighlightVisible = mxVertexHandler.prototype.isParentHighlightVisible; - mxVertexHandler.prototype.isParentHighlightVisible = function() + let vertexHandlerIsParentHighlightVisible = VertexHandler.prototype.isParentHighlightVisible; + VertexHandler.prototype.isParentHighlightVisible = function() { return vertexHandlerIsParentHighlightVisible.apply(this, arguments) && !this.graph.isTableCell(this.state.cell) && @@ -10330,8 +10330,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Hides rotation handle for table cells and rows. */ - let vertexHandlerIsCustomHandleVisible = mxVertexHandler.prototype.isCustomHandleVisible; - mxVertexHandler.prototype.isCustomHandleVisible = function(handle) + let vertexHandlerIsCustomHandleVisible = VertexHandler.prototype.isCustomHandleVisible; + VertexHandler.prototype.isCustomHandleVisible = function(handle) { return handle.tableHandle || (vertexHandlerIsCustomHandleVisible.apply(this, arguments) && @@ -10342,7 +10342,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Adds selection border inset for table cells and rows. */ - mxVertexHandler.prototype.getSelectionBorderInset = function() + VertexHandler.prototype.getSelectionBorderInset = function() { let result = 0; @@ -10361,8 +10361,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Adds custom handles for table cells. */ - let vertexHandlerGetSelectionBorderBounds = mxVertexHandler.prototype.getSelectionBorderBounds; - mxVertexHandler.prototype.getSelectionBorderBounds = function() + let vertexHandlerGetSelectionBorderBounds = VertexHandler.prototype.getSelectionBorderBounds; + VertexHandler.prototype.getSelectionBorderBounds = function() { return vertexHandlerGetSelectionBorderBounds.apply(this, arguments).grow( -this.getSelectionBorderInset()); @@ -10371,8 +10371,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Adds custom handles for table cells. */ - let vertexHandlerCreateCustomHandles = mxVertexHandler.prototype.createCustomHandles; - mxVertexHandler.prototype.createCustomHandles = function() + let vertexHandlerCreateCustomHandles = VertexHandler.prototype.createCustomHandles; + VertexHandler.prototype.createCustomHandles = function() { let handles = vertexHandlerCreateCustomHandles.apply(this, arguments); @@ -10410,7 +10410,7 @@ if (typeof mxVertexHandler != 'undefined') // Workaround for event handling on overlapping cells with tolerance shape.svgStrokeTolerance++; - let handle = new mxHandle(colState, 'col-resize', null, shape); + let handle = new VertexHandle(colState, 'col-resize', null, shape); handle.tableHandle = true; let dx = 0; @@ -10487,7 +10487,7 @@ if (typeof mxVertexHandler != 'undefined') shape.isDashed = sel.isDashed; shape.svgStrokeTolerance++; - let handle = new mxHandle(rowState, 'row-resize', null, shape); + let handle = new VertexHandle(rowState, 'row-resize', null, shape); handle.tableHandle = true; let dy = 0; @@ -10545,9 +10545,9 @@ if (typeof mxVertexHandler != 'undefined') 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); @@ -10571,7 +10571,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Creates or updates special handles for moving rows. */ - mxVertexHandler.prototype.refreshMoveHandles = function() + VertexHandler.prototype.refreshMoveHandles = function() { let graph = this.graph; let model = graph.model; @@ -10649,7 +10649,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Adds handle padding for editing cells and exceptions. */ - mxVertexHandler.prototype.refresh = function() + VertexHandler.prototype.refresh = function() { if (this.customHandles != null) { @@ -10670,8 +10670,8 @@ if (typeof mxVertexHandler != 'undefined') /** * Adds handle padding for editing cells and exceptions. */ - let vertexHandlerGetHandlePadding = mxVertexHandler.prototype.getHandlePadding; - mxVertexHandler.prototype.getHandlePadding = function() + let vertexHandlerGetHandlePadding = VertexHandler.prototype.getHandlePadding; + VertexHandler.prototype.getHandlePadding = function() { let result = new Point(0, 0); let tol = this.tolerance; @@ -10738,7 +10738,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Updates the hint for the current operation. */ - mxVertexHandler.prototype.updateHint = function(me) + VertexHandler.prototype.updateHint = function(me) { if (this.index != mxEvent.LABEL_HANDLE) { @@ -10781,7 +10781,7 @@ if (typeof mxVertexHandler != 'undefined') /** * Updates the hint for the current operation. */ - mxVertexHandler.prototype.removeHint = function() + VertexHandler.prototype.removeHint = function() { mxGraphHandler.prototype.removeHint.apply(this, arguments); @@ -10868,7 +10868,7 @@ if (typeof mxVertexHandler != 'undefined') /** * 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. @@ -10893,9 +10893,9 @@ if (typeof mxVertexHandler != 'undefined') mxConstraintHandler.prototype.pointImage = Graph.createSvgImage(5, 5, ''); } - mxVertexHandler.TABLE_HANDLE_COLOR = '#fca000'; - mxVertexHandler.prototype.handleImage = HoverIcons.prototype.mainHandle; - mxVertexHandler.prototype.secondaryHandleImage = HoverIcons.prototype.secondaryHandle; + VertexHandler.TABLE_HANDLE_COLOR = '#fca000'; + VertexHandler.prototype.handleImage = HoverIcons.prototype.mainHandle; + VertexHandler.prototype.secondaryHandleImage = HoverIcons.prototype.secondaryHandle; mxEdgeHandler.prototype.handleImage = HoverIcons.prototype.mainHandle; mxEdgeHandler.prototype.terminalHandleImage = HoverIcons.prototype.terminalHandle; mxEdgeHandler.prototype.fixedHandleImage = HoverIcons.prototype.fixedHandle; @@ -10930,18 +10930,18 @@ if (typeof mxVertexHandler != 'undefined') } // Adds rotation handle and live preview - mxVertexHandler.prototype.rotationEnabled = true; - mxVertexHandler.prototype.manageSizers = true; - mxVertexHandler.prototype.livePreview = true; + VertexHandler.prototype.rotationEnabled = true; + VertexHandler.prototype.manageSizers = true; + VertexHandler.prototype.livePreview = true; GraphHandler.prototype.maxLivePreview = 16; // 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 - mxConnectionHandler.prototype.outlineConnect = true; + ConnectionHandler.prototype.outlineConnect = true; mxCellHighlight.prototype.keepOnTop = true; - mxVertexHandler.prototype.parentHighlightEnabled = true; + VertexHandler.prototype.parentHighlightEnabled = true; mxEdgeHandler.prototype.parentHighlightEnabled = true; mxEdgeHandler.prototype.dblClickRemoveEnabled = true; @@ -10972,11 +10972,11 @@ if (typeof mxVertexHandler != 'undefined') if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) { Shape.prototype.svgStrokeTolerance = 18; - mxVertexHandler.prototype.tolerance = 12; + VertexHandler.prototype.tolerance = 12; mxEdgeHandler.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 // 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") - mxRubberband.prototype.isSpaceEvent = function(me) + RubberBand.prototype.isSpaceEvent = function(me) { return this.graph.isEnabled() && !this.graph.isCellLocked(this.graph.getDefaultParent()) && mxEvent.isControlDown(me.getEvent()) && mxEvent.isShiftDown(me.getEvent()); }; // Cancelled state - mxRubberband.prototype.cancelled = false; + RubberBand.prototype.cancelled = false; // Cancels ongoing rubberband selection but consumed event to avoid reset of selection - mxRubberband.prototype.cancel = function() + RubberBand.prototype.cancel = function() { if (this.isActive()) { @@ -11044,7 +11044,7 @@ if (typeof mxVertexHandler != 'undefined') }; // Handles moving of cells in both half panes - mxRubberband.prototype.mouseUp = function(sender, me) + RubberBand.prototype.mouseUp = function(sender, me) { if (this.cancelled) { @@ -11138,7 +11138,7 @@ if (typeof mxVertexHandler != 'undefined') }; // 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) { @@ -11239,8 +11239,8 @@ if (typeof mxVertexHandler != 'undefined') }; // Removes preview - let mxRubberbandReset = mxRubberband.prototype.reset; - mxRubberband.prototype.reset = function() + let mxRubberbandReset = RubberBand.prototype.reset; + RubberBand.prototype.reset = function() { if (this.secondDiv != null) { @@ -11290,7 +11290,7 @@ if (typeof mxVertexHandler != 'undefined') let source = index != null && index == 0; let terminalState = this.state.getVisibleTerminalState(source); 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; let pt = (c != null) ? this.graph.getConnectionPoint(this.state.getVisibleTerminalState(source), c) : null; let img = (pt != null) ? this.fixedHandleImage : ((c != null && terminalState != null) ? @@ -11318,8 +11318,8 @@ if (typeof mxVertexHandler != 'undefined') } }; - let vertexHandlerCreateSizerShape = mxVertexHandler.prototype.createSizerShape; - mxVertexHandler.prototype.createSizerShape = function(bounds, index, fillColor) + let vertexHandlerCreateSizerShape = VertexHandler.prototype.createSizerShape; + VertexHandler.prototype.createSizerShape = function(bounds, index, fillColor) { 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 - let mxVertexHandlerGetSelectionBounds = mxVertexHandler.prototype.getSelectionBounds; - mxVertexHandler.prototype.getSelectionBounds = function(state) + let mxVertexHandlerGetSelectionBounds = VertexHandler.prototype.getSelectionBounds; + VertexHandler.prototype.getSelectionBounds = function(state) { let model = this.graph.getModel(); let parent = state.cell.getParent(); @@ -11393,8 +11393,8 @@ if (typeof mxVertexHandler != 'undefined') // Redirects moving of edge labels to mxGraphHandler by not starting here. // This will use the move preview of mxGraphHandler (see above). - let mxVertexHandlerMouseDown = mxVertexHandler.prototype.mouseDown; - mxVertexHandler.prototype.mouseDown = function(sender, me) + let mxVertexHandlerMouseDown = VertexHandler.prototype.mouseDown; + VertexHandler.prototype.mouseDown = function(sender, me) { let model = this.graph.getModel(); let parent = this.state.cell.getParent(); @@ -11411,7 +11411,7 @@ if (typeof mxVertexHandler != 'undefined') }; // 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 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 - mxVertexHandler.prototype.mouseMove = function(sender, me) + VertexHandler.prototype.mouseMove = function(sender, me) { 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); @@ -11470,8 +11470,8 @@ if (typeof mxVertexHandler != 'undefined') this.blockDelayedSelection = null; }; - let vertexHandlerInit = mxVertexHandler.prototype.init; - mxVertexHandler.prototype.init = function() + let vertexHandlerInit = VertexHandler.prototype.init; + VertexHandler.prototype.init = function() { vertexHandlerInit.apply(this, arguments); let redraw = false; @@ -11548,7 +11548,7 @@ if (typeof mxVertexHandler != 'undefined') } }; - mxVertexHandler.prototype.updateLinkHint = function(link, links) + VertexHandler.prototype.updateLinkHint = function(link, links) { try { @@ -11637,7 +11637,7 @@ if (typeof mxVertexHandler != 'undefined') } }; - mxEdgeHandler.prototype.updateLinkHint = mxVertexHandler.prototype.updateLinkHint; + mxEdgeHandler.prototype.updateLinkHint = VertexHandler.prototype.updateLinkHint; // Creates special handles let edgeHandlerInit = mxEdgeHandler.prototype.init; @@ -11688,9 +11688,9 @@ if (typeof mxVertexHandler != 'undefined') }; // 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); @@ -11701,8 +11701,8 @@ if (typeof mxVertexHandler != 'undefined') }; // Updates special handles - let vertexHandlerRedrawHandles = mxVertexHandler.prototype.redrawHandles; - mxVertexHandler.prototype.redrawHandles = function() + let vertexHandlerRedrawHandles = VertexHandler.prototype.redrawHandles; + VertexHandler.prototype.redrawHandles = function() { if (this.moveHandles != null) { @@ -11778,8 +11778,8 @@ if (typeof mxVertexHandler != 'undefined') }; // Destroys special handles - let vertexHandlerDestroy = mxVertexHandler.prototype.destroy; - mxVertexHandler.prototype.destroy = function() + let vertexHandlerDestroy = VertexHandler.prototype.destroy; + VertexHandler.prototype.destroy = function() { vertexHandlerDestroy.apply(this, arguments); diff --git a/docs/stashed/grapheditor/www/js/Shapes.js b/docs/stashed/grapheditor/www/js/Shapes.js index 884b469f5..587939fe0 100644 --- a/docs/stashed/grapheditor/www/js/Shapes.js +++ b/docs/stashed/grapheditor/www/js/Shapes.js @@ -3717,11 +3717,11 @@ } // 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) { - let handle = new mxHandle(state, null, mxVertexHandler.prototype.secondaryHandleImage); + let handle = new VertexHandle(state, null, VertexHandler.prototype.secondaryHandleImage); handle.execute = function(me) { @@ -4540,9 +4540,9 @@ Graph.createHandle = createHandle; 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); @@ -4725,7 +4725,7 @@ { if (edgeStyle == mxEdgeStyle.IsometricConnector) { - let handler = new mxElbowEdgeHandler(state); + let handler = new ElbowEdgeHandler(state); handler.snapToTerminals = false; return handler; @@ -4746,12 +4746,12 @@ let dx = (w - 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 mxConnectionConstraint(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 mxConnectionConstraint(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 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.25 * m)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx + 0.5 * m, dy + m * tan30Dx)); + constr.push(new ConnectionConstraint(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.75 * m)); + constr.push(new ConnectionConstraint(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, dy + 0.75 * m)); 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 isoH = Math.min(w * Math.tan(isoAngle), h * 0.5); - constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, isoH)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); - constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, w, h - isoH)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0, 0), false, null, 0, h - isoH)); - constr.push(new mxConnectionConstraint(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.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, isoH)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h - isoH)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - isoH)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, isoH)); return (constr); } @@ -4783,45 +4783,45 @@ 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)))); - constr.push(new mxConnectionConstraint(new Point(0, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0.25, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0.75, 0), false)); - constr.push(new mxConnectionConstraint(new Point(1, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, dx2, h)); - constr.push(new mxConnectionConstraint(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)); + constr.push(new ConnectionConstraint(new Point(0.25, 0), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(0.75, 0), false)); + constr.push(new ConnectionConstraint(new Point(1, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - s) * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h - s)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx2, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - s)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5)); 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); }; - RectangleShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), true), - new mxConnectionConstraint(new Point(0.25, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.75, 0), true), - new mxConnectionConstraint(new Point(1, 0), true), - new mxConnectionConstraint(new Point(0, 0.25), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true), - new mxConnectionConstraint(new Point(0, 1), true), - new mxConnectionConstraint(new Point(0.25, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.75, 1), true), - new mxConnectionConstraint(new Point(1, 1), true)]; - Ellipse.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), true), new mxConnectionConstraint(new Point(1, 0), true), - new mxConnectionConstraint(new Point(0, 1), true), new mxConnectionConstraint(new Point(1, 1), true), - new mxConnectionConstraint(new Point(0.5, 0), true), new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0, 0.5), true), new mxConnectionConstraint(new Point(1, 0.5))]; + RectangleShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), true), + new ConnectionConstraint(new Point(0.25, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.75, 0), true), + new ConnectionConstraint(new Point(1, 0), true), + new ConnectionConstraint(new Point(0, 0.25), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true), + new ConnectionConstraint(new Point(0, 1), true), + new ConnectionConstraint(new Point(0.25, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.75, 1), true), + new ConnectionConstraint(new Point(1, 1), true)]; + Ellipse.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), true), new ConnectionConstraint(new Point(1, 0), true), + new ConnectionConstraint(new Point(0, 1), true), new ConnectionConstraint(new Point(1, 1), true), + new ConnectionConstraint(new Point(0.5, 0), true), new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0, 0.5), true), new ConnectionConstraint(new Point(1, 0.5))]; PartialRectangleShape.prototype.constraints = RectangleShape.prototype.constraints; ImageShape.prototype.constraints = RectangleShape.prototype.constraints; Swimlane.prototype.constraints = RectangleShape.prototype.constraints; @@ -4833,20 +4833,20 @@ let constr = []; 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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5 )); - constr.push(new mxConnectionConstraint(new Point(1, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s, 0)); + constr.push(new ConnectionConstraint(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)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5 )); + constr.push(new ConnectionConstraint(new Point(1, 1), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); 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); @@ -4857,20 +4857,20 @@ let constr = []; 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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, 0, (h + s) * 0.5 )); - constr.push(new mxConnectionConstraint(new Point(0, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(new Point(1, 1), false)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(1, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s * 0.5, s * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, s)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h + s) * 0.5 )); + constr.push(new ConnectionConstraint(new Point(0, 1), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(new Point(1, 1), false)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false)); 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); @@ -4881,18 +4881,18 @@ let constr = []; 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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5)); - constr.push(new mxConnectionConstraint(new Point(1, 1), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - s) * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - s, 0)); + constr.push(new ConnectionConstraint(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)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h + s) * 0.5)); + constr.push(new ConnectionConstraint(new Point(1, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + s) * 0.5, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s * 0.5, h - s * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - s)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - s) * 0.5)); return (constr); }; @@ -4902,25 +4902,25 @@ let constr = []; 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 mxConnectionConstraint(new Point(0, 0.5), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), 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 mxConnectionConstraint(new Point(1, 0), false, null, 0, s)); - constr.push(new mxConnectionConstraint(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, 0), false, null, 0, s)); + constr.push(new ConnectionConstraint(new Point(1, 0), false, null, 0, s)); + constr.push(new ConnectionConstraint(new Point(1, 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 mxConnectionConstraint(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 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, 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 ConnectionConstraint(new Point(1, 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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0.145, 1), false, null, 0, -s * 0.29)); + constr.push(new ConnectionConstraint(new Point(0.145, 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 ConnectionConstraint(new Point(0.855, 1), false, null, 0, -s * 0.29)); + constr.push(new ConnectionConstraint(new Point(0.145, 1), false, null, 0, -s * 0.29)); return (constr); }; @@ -4934,34 +4934,34 @@ if (tp == 'left') { - constr.push(new mxConnectionConstraint(new Point(0, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy)); } else { - constr.push(new mxConnectionConstraint(new Point(1, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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(1, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, 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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, 0, h)); - constr.push(new mxConnectionConstraint(new Point(0.25, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(new Point(0.75, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy)); + constr.push(new ConnectionConstraint(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.5 + dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, (h - dy) * 0.75 + dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy)); + constr.push(new ConnectionConstraint(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.5 + dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, (h - dy) * 0.75 + dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h)); + constr.push(new ConnectionConstraint(new Point(0.25, 1), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(new Point(0.75, 1), false)); return (constr); } @@ -4981,14 +4981,14 @@ 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); - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false, null)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w - dx, 0)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false, null)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, s, h)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false, null)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, 0)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false, null)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - dx, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (s + w - dx) * 0.5, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, s, h)); return (constr); }; @@ -4997,35 +4997,35 @@ { var x0 = parseFloat(utils.getValue(style, 'jettyWidth', ModuleShape.prototype.jettyWidth)) / 2; let dy = parseFloat(utils.getValue(style, 'jettyHeight', ModuleShape.prototype.jettyHeight)); - let constr = [new mxConnectionConstraint(new Point(0, 0), false, null, x0), - new mxConnectionConstraint(new Point(0.25, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.75, 0), true), - new mxConnectionConstraint(new Point(1, 0), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true), - new mxConnectionConstraint(new Point(0, 1), false, null, x0), - new mxConnectionConstraint(new Point(0.25, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.75, 1), true), - new mxConnectionConstraint(new Point(1, 1), true), - new mxConnectionConstraint(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))]; + let constr = [new ConnectionConstraint(new Point(0, 0), false, null, x0), + new ConnectionConstraint(new Point(0.25, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.75, 0), true), + new ConnectionConstraint(new Point(1, 0), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true), + new ConnectionConstraint(new Point(0, 1), false, null, x0), + new ConnectionConstraint(new Point(0.25, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.75, 1), true), + new ConnectionConstraint(new Point(1, 1), true), + new ConnectionConstraint(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, 3.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) { - 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) { - 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; @@ -5033,124 +5033,124 @@ LoopLimitShape.prototype.constraints = RectangleShape.prototype.constraints; OffPageConnectorShape.prototype.constraints = RectangleShape.prototype.constraints; - mxCylinder.prototype.constraints = [new mxConnectionConstraint(new Point(0.15, 0.05), false), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.85, 0.05), false), - new mxConnectionConstraint(new Point(0, 0.3), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.7), true), - new mxConnectionConstraint(new Point(1, 0.3), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.7), true), - new mxConnectionConstraint(new Point(0.15, 0.95), false), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.85, 0.95), false)]; - UmlActorShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0.1), false), - new mxConnectionConstraint(new Point(0.5, 0), false), - new mxConnectionConstraint(new Point(0.75, 0.1), false), - new mxConnectionConstraint(new Point(0, 1/3), false), - new mxConnectionConstraint(new Point(0, 1), false), - new mxConnectionConstraint(new Point(1, 1/3), false), - new mxConnectionConstraint(new Point(1, 1), false), - new mxConnectionConstraint(new Point(0.5, 0.5), false)]; - ComponentShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.75, 0), true), - new mxConnectionConstraint(new Point(0, 0.3), true), - new mxConnectionConstraint(new Point(0, 0.7), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true), - new mxConnectionConstraint(new Point(0.25, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.75, 1), true)]; - Actor.prototype.constraints = [new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.25, 0.2), false), - new mxConnectionConstraint(new Point(0.1, 0.5), false), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(0.75, 0.25), false), - new mxConnectionConstraint(new Point(0.9, 0.5), false), - new mxConnectionConstraint(new Point(1, 0.75), true), - new mxConnectionConstraint(new Point(0.25, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.75, 1), true)]; - SwitchShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), false), - new mxConnectionConstraint(new Point(0.5, 0.25), false), - new mxConnectionConstraint(new Point(1, 0), false), - new mxConnectionConstraint(new Point(0.25, 0.5), false), - new mxConnectionConstraint(new Point(0.75, 0.5), false), - new mxConnectionConstraint(new Point(0, 1), false), - new mxConnectionConstraint(new Point(0.5, 0.75), false), - new mxConnectionConstraint(new Point(1, 1), false)]; - TapeShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.35), false), - new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(0, 0.65), false), - new mxConnectionConstraint(new Point(1, 0.35), false), - new mxConnectionConstraint(new Point(1, 0.5), false), - new mxConnectionConstraint(new Point(1, 0.65), false), - new mxConnectionConstraint(new Point(0.25, 1), false), - new mxConnectionConstraint(new Point(0.75, 0), false)]; - StepShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.75, 0), true), - new mxConnectionConstraint(new Point(0.25, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.75, 1), true), - new mxConnectionConstraint(new Point(0, 0.25), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true)]; - mxLine.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(0.25, 0.5), false), - new mxConnectionConstraint(new Point(0.75, 0.5), false), - new mxConnectionConstraint(new Point(1, 0.5), false)]; - LollipopShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.5, 0), false), - new mxConnectionConstraint(new Point(0.5, 1), false)]; + mxCylinder.prototype.constraints = [new ConnectionConstraint(new Point(0.15, 0.05), false), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.85, 0.05), false), + new ConnectionConstraint(new Point(0, 0.3), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.7), true), + new ConnectionConstraint(new Point(1, 0.3), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.7), true), + new ConnectionConstraint(new Point(0.15, 0.95), false), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.85, 0.95), false)]; + UmlActorShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0.1), false), + new ConnectionConstraint(new Point(0.5, 0), false), + new ConnectionConstraint(new Point(0.75, 0.1), false), + new ConnectionConstraint(new Point(0, 1/3), false), + new ConnectionConstraint(new Point(0, 1), false), + new ConnectionConstraint(new Point(1, 1/3), false), + new ConnectionConstraint(new Point(1, 1), false), + new ConnectionConstraint(new Point(0.5, 0.5), false)]; + ComponentShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.75, 0), true), + new ConnectionConstraint(new Point(0, 0.3), true), + new ConnectionConstraint(new Point(0, 0.7), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true), + new ConnectionConstraint(new Point(0.25, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.75, 1), true)]; + Actor.prototype.constraints = [new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.25, 0.2), false), + new ConnectionConstraint(new Point(0.1, 0.5), false), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(0.75, 0.25), false), + new ConnectionConstraint(new Point(0.9, 0.5), false), + new ConnectionConstraint(new Point(1, 0.75), true), + new ConnectionConstraint(new Point(0.25, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.75, 1), true)]; + SwitchShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), false), + new ConnectionConstraint(new Point(0.5, 0.25), false), + new ConnectionConstraint(new Point(1, 0), false), + new ConnectionConstraint(new Point(0.25, 0.5), false), + new ConnectionConstraint(new Point(0.75, 0.5), false), + new ConnectionConstraint(new Point(0, 1), false), + new ConnectionConstraint(new Point(0.5, 0.75), false), + new ConnectionConstraint(new Point(1, 1), false)]; + TapeShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.35), false), + new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(0, 0.65), false), + new ConnectionConstraint(new Point(1, 0.35), false), + new ConnectionConstraint(new Point(1, 0.5), false), + new ConnectionConstraint(new Point(1, 0.65), false), + new ConnectionConstraint(new Point(0.25, 1), false), + new ConnectionConstraint(new Point(0.75, 0), false)]; + StepShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.75, 0), true), + new ConnectionConstraint(new Point(0.25, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.75, 1), true), + new ConnectionConstraint(new Point(0, 0.25), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true)]; + mxLine.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(0.25, 0.5), false), + new ConnectionConstraint(new Point(0.75, 0.5), false), + new ConnectionConstraint(new Point(1, 0.5), false)]; + LollipopShape.prototype.constraints = [new ConnectionConstraint(new Point(0.5, 0), false), + new ConnectionConstraint(new Point(0.5, 1), false)]; DoubleEllipse.prototype.constraints = Ellipse.prototype.constraints; Rhombus.prototype.constraints = Ellipse.prototype.constraints; - Triangle.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.25), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(1, 0.5), true)]; - Hexagon.prototype.constraints = [new mxConnectionConstraint(new Point(0.375, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.625, 0), true), - new mxConnectionConstraint(new Point(0, 0.25), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true), - new mxConnectionConstraint(new Point(0.375, 1), true), - new mxConnectionConstraint(new Point(0.5, 1), true), - new mxConnectionConstraint(new Point(0.625, 1), true)]; - Cloud.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0.25), false), - new mxConnectionConstraint(new Point(0.4, 0.1), false), - new mxConnectionConstraint(new Point(0.16, 0.55), false), - new mxConnectionConstraint(new Point(0.07, 0.4), false), - new mxConnectionConstraint(new Point(0.31, 0.8), false), - new mxConnectionConstraint(new Point(0.13, 0.77), false), - new mxConnectionConstraint(new Point(0.8, 0.8), false), - new mxConnectionConstraint(new Point(0.55, 0.95), false), - new mxConnectionConstraint(new Point(0.875, 0.5), false), - new mxConnectionConstraint(new Point(0.96, 0.7), false), - new mxConnectionConstraint(new Point(0.625, 0.2), false), - new mxConnectionConstraint(new Point(0.88, 0.25), false)]; + Triangle.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.25), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(1, 0.5), true)]; + Hexagon.prototype.constraints = [new ConnectionConstraint(new Point(0.375, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.625, 0), true), + new ConnectionConstraint(new Point(0, 0.25), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true), + new ConnectionConstraint(new Point(0.375, 1), true), + new ConnectionConstraint(new Point(0.5, 1), true), + new ConnectionConstraint(new Point(0.625, 1), true)]; + Cloud.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0.25), false), + new ConnectionConstraint(new Point(0.4, 0.1), false), + new ConnectionConstraint(new Point(0.16, 0.55), false), + new ConnectionConstraint(new Point(0.07, 0.4), false), + new ConnectionConstraint(new Point(0.31, 0.8), false), + new ConnectionConstraint(new Point(0.13, 0.77), false), + new ConnectionConstraint(new Point(0.8, 0.8), false), + new ConnectionConstraint(new Point(0.55, 0.95), false), + new ConnectionConstraint(new Point(0.875, 0.5), false), + new ConnectionConstraint(new Point(0.96, 0.7), false), + new ConnectionConstraint(new Point(0.625, 0.2), false), + new ConnectionConstraint(new Point(0.88, 0.25), false)]; ParallelogramShape.prototype.constraints = RectangleShape.prototype.constraints; TrapezoidShape.prototype.constraints = RectangleShape.prototype.constraints; - DocumentShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.25, 0), true), - new mxConnectionConstraint(new Point(0.5, 0), true), - new mxConnectionConstraint(new Point(0.75, 0), true), - new mxConnectionConstraint(new Point(0, 0.25), true), - new mxConnectionConstraint(new Point(0, 0.5), true), - new mxConnectionConstraint(new Point(0, 0.75), true), - new mxConnectionConstraint(new Point(1, 0.25), true), - new mxConnectionConstraint(new Point(1, 0.5), true), - new mxConnectionConstraint(new Point(1, 0.75), true)]; + DocumentShape.prototype.constraints = [new ConnectionConstraint(new Point(0.25, 0), true), + new ConnectionConstraint(new Point(0.5, 0), true), + new ConnectionConstraint(new Point(0.75, 0), true), + new ConnectionConstraint(new Point(0, 0.25), true), + new ConnectionConstraint(new Point(0, 0.5), true), + new ConnectionConstraint(new Point(0, 0.75), true), + new ConnectionConstraint(new Point(1, 0.25), true), + new ConnectionConstraint(new Point(1, 0.5), true), + new ConnectionConstraint(new Point(1, 0.75), true)]; mxArrow.prototype.constraints = null; 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)))); var w2 = Math.abs(w - dx) / 2; - constr.push(new mxConnectionConstraint(new Point(0, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); - constr.push(new mxConnectionConstraint(new Point(1, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(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)); + constr.push(new ConnectionConstraint(new Point(0.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(1, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.75 + dx * 0.25, dy)); + constr.push(new ConnectionConstraint(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, (h + dy) * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, h)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(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 + dy) * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - dx) * 0.5, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.25 - dx * 0.25, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, dy * 0.5)); return (constr); }; @@ -5186,31 +5186,31 @@ 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)))); - constr.push(new mxConnectionConstraint(new Point(0, 0), false)); - constr.push(new mxConnectionConstraint(new Point(0.5, 0), false)); - constr.push(new mxConnectionConstraint(new Point(1, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, h)); - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); - constr.push(new mxConnectionConstraint(new Point(0, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false)); + constr.push(new ConnectionConstraint(new Point(0.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(1, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + dx) * 0.5, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, dy)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, (h + dy) * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, dx * 0.5, h)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 1), false)); return (constr); }; - CrossbarShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0), false), - new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(0, 1), false), - new mxConnectionConstraint(new Point(0.25, 0.5), false), - new mxConnectionConstraint(new Point(0.5, 0.5), false), - new mxConnectionConstraint(new Point(0.75, 0.5), false), - new mxConnectionConstraint(new Point(1, 0), false), - new mxConnectionConstraint(new Point(1, 0.5), false), - new mxConnectionConstraint(new Point(1, 1), false)]; + CrossbarShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0), false), + new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(0, 1), false), + new ConnectionConstraint(new Point(0.25, 0.5), false), + new ConnectionConstraint(new Point(0.5, 0.5), false), + new ConnectionConstraint(new Point(0.75, 0.5), false), + new ConnectionConstraint(new Point(1, 0), false), + new ConnectionConstraint(new Point(1, 0.5), false), + new ConnectionConstraint(new Point(1, 1), false)]; SingleArrowShape.prototype.getConstraints = function(style, w, h) { @@ -5220,14 +5220,14 @@ let at = (h - aw) / 2; let ab = at + aw; - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, 0, h - at)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, at)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, at)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w - as) * 0.5, h - at)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, h - at)); return (constr); }; @@ -5240,14 +5240,14 @@ let at = (h - aw) / 2; let ab = at + aw; - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, as, h)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, as, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.5, at)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, 0)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w - as, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w * 0.5, h - at)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, as, h)); return (constr); }; @@ -5262,49 +5262,49 @@ let l = (w - size) / 2; let r = l + size; - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0.5, 0), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, l, h)); - constr.push(new mxConnectionConstraint(new Point(0.5, 1), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, w, t)); - constr.push(new mxConnectionConstraint(new Point(1, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, 0, t)); - constr.push(new mxConnectionConstraint(new Point(0, 0.5), false)); - constr.push(new mxConnectionConstraint(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 mxConnectionConstraint(new Point(0, 0), false, null, l, t)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, t * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, 0)); + constr.push(new ConnectionConstraint(new Point(0.5, 0), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, 0)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, t * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, t)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, h - t * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, h)); + constr.push(new ConnectionConstraint(new Point(0.5, 1), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, h)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, h - t * 0.5)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, r, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, t)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, t)); + constr.push(new ConnectionConstraint(new Point(1, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, w, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, (w + r) * 0.5, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l * 0.5, t)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, t)); + constr.push(new ConnectionConstraint(new Point(0, 0.5), false)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, 0, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l * 0.5, b)); + constr.push(new ConnectionConstraint(new Point(0, 0), false, null, l, t)); return (constr); }; UmlLifeline.prototype.constraints = null; - OrShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.25), false), - new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(0, 0.75), false), - new mxConnectionConstraint(new Point(1, 0.5), false), - new mxConnectionConstraint(new Point(0.7, 0.1), false), - new mxConnectionConstraint(new Point(0.7, 0.9), false)]; - XorShape.prototype.constraints = [new mxConnectionConstraint(new Point(0.175, 0.25), false), - new mxConnectionConstraint(new Point(0.25, 0.5), false), - new mxConnectionConstraint(new Point(0.175, 0.75), false), - new mxConnectionConstraint(new Point(1, 0.5), false), - new mxConnectionConstraint(new Point(0.7, 0.1), false), - new mxConnectionConstraint(new Point(0.7, 0.9), false)]; - RequiredInterfaceShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(1, 0.5), false)]; - ProvidedRequiredInterfaceShape.prototype.constraints = [new mxConnectionConstraint(new Point(0, 0.5), false), - new mxConnectionConstraint(new Point(1, 0.5), false)]; + OrShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.25), false), + new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(0, 0.75), false), + new ConnectionConstraint(new Point(1, 0.5), false), + new ConnectionConstraint(new Point(0.7, 0.1), false), + new ConnectionConstraint(new Point(0.7, 0.9), false)]; + XorShape.prototype.constraints = [new ConnectionConstraint(new Point(0.175, 0.25), false), + new ConnectionConstraint(new Point(0.25, 0.5), false), + new ConnectionConstraint(new Point(0.175, 0.75), false), + new ConnectionConstraint(new Point(1, 0.5), false), + new ConnectionConstraint(new Point(0.7, 0.1), false), + new ConnectionConstraint(new Point(0.7, 0.9), false)]; + RequiredInterfaceShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(1, 0.5), false)]; + ProvidedRequiredInterfaceShape.prototype.constraints = [new ConnectionConstraint(new Point(0, 0.5), false), + new ConnectionConstraint(new Point(1, 0.5), false)]; })(); diff --git a/docs/stashed/grapheditor/www/js/Sidebar.js b/docs/stashed/grapheditor/www/js/Sidebar.js index 2e2d3d1d0..fd4a3e0df 100644 --- a/docs/stashed/grapheditor/www/js/Sidebar.js +++ b/docs/stashed/grapheditor/www/js/Sidebar.js @@ -582,7 +582,7 @@ Sidebar.prototype.searchEntries = function(searchTerms, count, page, success, er if (this.taglist != null && searchTerms != null) { let tmp = searchTerms.toLowerCase().split(' '); - let dict = new mxDictionary(); + let dict = new Dictionary(); let max = (page + 1) * count; let results = []; let index = 0; @@ -592,7 +592,7 @@ Sidebar.prototype.searchEntries = function(searchTerms, count, page, success, er if (tmp[i].length > 0) { let entry = this.taglist[tmp[i]]; - let tmpDict = new mxDictionary(); + let tmpDict = new Dictionary(); if (entry != null) { diff --git a/packages/core/src/editor/mxEditor.js b/packages/core/src/editor/mxEditor.js index 84ab9c79c..6d03be388 100644 --- a/packages/core/src/editor/mxEditor.js +++ b/packages/core/src/editor/mxEditor.js @@ -34,7 +34,7 @@ import { import graph from '../view/Graph'; import SwimlaneManager from '../view/layout/SwimlaneManager'; 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 RootChange from '../view/model/RootChange'; import ValueChange from '../view/cell/ValueChange'; @@ -1584,7 +1584,7 @@ class mxEditor extends EventSource { // Install rubberband selection as the last // action handler in the chain - this.rubberband = new mxRubberband(this.graph); + this.rubberband = new RubberBand(this.graph); // Disables the context menu if (this.disableContextMenu) { diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index a15eb4037..e2ac18794 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -20,20 +20,20 @@ import mxEditor from './editor/mxEditor'; import mxCellHighlight from './view/selection/mxCellHighlight'; import CellMarker from './view/cell/CellMarker'; import mxCellTracker from './view/event/mxCellTracker'; -import mxConnectionHandler from './view/connection/mxConnectionHandler'; -import mxConstraintHandler from './view/connection/mxConstraintHandler'; -import mxEdgeHandler from './view/cell/edge/mxEdgeHandler'; -import mxEdgeSegmentHandler from './view/cell/edge/mxEdgeSegmentHandler'; -import mxElbowEdgeHandler from './view/cell/edge/mxElbowEdgeHandler'; +import ConnectionHandler from './view/connection/ConnectionHandler'; +import ConstraintHandler from './view/connection/ConstraintHandler'; +import EdgeHandler from './view/cell/edge/EdgeHandler'; +import EdgeSegmentHandler from './view/cell/edge/EdgeSegmentHandler'; +import ElbowEdgeHandler from './view/cell/edge/ElbowEdgeHandler'; 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 PanningHandler from './view/panning/PanningHandler'; 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 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 mxCompactTreeLayout from './view/layout/layout/mxCompactTreeLayout'; @@ -123,7 +123,7 @@ import mxAbstractCanvas2D from './util/canvas/mxAbstractCanvas2D'; import mxSvgCanvas2D from './util/canvas/mxSvgCanvas2D'; import mxXmlCanvas2D from './util/canvas/mxXmlCanvas2D'; -import mxDictionary from './util/mxDictionary'; +import Dictionary from './util/Dictionary'; import Geometry from './view/geometry/Geometry'; import mxObjectIdentity from './util/mxObjectIdentity'; import Point from './view/geometry/Point'; @@ -173,7 +173,7 @@ import CellState from './view/cell/datatypes/CellState'; import CellStatePreview from './view/cell/CellStatePreview'; 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 graph from './view/Graph'; @@ -191,7 +191,7 @@ export default { mxClient, mxLog, mxObjectIdentity, - mxDictionary, + mxDictionary: Dictionary, mxResources: Resources, mxPoint: Point, mxRectangle: Rectangle, @@ -290,20 +290,20 @@ export default { mxSwimlaneManager: SwimlaneManager, mxTemporaryCellStates: TemporaryCellStates, mxCellStatePreview: CellStatePreview, - mxConnectionConstraint, + mxConnectionConstraint: ConnectionConstraint, mxGraphHandler: GraphHandler, mxPanningHandler: PanningHandler, mxPopupMenuHandler: PopupMenuHandler, mxCellMarker: CellMarker, mxSelectionCellsHandler, - mxConnectionHandler, - mxConstraintHandler, - mxRubberband, - mxHandle, - mxVertexHandler, - mxEdgeHandler, - mxElbowEdgeHandler, - mxEdgeSegmentHandler, + mxConnectionHandler: ConnectionHandler, + mxConstraintHandler: ConstraintHandler, + mxRubberband: RubberBand, + mxHandle: VertexHandle, + mxVertexHandler: VertexHandler, + mxEdgeHandler: EdgeHandler, + mxElbowEdgeHandler: ElbowEdgeHandler, + mxEdgeSegmentHandler: EdgeSegmentHandler, mxKeyHandler, mxTooltipHandler: TooltipHandler, mxCellTracker, diff --git a/packages/core/src/util/mxDictionary.ts b/packages/core/src/util/Dictionary.ts similarity index 95% rename from packages/core/src/util/mxDictionary.ts rename to packages/core/src/util/Dictionary.ts index ed51d2206..130a6506b 100644 --- a/packages/core/src/util/mxDictionary.ts +++ b/packages/core/src/util/Dictionary.ts @@ -7,9 +7,9 @@ import mxObjectIdentity from './mxObjectIdentity'; -type Dictionary = { - [key: string]: U; -}; +//type Dictionary = { +// [key: string]: U; +//}; type Visitor = (key: string, value: U) => void; @@ -23,7 +23,7 @@ type Visitor = (key: string, value: U) => void; * * Constructs a new dictionary which allows object to be used as keys. */ -class mxDictionary { +class Dictionary { constructor() { this.clear(); } @@ -131,4 +131,4 @@ class mxDictionary { } } -export default mxDictionary; +export default Dictionary; diff --git a/packages/core/src/util/Utils.ts b/packages/core/src/util/Utils.ts index 59fbee4d5..f5c3d5d9d 100644 --- a/packages/core/src/util/Utils.ts +++ b/packages/core/src/util/Utils.ts @@ -31,7 +31,7 @@ import { PAGE_FORMAT_A4_PORTRAIT, } from './Constants'; import Point from '../view/geometry/Point'; -import mxDictionary from './mxDictionary'; +import Dictionary from './Dictionary'; import CellPath from '../view/cell/datatypes/CellPath'; import Rectangle from '../view/geometry/Rectangle'; import { getFunctionName } from './StringUtils'; @@ -473,7 +473,7 @@ export const equalEntries = (a: Properties | null, b: Properties | null) => { * Removes all duplicates from the given array. */ export const removeDuplicates = (arr: any) => { - const dict = new mxDictionary(); + const dict = new Dictionary(); const result = []; 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. */ export const sortCells = (cells: CellArray, ascending = true): CellArray => { - const lookup = new mxDictionary(); + const lookup = new Dictionary(); cells.sort((o1, o2) => { let p1 = lookup.get(o1); diff --git a/packages/core/src/view/Graph.ts b/packages/core/src/view/Graph.ts index 29acf3227..9731f2f28 100644 --- a/packages/core/src/view/Graph.ts +++ b/packages/core/src/view/Graph.ts @@ -13,7 +13,7 @@ import Rectangle from './geometry/Rectangle'; import TooltipHandler from './tooltip/TooltipHandler'; import mxClient from '../mxClient'; import mxSelectionCellsHandler from './selection/mxSelectionCellsHandler'; -import mxConnectionHandler from './connection/mxConnectionHandler'; +import ConnectionHandler from './connection/ConnectionHandler'; import GraphHandler from './GraphHandler'; import PanningHandler from './panning/PanningHandler'; import PopupMenuHandler from './popups_menus/PopupMenuHandler'; @@ -44,22 +44,22 @@ import CellState from './cell/datatypes/CellState'; import { isNode } from '../util/DomUtils'; import CellArray from "./cell/datatypes/CellArray"; import EdgeStyle from "./style/EdgeStyle"; -import mxEdgeHandler from "./cell/edge/mxEdgeHandler"; -import mxVertexHandler from "./cell/vertex/mxVertexHandler"; -import mxEdgeSegmentHandler from "./cell/edge/mxEdgeSegmentHandler"; -import mxElbowEdgeHandler from "./cell/edge/mxElbowEdgeHandler"; +import EdgeHandler from "./cell/edge/EdgeHandler"; +import VertexHandler from "./cell/vertex/VertexHandler"; +import EdgeSegmentHandler from "./cell/edge/EdgeSegmentHandler"; +import ElbowEdgeHandler from "./cell/edge/ElbowEdgeHandler"; /** * Extends {@link EventSource} to implement a graph component for * the browser. This is the main class of the package. To activate * panning and connections use {@link setPanning} and {@link setConnectable}. * 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: * * - tooltipHandler: {@link TooltipHandler} that displays tooltips * - 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 * * 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; selectionCellsHandler: mxSelectionCellsHandler | null = null; popupMenuHandler: PopupMenuHandler | null = null; - connectionHandler: mxConnectionHandler | null = null; + connectionHandler: ConnectionHandler | null = null; graphHandler: GraphHandler | null = null; graphModelChangeListener: 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 { - return new mxConnectionHandler(this); + createConnectionHandler(): ConnectionHandler { + return new ConnectionHandler(this); } /** @@ -1028,15 +1028,15 @@ class Graph extends EventSource { /** * Creates a new handler for the given cell state. This implementation - * returns a new {@link mxEdgeHandler} of the corresponding cell is an edge, - * otherwise it returns an {@link mxVertexHandler}. + * returns a new {@link EdgeHandler} of the corresponding cell is an edge, + * otherwise it returns an {@link VertexHandler}. * * @param state {@link mxCellState} whose handler should be created. */ createHandler( state: CellState - ): mxEdgeHandler | mxVertexHandler | null { - let result: mxEdgeHandler | mxVertexHandler | null = null; + ): mxEdgeHandler | VertexHandler | null { + let result: mxEdgeHandler | VertexHandler | null = null; if (state.cell.isEdge()) { 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. */ - createVertexHandler(state: CellState): mxVertexHandler { - return new mxVertexHandler(state); + createVertexHandler(state: CellState): VertexHandler { + 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. */ @@ -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. */ @@ -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. */ - createElbowEdgeHandler(state: CellState): mxElbowEdgeHandler { - return new mxElbowEdgeHandler(state); + createElbowEdgeHandler(state: CellState): ElbowEdgeHandler { + return new ElbowEdgeHandler(state); } /***************************************************************************** diff --git a/packages/core/src/view/GraphHandler.js b/packages/core/src/view/GraphHandler.js index 96ae541cd..9cce1600a 100644 --- a/packages/core/src/view/GraphHandler.js +++ b/packages/core/src/view/GraphHandler.js @@ -20,7 +20,7 @@ import { INVALID_CONNECT_TARGET_COLOR, VALID_COLOR, } from '../util/Constants'; -import mxDictionary from '../util/mxDictionary'; +import Dictionary from '../util/Dictionary'; import mxCellHighlight from './selection/mxCellHighlight'; import Rectangle from './geometry/Rectangle'; import { @@ -848,7 +848,7 @@ class GraphHandler { this.cells = cells != null ? cells : this.getCells(this.cell); this.bounds = this.graph.getView().getBounds(this.cells); this.pBounds = this.getPreviewBounds(this.cells); - this.allCells = new mxDictionary(); + this.allCells = new Dictionary(); this.cloning = false; this.cellCount = 0; @@ -862,7 +862,7 @@ class GraphHandler { const ignore = parent.getChildCount() < 2; // Uses connected states as guides - const connected = new mxDictionary(); + const connected = new Dictionary(); const opps = this.graph.getOpposites( this.graph.getEdges(this.cell), this.cell @@ -1759,7 +1759,7 @@ class GraphHandler { // Removes parent if all child cells are removed if (!clone && target != null && this.removeEmptyParents) { // Collects all non-selected parents - const dict = new mxDictionary(); + const dict = new Dictionary(); for (let i = 0; i < cells.length; i += 1) { dict.put(cells[i], true); diff --git a/packages/core/src/view/cell/CellMarker.ts b/packages/core/src/view/cell/CellMarker.ts index a5c768b36..f401a1d09 100644 --- a/packages/core/src/view/cell/CellMarker.ts +++ b/packages/core/src/view/cell/CellMarker.ts @@ -331,8 +331,7 @@ class CellMarker extends EventSource { * * Hides the marker and fires a event. */ - // unmark(): void; - unmark() { + unmark(): void { this.mark(); } @@ -387,8 +386,7 @@ class CellMarker extends EventSource { * Returns the to be marked for the given under * the mouse. This returns the given state. */ - // getStateToMark(state: mxCellState): mxCellState; - getStateToMark(state) { + getStateToMark(state: CellState): CellState { return state; } @@ -418,8 +416,7 @@ class CellMarker extends EventSource { * * Destroys the handler and all its resources and DOM nodes. */ - // destroy(): void; - destroy() { + destroy(): void { this.graph.getView().removeListener(this.resetHandler); this.graph.getModel().removeListener(this.resetHandler); this.highlight.destroy(); diff --git a/packages/core/src/view/cell/CellRenderer.ts b/packages/core/src/view/cell/CellRenderer.ts index dd0e10dd0..a5dfb4171 100644 --- a/packages/core/src/view/cell/CellRenderer.ts +++ b/packages/core/src/view/cell/CellRenderer.ts @@ -53,7 +53,7 @@ import StencilRegistry from '../geometry/shape/node/StencilRegistry'; import InternalEvent from '../event/InternalEvent'; import mxClient from '../../mxClient'; import InternalMouseEvent from '../event/InternalMouseEvent'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import EventObject from '../event/EventObject'; import Point from '../geometry/Point'; import Shape from '../geometry/shape/Shape'; @@ -565,7 +565,7 @@ class CellRenderer { let dict = null; if (overlays != null) { - dict = new mxDictionary(); + dict = new Dictionary(); for (let i = 0; i < overlays.length; i += 1) { const shape = @@ -637,7 +637,7 @@ class CellRenderer { } 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) { InternalEvent.addListener(shape.node, 'touchend', (evt: Event) => { overlay.fireEvent( - new EventObject(InternalEvent.CLICK, 'event', evt, 'cell', state.cell) + new EventObject(InternalEvent.CLICK, {event: evt, cell: state.cell}) ); }); } diff --git a/packages/core/src/view/cell/CellStatePreview.ts b/packages/core/src/view/cell/CellStatePreview.ts index 29b3848f1..09eccaa2e 100644 --- a/packages/core/src/view/cell/CellStatePreview.ts +++ b/packages/core/src/view/cell/CellStatePreview.ts @@ -6,11 +6,11 @@ */ import Point from '../geometry/Point'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import CellState from './datatypes/CellState'; import Cell from './datatypes/Cell'; 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 { constructor(graph: graph) { - this.deltas = new mxDictionary(); + this.deltas = new Dictionary(); this.graph = graph; } /** * Reference to the enclosing . */ - // graph: mxGraph; graph: graph; /** * Reference to the enclosing . */ - // deltas: mxDictionary; - deltas: mxDictionary; + deltas: Dictionary; /** * Contains the number of entries in the map. */ - // count: number; count: number = 0; /** * Returns true if this contains no entries. */ - // isEmpty(): boolean; isEmpty(): boolean { return this.count === 0; } @@ -61,7 +57,6 @@ class CellStatePreview { * @return {*} {mxPoint} * @memberof mxCellStatePreview */ - // moveState(state: mxCellState, dx: number, dy: number, add: boolean, includeEdges: boolean): mxPoint; moveState( state: CellState, dx: number, @@ -96,19 +91,13 @@ class CellStatePreview { * @param {Function} visitor * @memberof mxCellStatePreview */ - // show(visitor: Function): void; - show(visitor: Function | null = null) { + show(visitor: Function | null = null): void { this.deltas.visit((key: string, delta: any) => { this.translateState(delta.state, delta.point.x, delta.point.y); }); this.deltas.visit((key: string, delta: any) => { - this.revalidateState( - delta.state, - delta.point.x, - delta.point.y, - visitor - ); + this.revalidateState(delta.state, delta.point.x, delta.point.y, visitor); }); } @@ -120,13 +109,10 @@ class CellStatePreview { * @param {number} dy * @memberof mxCellStatePreview */ - // translateState(state: mxCellState, dx: number, dy: number): void; - translateState(state: CellState, dx: number, dy: number) { + translateState(state: CellState, dx: number, dy: number): void { if (state != null) { - const model = this.graph.getModel(); - if (state.cell.isVertex()) { - (state.view).updateCellState(state); + (state.view).updateCellState(state); const geo = state.cell.getGeometry(); // Moves selection cells and non-relative vertices in @@ -142,14 +128,8 @@ class CellStatePreview { } } - const childCount = state.cell.getChildCount(); - - for (let i = 0; i < childCount; i += 1) { - this.translateState( - (state.view).getState(state.cell.getChildAt(i)), - dx, - dy - ); + for (const child of state.cell.getChildren()) { + this.translateState(state.view.getState(child), dx, dy); } } } @@ -163,56 +143,42 @@ class CellStatePreview { * @param {Function} visitor * @memberof mxCellStatePreview */ - // revalidateState(state: mxCellState, dx: number, dy: number, visitor: Function): void; revalidateState( - state: CellState | null = null, + state: CellState, dx: number, dy: number, visitor: Function | null = null ): void { - if (state != null) { - const model = this.graph.getModel(); + // Updates the edge terminal points and restores the + // (relative) positions of any (relative) children + if (state.cell.isEdge()) { + state.view.updateCellState(state); + } - // Updates the edge terminal points and restores the - // (relative) positions of any (relative) children - if (state.cell.isEdge()) { - state.view.updateCellState(state); - } + const geo = (state.cell).getGeometry(); + const pState = state.view.getState(state.cell.getParent()); - const geo = (state.cell).getGeometry(); - const pState = state.view.getState(state.cell.getParent()); + // Moves selection vertices which are relative + 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 - 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); - this.graph.cellRenderer.redraw(state); + // Invokes the visitor on the given state + if (visitor != null) { + visitor(state); + } - // Invokes the visitor on the given state - if (visitor != null) { - 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 - ); - } + for (const child of state.cell.getChildren()) { + this.revalidateState(this.graph.view.getState(child), dx, dy, visitor); } } @@ -222,9 +188,7 @@ class CellStatePreview { * @param {CellState} state * @memberof mxCellStatePreview */ - // addEdges(state: mxCellState): void; addEdges(state: CellState): void { - const model = this.graph.getModel(); const edgeCount = state.cell.getEdgeCount(); for (let i = 0; i < edgeCount; i += 1) { diff --git a/packages/core/src/view/cell/GraphCells.ts b/packages/core/src/view/cell/GraphCells.ts index 0adbdf4d5..55285eb5e 100644 --- a/packages/core/src/view/cell/GraphCells.ts +++ b/packages/core/src/view/cell/GraphCells.ts @@ -35,7 +35,7 @@ import EventObject from '../event/EventObject'; import InternalEvent from '../event/InternalEvent'; import ImageBundle from '../image/ImageBundle'; import Rectangle from '../geometry/Rectangle'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import Point from '../geometry/Point'; import Label from '../geometry/shape/Label'; import { htmlEntities } from '../../util/StringUtils'; @@ -541,7 +541,7 @@ class GraphCells { let clones; // Creates a dictionary for fast lookups - const dict = new mxDictionary(); + const dict = new Dictionary(); const tmp = []; for (const cell of cells) { @@ -733,7 +733,7 @@ class GraphCells { const o1 = parentState != null ? parentState.origin : null; const zero = new Point(0, 0); - for (const cell of cells) { + cells.forEach((cell, i) => { if (cell == null) { index--; } else { @@ -803,7 +803,7 @@ class GraphCells { this.cellConnected(cell, target, false); } } - } + }); this.graph.fireEvent( new EventObject(InternalEvent.CELLS_ADDED, { @@ -869,7 +869,7 @@ class GraphCells { // Removes edges that are currently not // visible as those cannot be updated const edges = this.getDeletableCells(this.graph.edge.getAllEdges(cells)); - const dict = new mxDictionary(); + const dict = new Dictionary(); for (const cell of cells) { dict.put(cell, true); @@ -906,7 +906,7 @@ class GraphCells { this.graph.batchUpdate(() => { // Creates hashtable for faster lookup - const dict = new mxDictionary(); + const dict = new Dictionary(); for (const cell of cells) { dict.put(cell, true); @@ -1601,7 +1601,7 @@ class GraphCells { this.graph.batchUpdate(() => { // Faster cell lookups to remove relative edge labels with selected // terminals to avoid explicit and implicit move at same time - const dict = new mxDictionary(); + const dict = new Dictionary(); for (const cell of cells) { dict.put(cell, true); diff --git a/packages/core/src/view/cell/TemporaryCellStates.ts b/packages/core/src/view/cell/TemporaryCellStates.ts index 0050f6cd3..63a33a263 100644 --- a/packages/core/src/view/cell/TemporaryCellStates.ts +++ b/packages/core/src/view/cell/TemporaryCellStates.ts @@ -9,7 +9,7 @@ */ import Rectangle from '../geometry/Rectangle'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import GraphView from '../view/GraphView'; import Cell from './datatypes/Cell'; import CellState from './datatypes/CellState'; @@ -98,14 +98,14 @@ class TemporaryCellStates { * @default 0 */ // view: number; - view: mxGraphView | null = null; + view: GraphView | null = null; /** * Holds the height of the rectangle. * @default 0 */ // oldStates: number; - oldStates: mxDictionary | null = null; + oldStates: Dictionary | null = null; /** * Holds the height of the rectangle. @@ -118,7 +118,6 @@ class TemporaryCellStates { * Holds the height of the rectangle. * @default 0 */ - // oldScale: number; oldScale: number = 0; /** @@ -127,7 +126,7 @@ class TemporaryCellStates { */ // destroy(): void; destroy(): void { - const view = this.view; + const view = this.view; view.setScale(this.oldScale); view.setStates(this.oldStates); view.setGraphBounds(this.oldBounds); diff --git a/packages/core/src/view/cell/TreeTraversal.ts b/packages/core/src/view/cell/TreeTraversal.ts index 101e6c69b..9daedfb75 100644 --- a/packages/core/src/view/cell/TreeTraversal.ts +++ b/packages/core/src/view/cell/TreeTraversal.ts @@ -1,9 +1,11 @@ import Cell from "./datatypes/Cell"; import CellArray from "./datatypes/CellArray"; -import mxDictionary from "../../util/mxDictionary"; +import Dictionary from "../../util/Dictionary"; import Graph from "../Graph"; class TreeTraversal { + dependencies = ['connections']; + constructor(graph: Graph) { this.graph = graph; } @@ -40,12 +42,12 @@ class TreeTraversal { for (const cell of parent.getChildren()) { 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 fanIn = 0; 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) { fanOut++; @@ -115,13 +117,13 @@ class TreeTraversal { directed: boolean = true, func: Function | null = null, edge: Cell | null = null, - visited: mxDictionary | null = null, + visited: Dictionary | null = null, inverse: boolean = false ): void { if (func != null && vertex != null) { directed = directed != null ? directed : true; inverse = inverse != null ? inverse : false; - visited = visited || new mxDictionary(); + visited = visited || new Dictionary(); if (!visited.get(vertex)) { visited.put(vertex, true); diff --git a/packages/core/src/view/cell/datatypes/CellArray.ts b/packages/core/src/view/cell/datatypes/CellArray.ts index eef119ad8..2a646b123 100644 --- a/packages/core/src/view/cell/datatypes/CellArray.ts +++ b/packages/core/src/view/cell/datatypes/CellArray.ts @@ -1,5 +1,5 @@ import Cell from "./Cell"; -import mxDictionary from "../../../util/mxDictionary"; +import Dictionary from "../../../util/Dictionary"; import mxObjectIdentity from "../../../util/mxObjectIdentity"; class CellArray extends Array { @@ -102,7 +102,7 @@ class CellArray extends Array { * removed in the cells array to improve performance. */ getTopmostCells(): CellArray { - const dict = new mxDictionary(); + const dict = new Dictionary(); const tmp = new CellArray(); for (let i = 0; i < this.length; i += 1) { @@ -135,7 +135,7 @@ class CellArray extends Array { */ getParents(): Cell[] { const parents = []; - const dict = new mxDictionary(); + const dict = new Dictionary(); for (const cell of this) { const parent = cell.getParent(); diff --git a/packages/core/src/view/cell/datatypes/CellState.ts b/packages/core/src/view/cell/datatypes/CellState.ts index cbf923270..307292e1c 100644 --- a/packages/core/src/view/cell/datatypes/CellState.ts +++ b/packages/core/src/view/cell/datatypes/CellState.ts @@ -11,7 +11,7 @@ import Cell from './Cell'; import GraphView from '../../view/GraphView'; import Shape from '../../geometry/shape/Shape'; import mxText from '../../geometry/shape/mxText'; -import mxDictionary from '../../../util/mxDictionary'; +import Dictionary from '../../../util/Dictionary'; import type { CellStateStyles } from '../../../types'; import Image from "../../image/Image"; @@ -69,7 +69,7 @@ class CellState extends Rectangle { control: Shape | null = null; // Used by mxCellRenderer's createCellOverlays() - overlays: mxDictionary | null = null; + overlays: Dictionary | null = null; /** * Variable: view diff --git a/packages/core/src/view/cell/edge/mxEdgeHandler.js b/packages/core/src/view/cell/edge/EdgeHandler.ts similarity index 99% rename from packages/core/src/view/cell/edge/mxEdgeHandler.js rename to packages/core/src/view/cell/edge/EdgeHandler.ts index cb260b7c0..93b63589e 100644 --- a/packages/core/src/view/cell/edge/mxEdgeHandler.js +++ b/packages/core/src/view/cell/edge/EdgeHandler.ts @@ -34,9 +34,9 @@ import { import utils from '../../../util/Utils'; import ImageShape from '../../geometry/shape/node/ImageShape'; import RectangleShape from '../../geometry/shape/node/RectangleShape'; -import mxConnectionConstraint from '../../connection/mxConnectionConstraint'; +import ConnectionConstraint from '../../connection/ConnectionConstraint'; import InternalEvent from '../../event/InternalEvent'; -import mxConstraintHandler from '../../connection/mxConstraintHandler'; +import ConstraintHandler from '../../connection/ConstraintHandler'; import Rectangle from '../../geometry/Rectangle'; import mxClient from '../../../mxClient'; import EdgeStyle from '../../style/EdgeStyle'; @@ -47,6 +47,9 @@ import { isMouseEvent, isShiftDown, } 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 @@ -60,9 +63,9 @@ import { * mxEdgeHandler.prototype.removeEnabled = true; * ``` * Note: This experimental feature is not recommended for production use. - * @class mxEdgeHandler + * @class EdgeHandler */ -class mxEdgeHandler { +class EdgeHandler { constructor(state) { if (state != null && state.shape != null) { this.state = state; @@ -91,16 +94,14 @@ class mxEdgeHandler { * * Reference to the enclosing . */ - // graph: mxGraph; - graph = null; + graph: Graph; /** * Variable: state * * Reference to the being modified. */ - // state: mxCellState; - state = null; + state: CellState = null; /** * Variable: marker @@ -116,24 +117,21 @@ class mxEdgeHandler { * Holds the used for drawing and highlighting * constraints. */ - // constraintHandler: mxConstraintHandler; - constraintHandler = null; + constraintHandler: ConstraintHandler = null; /** * Variable: error * * Holds the current validation error while a connection is being changed. */ - // error: string; - error = null; + error: string = null; /** * Variable: shape * * Holds the that represents the preview edge. */ - // shape: mxShape; - shape = null; + shape: Shape = null; /** * Variable: bends @@ -373,7 +371,7 @@ class mxEdgeHandler { init() { this.graph = this.state.view.graph; this.marker = this.createMarker(); - this.constraintHandler = new mxConstraintHandler(this.graph); + this.constraintHandler = new ConstraintHandler(this.graph); // Clones the original points from the cell // and makes sure at least one point exists @@ -1512,7 +1510,7 @@ class mxEdgeHandler { this.constraintHandler.currentConstraint = constraint; this.constraintHandler.currentPoint = point; } else { - constraint = new mxConnectionConstraint(); + constraint = new ConnectionConstraint(); } } @@ -2040,7 +2038,7 @@ class mxEdgeHandler { let constraint = this.constraintHandler.currentConstraint; if (constraint == null) { - constraint = new mxConnectionConstraint(); + constraint = new ConnectionConstraint(); } this.graph.connectCell(edge, terminal, isSource, constraint); @@ -2080,7 +2078,7 @@ class mxEdgeHandler { edge, null, isSource, - new mxConnectionConstraint() + new ConnectionConstraint() ); } } finally { @@ -2671,4 +2669,4 @@ class mxEdgeHandler { } } -export default mxEdgeHandler; +export default EdgeHandler; diff --git a/packages/core/src/view/cell/edge/mxEdgeSegmentHandler.js b/packages/core/src/view/cell/edge/EdgeSegmentHandler.ts similarity index 87% rename from packages/core/src/view/cell/edge/mxEdgeSegmentHandler.js rename to packages/core/src/view/cell/edge/EdgeSegmentHandler.ts index 734c5ce19..7d7ee0ec1 100644 --- a/packages/core/src/view/cell/edge/mxEdgeSegmentHandler.js +++ b/packages/core/src/view/cell/edge/EdgeSegmentHandler.ts @@ -7,22 +7,25 @@ import Point from '../../geometry/Point'; import { CURSOR_TERMINAL_HANDLE } from '../../../util/Constants'; import Rectangle from '../../geometry/Rectangle'; -import utils from '../../../util/Utils'; -import mxElbowEdgeHandler from './mxElbowEdgeHandler'; +import utils, { contains, setOpacity } from '../../../util/Utils'; +import ElbowEdgeHandler from './ElbowEdgeHandler'; +import CellState from '../datatypes/CellState'; +import Cell from '../datatypes/Cell'; -class mxEdgeSegmentHandler extends mxElbowEdgeHandler { - constructor(state) { +class EdgeSegmentHandler extends ElbowEdgeHandler { + constructor(state: CellState) { // WARNING: should be super of mxEdgeHandler! super(state); } + points: Point[] | null = null; + /** * Function: getCurrentPoints * * Returns the current absolute points. */ - // getCurrentPoints(): mxPoint[]; - getCurrentPoints() { + getCurrentPoints(): Point[] { let pts = this.state.absolutePoints; 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. */ - // getPreviewPoints(point: mxPoint): mxPoint[]; - getPreviewPoints(point) { + getPreviewPoints(point: Point): Point[] { if (this.isSource || this.isTarget) { return super.getPreviewPoints(point); } @@ -100,8 +102,8 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { const y = result[0].y * scale + tr.y; if ( - (source != null && utils.contains(source, x, y)) || - (target != null && utils.contains(target, x, y)) + (source != null && contains(source, x, y)) || + (target != null && contains(target, x, y)) ) { result = [point, point]; } @@ -115,8 +117,11 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { * * Overridden to perform optimization of the edge style result. */ - // updatePreviewState(edge: mxCell, point: mxPoint, terminalState: mxCellState, me: mxMouseEvent): void; - updatePreviewState(edge, point, terminalState, me) { + updatePreviewState(edge: Cell, + point: Point, + terminalState: CellState, + me: MouseEvent): void { + super.updatePreviewState(edge, point, terminalState, me); // 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; // 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) { - const pt = this.graph.getConnectionPoint(target, tc); + const pt = this.graph.connection.getConnectionPoint(target, tc); if (pt != null) { 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; @@ -212,8 +217,12 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { /** * Overriden to merge edge segments. */ - // connect(edge: mxCell, terminal: mxCell, isSource: boolean, isClone: boolean, me: mxMouseEvent): mxCell; - connect(edge, terminal, isSource, isClone, me) { + connect(edge: Cell, + terminal: Cell, + isSource: boolean, + isClone: boolean, + me: MouseEvent): Cell { + const model = this.graph.getModel(); let geo = edge.getGeometry(); let result = null; @@ -242,8 +251,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } } - model.beginUpdate(); - try { + this.graph.batchUpdate(() => { if (result != null) { geo = edge.getGeometry(); @@ -254,11 +262,8 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { model.setGeometry(edge, geo); } } - edge = super.connect(edge, terminal, isSource, isClone, me); - } finally { - model.endUpdate(); - } + }); return edge; } @@ -268,8 +273,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { * * Returns no tooltips. */ - // getTooltipForNode(node: any): string; - getTooltipForNode(node) { + getTooltipForNode(node: any): string { return null; } @@ -279,7 +283,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { * Adds custom bends for the center of each segment. */ // 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); if ( @@ -288,7 +292,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { !this.isSource && !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 before the redraw. */ - // redraw(): void; - redraw() { + redraw(): void { this.refresh(); super.redraw(); } @@ -354,8 +357,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { * * Updates the position of the custom bends. */ - // redrawInnerBends(p0: mxPoint, pe: mxPoint): void; - redrawInnerBends(p0, pe) { + redrawInnerBends(p0: Point, pe: Point): void { if (this.graph.isCellBendable(this.state.cell)) { const pts = this.getCurrentPoints(); @@ -405,12 +407,12 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } if (straight) { - utils.setOpacity(this.bends[1].node, this.virtualBendOpacity); - utils.setOpacity(this.bends[3].node, this.virtualBendOpacity); + setOpacity(this.bends[1].node, this.virtualBendOpacity); + setOpacity(this.bends[3].node, this.virtualBendOpacity); } } } } } -export default mxEdgeSegmentHandler; +export default EdgeSegmentHandler; diff --git a/packages/core/src/view/cell/edge/mxElbowEdgeHandler.js b/packages/core/src/view/cell/edge/ElbowEdgeHandler.ts similarity index 98% rename from packages/core/src/view/cell/edge/mxElbowEdgeHandler.js rename to packages/core/src/view/cell/edge/ElbowEdgeHandler.ts index bec4f1ae8..82ae75978 100644 --- a/packages/core/src/view/cell/edge/mxElbowEdgeHandler.js +++ b/packages/core/src/view/cell/edge/ElbowEdgeHandler.ts @@ -4,7 +4,7 @@ * Updated to ES9 syntax by David Morrissey 2021 * Type definitions from the typed-mxgraph project */ -import mxEdgeHandler from './mxEdgeHandler'; +import EdgeHandler from './EdgeHandler'; import { CURSOR_TERMINAL_HANDLE, EDGESTYLE_ELBOW, @@ -37,7 +37,7 @@ import { isConsumed } from '../../../util/EventUtils'; * * state - of the cell to be modified. */ -class mxElbowEdgeHandler extends mxEdgeHandler { +class ElbowEdgeHandler extends EdgeHandler { constructor(state) { super(state); } @@ -254,4 +254,4 @@ class mxElbowEdgeHandler extends mxEdgeHandler { } } -export default mxElbowEdgeHandler; +export default ElbowEdgeHandler; diff --git a/packages/core/src/view/cell/edge/Edge.ts b/packages/core/src/view/cell/edge/GraphEdge.ts similarity index 97% rename from packages/core/src/view/cell/edge/Edge.ts rename to packages/core/src/view/cell/edge/GraphEdge.ts index e1156d1d0..6c2b08ada 100644 --- a/packages/core/src/view/cell/edge/Edge.ts +++ b/packages/core/src/view/cell/edge/GraphEdge.ts @@ -7,10 +7,10 @@ import { import Geometry from "../../geometry/Geometry"; import EventObject from "../../event/EventObject"; import InternalEvent from "../../event/InternalEvent"; -import mxDictionary from "../../../util/mxDictionary"; +import Dictionary from "../../../util/Dictionary"; import Graph from "../../Graph"; -class Edge { +class GraphEdge { constructor(graph: Graph) { this.graph = graph; } @@ -77,6 +77,75 @@ class Edge { */ 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 *****************************************************************************/ @@ -109,22 +178,19 @@ class Edge { // flipEdge(edge: mxCell): mxCell; flipEdge(edge: Cell): Cell { if (this.alternateEdgeStyle != null) { - this.getModel().beginUpdate(); - try { + this.graph.batchUpdate(() => { const style = edge.getStyle(); if (style == null || style.length === 0) { - this.getModel().setStyle(edge, this.alternateEdgeStyle); + this.graph.model.setStyle(edge, this.alternateEdgeStyle); } else { - this.getModel().setStyle(edge, null); + this.graph.model.setStyle(edge, null); } // Removes all existing control points this.resetEdge(edge); - this.fireEvent(new EventObject(InternalEvent.FLIP_EDGE, 'edge', edge)); - } finally { - this.getModel().endUpdate(); - } + this.graph.fireEvent(new EventObject(InternalEvent.FLIP_EDGE, 'edge', edge)); + }); } return edge; } @@ -507,7 +573,7 @@ class Edge { resetEdges(cells: CellArray): void { if (cells != null) { // Prepares faster cells lookup - const dict = new mxDictionary(); + const dict = new Dictionary(); for (let i = 0; i < cells.length; i += 1) { dict.put(cells[i], true); @@ -562,75 +628,6 @@ class 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; diff --git a/packages/core/src/view/cell/vertex/Vertex.ts b/packages/core/src/view/cell/vertex/GraphVertex.ts similarity index 98% rename from packages/core/src/view/cell/vertex/Vertex.ts rename to packages/core/src/view/cell/vertex/GraphVertex.ts index 8812998da..b62fe45e0 100644 --- a/packages/core/src/view/cell/vertex/Vertex.ts +++ b/packages/core/src/view/cell/vertex/GraphVertex.ts @@ -2,7 +2,7 @@ import Cell from "../datatypes/Cell"; import Geometry from "../../geometry/Geometry"; import CellArray from "../datatypes/CellArray"; -class Vertex { +class GraphVertex { /** * Specifies the return value for vertices in {@link isLabelMovable}. @@ -174,4 +174,6 @@ class Vertex { setVertexLabelsMovable(value: boolean): void { this.vertexLabelsMovable = value; } -} \ No newline at end of file +} + +export default GraphVertex; \ No newline at end of file diff --git a/packages/core/src/view/cell/edge/mxHandle.js b/packages/core/src/view/cell/vertex/VertexHandle.ts similarity index 68% rename from packages/core/src/view/cell/edge/mxHandle.js rename to packages/core/src/view/cell/vertex/VertexHandle.ts index 696975656..26cdc9154 100644 --- a/packages/core/src/view/cell/edge/mxHandle.js +++ b/packages/core/src/view/cell/vertex/VertexHandle.ts @@ -5,12 +5,13 @@ * 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 ImageShape from '../../geometry/shape/node/ImageShape'; import Rectangle from '../../geometry/Rectangle'; import RectangleShape from '../../geometry/shape/node/RectangleShape'; import { + DIALECT_MIXEDHTML, DIALECT_STRICTHTML, DIALECT_SVG, HANDLE_FILLCOLOR, @@ -18,71 +19,78 @@ import { HANDLE_STROKECOLOR, } from '../../../util/Constants'; 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. * - * @class mxHandle + * @class VertexHandle */ -class mxHandle { - constructor(state, cursor, image, shape) { +class VertexHandle { + dependencies = ['snap', 'cells']; + + constructor(state: CellState, + cursor: string | null = 'default', + image: Image | null = null, + shape: Shape | null = null) { + this.graph = state.view.graph; this.state = state; this.cursor = cursor != null ? cursor : this.cursor; this.image = image != null ? image : this.image; - this.shape = shape != null ? shape : null; + this.shape = shape; this.init(); } + graph: Graph; + state: CellState; + shape: Shape | ImageShape | null; + /** * Specifies the cursor to be used for this handle. Default is 'default'. */ - // cursor: string; - cursor = 'default'; + cursor: string = 'default'; /** * Specifies the to be used to render the handle. Default is null. */ - // image: mxImage; - image = null; + image: Image | null = null; /** * Default is false. */ - // ignoreGrid: boolean; - ignoreGrid = false; + ignoreGrid: boolean = false; /** * Hook for subclassers to return the current position of the handle. */ - // getPosition(bounds: mxRectangle): any; - getPosition(bounds) {} + getPosition(bounds: Rectangle) {} /** * Hooks for subclassers to update the style in the . */ - // setPosition(bounds: mxRectangle, pt: any, me: any): any; - setPosition(bounds, pt, me) {} + setPosition(bounds: Rectangle, pt: Point, me: InternalMouseEvent) {} /** * Hook for subclassers to execute the handle. */ - // execute(me: mxMouseEvent): void; - execute(me) {} + execute(me: InternalMouseEvent): void {} /** * Sets the cell style with the given name to the corresponding value in . */ - // copyStyle(key: string): void; - copyStyle(key) { + copyStyle(key: string): void { this.graph.setCellStyles(key, this.state.style[key], [this.state.cell]); } /** * Processes the given and invokes . */ - // processEvent(me: mxMouseEvent): void; - processEvent(me) { + processEvent(me: InternalMouseEvent): void { const { scale } = this.graph.view; const tr = this.graph.view.translate; 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 - const alpha1 = -utils.toRadians(this.getRotation()); - const alpha2 = -utils.toRadians(this.getTotalRotation()) - alpha1; + const alpha1 = -toRadians(this.getRotation()); + const alpha2 = -toRadians(this.getTotalRotation()) - alpha1; pt = this.flipPoint( this.rotatePoint( this.snapPoint( this.rotatePoint(pt, alpha1), - this.ignoreGrid || !this.graph.isGridEnabledEvent(me.getEvent()) + this.ignoreGrid || !this.graph.snap.isGridEnabledEvent(me.getEvent()) ), alpha2 ) @@ -116,8 +124,7 @@ class mxHandle { * Should be called after in . * This repaints the state using . */ - // positionChanged(): void; - positionChanged() { + positionChanged(): void { if (this.state.text != null) { this.state.text.apply(this.state); } @@ -132,12 +139,10 @@ class mxHandle { /** * Returns the rotation defined in the style of the cell. */ - // getRotation(): number; - getRotation() { + getRotation(): number { if (this.state.shape != null) { return this.state.shape.getRotation(); } - return 0; } @@ -145,20 +150,17 @@ class mxHandle { * Returns the rotation from the style and the rotation from the direction of * the cell. */ - // getTotalRotation(): number; - getTotalRotation() { + getTotalRotation(): number { if (this.state.shape != null) { return this.state.shape.getShapeRotation(); } - return 0; } /** * Creates and initializes the shapes required for this handle. */ - // init(): void; - init() { + init(): void { const html = this.isHtmlRequired(); if (this.image != null) { @@ -177,53 +179,53 @@ class mxHandle { /** * Creates and returns the shape for this handle. */ - // createShape(html: any): mxShape; - createShape(html) { + createShape(html: any): Shape { const bounds = new Rectangle(0, 0, HANDLE_SIZE, HANDLE_SIZE); - return new RectangleShape(bounds, HANDLE_FILLCOLOR, HANDLE_STROKECOLOR); } /** * Initializes and sets its cursor. */ - // initShape(html: any): void; - initShape(html) { - if (html && this.shape.isHtmlAllowed()) { - this.shape.dialect = DIALECT_STRICTHTML; - this.shape.init(this.graph.container); + initShape(html: any): void { + const shape = this.shape; + + if (html && shape.isHtmlAllowed()) { + shape.dialect = DIALECT_STRICTHTML; + shape.init(this.graph.container); } else { - this.shape.dialect = + shape.dialect = this.graph.dialect !== DIALECT_SVG ? DIALECT_MIXEDHTML : DIALECT_SVG; 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); - this.shape.node.style.cursor = this.cursor; + InternalEvent.redirectMouseEvents(shape.node, this.graph, this.state); + shape.node.style.cursor = this.cursor; } /** * Renders the shape for this handle. */ - // redraw(): void; - redraw() { + redraw(): void { if (this.shape != null && this.state.shape != null) { let pt = this.getPosition(this.state.getPaintBounds()); if (pt != null) { - const alpha = utils.toRadians(this.getTotalRotation()); + const alpha = toRadians(this.getTotalRotation()); pt = this.rotatePoint(this.flipPoint(pt), alpha); const { scale } = this.graph.view; const tr = this.graph.view.translate; - this.shape.bounds.x = Math.floor( - (pt.x + tr.x) * scale - this.shape.bounds.width / 2 + const shapeBounds = this.shape.bounds; + + shapeBounds.x = Math.floor( + (pt.x + tr.x) * scale - shapeBounds.width / 2 ); - this.shape.bounds.y = Math.floor( - (pt.y + tr.y) * scale - this.shape.bounds.height / 2 + shapeBounds.y = Math.floor( + (pt.y + tr.y) * scale - shapeBounds.height / 2 ); // 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 * the text node is in the graph container. */ - // isHtmlRequired(): boolean; - isHtmlRequired() { + isHtmlRequired(): boolean { return ( this.state.text != null && this.state.text.node.parentNode === this.graph.container @@ -247,23 +248,21 @@ class mxHandle { /** * Rotates the point by the given angle. */ - // rotatePoint(pt: mxPoint, alpha: boolean): mxPoint; - rotatePoint(pt, alpha) { - const bounds = this.state.getCellBounds(); + rotatePoint(pt: Point, alpha: number): Point { + const bounds = this.state.getCellBounds(); const cx = new Point(bounds.getCenterX(), bounds.getCenterY()); const cos = Math.cos(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. */ - // flipPoint(pt: mxPoint): mxPoint; - flipPoint(pt) { + flipPoint(pt: Point): Point { if (this.state.shape != null) { - const bounds = this.state.getCellBounds(); + const bounds = this.state.getCellBounds(); if (this.state.shape.flipH) { pt.x = 2 * bounds.x + bounds.width - pt.x; @@ -273,7 +272,6 @@ class mxHandle { pt.y = 2 * bounds.y + bounds.height - pt.y; } } - return pt; } @@ -281,21 +279,18 @@ class mxHandle { * Snaps the given point to the grid if ignore is false. This modifies * the given point in-place and also returns it. */ - // snapPoint(pt: mxPoint, ignore: boolean): mxPoint; - snapPoint(pt, ignore) { + snapPoint(pt: Point, ignore: boolean): Point { if (!ignore) { - pt.x = this.graph.snap(pt.x); - pt.y = this.graph.snap(pt.y); + pt.x = this.graph.snap.snap(pt.x); + pt.y = this.graph.snap.snap(pt.y); } - return pt; } /** * Shows or hides this handle. */ - // setVisible(visible: boolean): void; - setVisible(visible) { + setVisible(visible: boolean): void { if (this.shape != null && this.shape.node != null) { 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. */ - // reset(): void; - reset() { + reset(): void { this.setVisible(true); - this.state.style = this.graph.getCellStyle(this.state.cell); + this.state.style = this.graph.cells.getCellStyle(this.state.cell); this.positionChanged(); } /** * Destroys this handle. */ - // destroy(): void; - destroy() { + destroy(): void { if (this.shape != null) { this.shape.destroy(); this.shape = null; @@ -323,4 +316,4 @@ class mxHandle { } } -export default mxHandle; +export default VertexHandle; diff --git a/packages/core/src/view/cell/vertex/mxVertexHandler.js b/packages/core/src/view/cell/vertex/VertexHandler.ts similarity index 97% rename from packages/core/src/view/cell/vertex/mxVertexHandler.js rename to packages/core/src/view/cell/vertex/VertexHandler.ts index cb7c44a2a..28ddfa9f9 100644 --- a/packages/core/src/view/cell/vertex/mxVertexHandler.js +++ b/packages/core/src/view/cell/vertex/VertexHandler.ts @@ -28,6 +28,10 @@ import Point from '../../geometry/Point'; import utils from '../../../util/Utils'; import mxClient from '../../../mxClient'; 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 @@ -44,46 +48,49 @@ import { isMouseEvent, isShiftDown } from '../../../util/EventUtils'; * * state - of the cell to be resized. */ -class mxVertexHandler { - constructor(state) { - if (state != null) { - this.state = state; - this.init(); +class VertexHandler { + dependencies = ['selection', 'cells']; - // Handles escape keystrokes - this.escapeHandler = (sender, evt) => { - if (this.livePreview && this.index != null) { - // Redraws the live preview - this.state.view.graph.cellRenderer.redraw(this.state, true); + constructor(state: CellState) { + this.state = state; + this.init(); - // Redraws connected edges - this.state.view.invalidate(this.state.cell); - this.state.invalid = false; - this.state.view.validate(); - } + // Handles escape keystrokes + this.escapeHandler = (sender, evt) => { + if (this.livePreview && this.index != null) { + // 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 * * Reference to the enclosing . */ - // graph: mxGraph; - graph = null; + graph?: Graph; /** * Variable: state * * Reference to the being modified. */ - // state: mxCellState; - state = null; + state: CellState; /** * Variable: singleSizer @@ -91,16 +98,14 @@ class mxVertexHandler { * Specifies if only one sizer handle at the bottom, right corner should be * used. Default is false. */ - // singleSizer: boolean; - singleSizer = false; + singleSizer: boolean = false; /** * Variable: index * * Holds the index of the current handle. */ - // index: number; - index = null; + index: number | null = null; /** * Variable: allowHandleBoundsCheck @@ -108,16 +113,14 @@ class mxVertexHandler { * Specifies if the bounds of handles should be used for hit-detection in IE or * if > 0. Default is true. */ - // allowHandleBoundsCheck: boolean; - allowHandleBoundsCheck = true; + allowHandleBoundsCheck: boolean = true; /** * Variable: handleImage * * Optional to be used as handles. Default is null. */ - // handleImage: mxImage; - handleImage = null; + handleImage: Image | null = null; /** * Variable: handlesVisible @@ -131,16 +134,14 @@ class mxVertexHandler { * * Optional tolerance for hit-detection in . Default is 0. */ - // tolerance: number; - tolerance = 0; + tolerance: number = 0; /** * Variable: rotationEnabled * * Specifies if a rotation handle should be visible. Default is false. */ - // rotationEnabled: boolean; - rotationEnabled = false; + rotationEnabled: boolean = false; /** * Variable: parentHighlightEnabled @@ -148,8 +149,7 @@ class mxVertexHandler { * Specifies if the parent should be highlighted if a child cell is selected. * Default is false. */ - // parentHighlightEnabled: boolean; - parentHighlightEnabled = false; + parentHighlightEnabled: boolean = false; /** * Variable: rotationRaster @@ -157,16 +157,14 @@ class mxVertexHandler { * Specifies if rotation steps should be "rasterized" depening on the distance * to the handle. Default is true. */ - // rotationRaster: boolean; - rotationRaster = true; + rotationRaster: boolean = true; /** * Variable: rotationCursor * * Specifies the cursor for the rotation handle. Default is 'crosshair'. */ - // rotationCursor: string; - rotationCursor = 'crosshair'; + rotationCursor: string = 'crosshair'; /** * Variable: livePreview @@ -174,15 +172,14 @@ class mxVertexHandler { * Specifies if resize should change the cell in-place. This is an experimental * feature for non-touch devices. Default is false. */ - // livePreview: boolean; - livePreview = false; + livePreview: boolean = false; /** * Variable: movePreviewToFront * * Specifies if the live preview should be moved to the front. */ - movePreviewToFront = false; + movePreviewToFront: boolean = false; /** * Variable: manageSizers @@ -190,8 +187,7 @@ class mxVertexHandler { * Specifies if sizers should be hidden and spaced if the vertex is small. * Default is false. */ - // manageSizers: boolean; - manageSizers = false; + manageSizers: boolean = false; /** * Variable: constrainGroupByChildren @@ -199,16 +195,14 @@ class mxVertexHandler { * Specifies if the size of groups should be constrained by the children. * Default is false. */ - // constrainGroupByChildren: boolean; - constrainGroupByChildren = false; + constrainGroupByChildren: boolean = false; /** * Variable: rotationHandleVSpacing * * Vertical spacing for rotation icon. Default is -16. */ - // rotationHandleVSpacing: number; - rotationHandleVSpacing = -16; + rotationHandleVSpacing: number = -16; /** * Variable: horizontalOffset @@ -216,8 +210,7 @@ class mxVertexHandler { * The horizontal offset for the handles. This is updated in * if is true and the sizers are offset horizontally. */ - // horizontalOffset: number; - horizontalOffset = 0; + horizontalOffset: number = 0; /** * Variable: verticalOffset @@ -225,16 +218,14 @@ class mxVertexHandler { * The horizontal offset for the handles. This is updated in * if is true and the sizers are offset vertically. */ - // verticalOffset: number; - verticalOffset = 0; + verticalOffset: number = 0; /** * Function: init * * Initializes the shapes required for this vertex handler. */ - // init(): void; - init() { + init(): void { this.graph = this.state.view.graph; this.selectionBounds = this.getSelectionBounds(this.state); this.bounds = new Rectangle( @@ -264,7 +255,7 @@ class mxVertexHandler { // Adds the sizer handles if ( 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); this.sizers = []; @@ -2309,4 +2300,4 @@ class mxVertexHandler { } } -export default mxVertexHandler; +export default VertexHandler; diff --git a/packages/core/src/view/connection/mxConnectionConstraint.ts b/packages/core/src/view/connection/ConnectionConstraint.ts similarity index 89% rename from packages/core/src/view/connection/mxConnectionConstraint.ts rename to packages/core/src/view/connection/ConnectionConstraint.ts index e6d6515cd..e7e627f63 100644 --- a/packages/core/src/view/connection/mxConnectionConstraint.ts +++ b/packages/core/src/view/connection/ConnectionConstraint.ts @@ -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. - * @class mxConnectionConstraint + * @class ConnectionConstraint */ -class mxConnectionConstraint { +class ConnectionConstraint { constructor( point: Point | null = null, perimeter: boolean = true, @@ -31,7 +31,6 @@ class mxConnectionConstraint { * * that specifies the fixed location of the connection point. */ - // point: mxPoint; point: Point | null = null; /** @@ -40,7 +39,6 @@ class mxConnectionConstraint { * Boolean that specifies if the point should be projected onto the perimeter * of the terminal. */ - // perimeter: boolean; perimeter: boolean = true; /** @@ -48,7 +46,6 @@ class mxConnectionConstraint { * * Optional string that specifies the name of the constraint. */ - // name: string; name: string | null = null; /** @@ -66,4 +63,4 @@ class mxConnectionConstraint { dy: number | null = null; } -export default mxConnectionConstraint; +export default ConnectionConstraint; diff --git a/packages/core/src/view/connection/mxConnectionHandler.ts b/packages/core/src/view/connection/ConnectionHandler.ts similarity index 98% rename from packages/core/src/view/connection/mxConnectionHandler.ts rename to packages/core/src/view/connection/ConnectionHandler.ts index 2914a20a4..812a278c2 100644 --- a/packages/core/src/view/connection/mxConnectionHandler.ts +++ b/packages/core/src/view/connection/ConnectionHandler.ts @@ -23,7 +23,7 @@ import utils from '../../util/Utils'; import InternalMouseEvent from '../event/InternalMouseEvent'; import ImageShape from '../geometry/shape/node/ImageShape'; import CellMarker from '../cell/CellMarker'; -import mxConstraintHandler from './mxConstraintHandler'; +import ConstraintHandler from './ConstraintHandler'; import mxPolyline from '../geometry/shape/edge/mxPolyline'; import EventSource from '../event/EventSource'; import Rectangle from '../geometry/Rectangle'; @@ -38,6 +38,7 @@ import { import graph from '../Graph'; import Image from '../image/Image'; import CellState from '../cell/datatypes/CellState'; +import Graph from '../Graph'; 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 * the that represents the new edge. */ -class mxConnectionHandler extends EventSource { - constructor(graph: graph, factoryMethod: FactoryMethod | null = null) { +class ConnectionHandler extends EventSource { + constructor(graph: Graph, factoryMethod: FactoryMethod | null = null) { super(); this.graph = graph; @@ -218,8 +219,7 @@ class mxConnectionHandler extends EventSource { * * Reference to the enclosing . */ - // graph: mxGraph; - graph: graph; + graph: Graph; /** * Variable: factoryMethod @@ -228,7 +228,6 @@ class mxConnectionHandler extends EventSource { * source and target as the first and second argument and returns * a new that represents the edge. This is used in . */ - // factoryMethod: (source: mxCell, target: mxCell, style?: string) => mxCell; factoryMethod: FactoryMethod | null = null; /** @@ -298,7 +297,7 @@ class mxConnectionHandler extends EventSource { * * Holds the used for finding source and target cells. */ - marker: CellMarker; + marker?: CellMarker; /** * Variable: constraintHandler @@ -306,15 +305,14 @@ class mxConnectionHandler extends EventSource { * Holds the used for drawing and highlighting * constraints. */ - constraintHandler: mxConstraintHandler | null = null; + constraintHandler: ConstraintHandler | null = null; /** * Variable: error * * Holds the current validation error while connections are being created. */ - // error: any; - error = null; + error: any = null; /** * Variable: waypointsEnabled @@ -364,16 +362,14 @@ class mxConnectionHandler extends EventSource { * * Holds the change event listener for later removal. */ - // changeHandler: any; - changeHandler = null; + changeHandler: any = null; /** * Variable: drillHandler * * Holds the drill event listener for later removal. */ - // drillHandler: any; - drillHandler = null; + drillHandler: any = null; /** * Variable: mouseDownCounter @@ -414,8 +410,7 @@ class mxConnectionHandler extends EventSource { * * Specifies the cursor to be used while the handler is active. Default is null. */ - // cursor: string; - cursor = null; + cursor: string = null; /** * Variable: insertBeforeSource @@ -528,11 +523,10 @@ class mxConnectionHandler extends EventSource { * be invoked if is assigned after the connection * handler has been created. */ - // init(): void; - init() { - this.graph.addMouseListener(this); - this.marker = this.createMarker(); - this.constraintHandler = new mxConstraintHandler(this.graph); + init(): void { + this.graph.event.addMouseListener(this); + this.marker = this.createMarker(); + this.constraintHandler = new ConstraintHandler(this.graph); // Redraws the icons if the graph changes this.changeHandler = (sender) => { @@ -2342,4 +2336,4 @@ class mxConnectionHandler extends EventSource { } } -export default mxConnectionHandler; +export default ConnectionHandler; diff --git a/packages/core/src/view/connection/mxConstraintHandler.js b/packages/core/src/view/connection/ConstraintHandler.ts similarity index 99% rename from packages/core/src/view/connection/mxConstraintHandler.js rename to packages/core/src/view/connection/ConstraintHandler.ts index ca1579be6..82556b2e9 100644 --- a/packages/core/src/view/connection/mxConstraintHandler.js +++ b/packages/core/src/view/connection/ConstraintHandler.ts @@ -26,9 +26,9 @@ import { isShiftDown } from '../../util/EventUtils'; * showing fixed points when the mouse is over a vertex and handles constraints * to establish new connections. * - * @class mxConstraintHandler + * @class ConstraintHandler */ -class mxConstraintHandler { +class ConstraintHandler { constructor(graph) { this.graph = graph; diff --git a/packages/core/src/view/connection/GraphConnections.ts b/packages/core/src/view/connection/GraphConnections.ts index 5e902006e..13ed9ad68 100644 --- a/packages/core/src/view/connection/GraphConnections.ts +++ b/packages/core/src/view/connection/GraphConnections.ts @@ -1,7 +1,7 @@ import Point from "../geometry/Point"; import CellState from "../cell/datatypes/CellState"; import InternalMouseEvent from "../event/InternalMouseEvent"; -import mxConnectionConstraint from "./mxConnectionConstraint"; +import ConnectionConstraint from "./ConnectionConstraint"; import Rectangle from "../geometry/Rectangle"; import {DIRECTION_NORTH, DIRECTION_SOUTH, DIRECTION_WEST} from "../../util/Constants"; 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 EventObject from "../event/EventObject"; import InternalEvent from "../event/InternalEvent"; -import mxDictionary from "../../util/mxDictionary"; +import Dictionary from "../../util/Dictionary"; import Geometry from "../geometry/Geometry"; import Graph from "../Graph"; -import mxConnectionHandler from "./mxConnectionHandler"; +import ConnectionHandler from "./ConnectionHandler"; class GraphConnections { constructor(graph: Graph) { @@ -32,10 +32,10 @@ class GraphConnections { point: Point, terminalState: CellState, me: InternalMouseEvent - ): mxConnectionConstraint | null { + ): ConnectionConstraint | null { if (terminalState.shape != null) { const bounds = ( - this.getView().getPerimeterBounds(terminalState) + this.graph.view.getPerimeterBounds(terminalState) ); const direction = terminalState.style.direction; @@ -111,7 +111,7 @@ class GraphConnections { ? 0 : 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; } @@ -127,7 +127,7 @@ class GraphConnections { getAllConnectionConstraints( terminal: CellState, source: boolean - ): mxConnectionConstraint[] | null { + ): ConnectionConstraint[] | null { if ( terminal != 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}. * * @param edge {@link mxCellState} that represents the edge. @@ -150,7 +150,7 @@ class GraphConnections { edge: CellState, terminal: CellState | null = null, source: boolean = false - ): mxConnectionConstraint { + ): ConnectionConstraint { let point = null; // @ts-ignore const x = edge.style[source ? 'exitX' : 'entryX']; @@ -189,25 +189,25 @@ class GraphConnections { 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 * constraint from the given edge, use an empty constraint instead. * * @param edge {@link mxCell} that represents the edge. * @param terminal {@link mxCell} that represents the terminal. * @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. */ setConnectionConstraint( edge: Cell, terminal: Cell, source: boolean = false, - constraint: mxConnectionConstraint | null = null + constraint: ConnectionConstraint | null = null ): void { if (constraint != null) { this.getModel().beginUpdate(); @@ -276,13 +276,13 @@ class GraphConnections { */ getConnectionPoint( vertex: CellState, - constraint: mxConnectionConstraint, + constraint: ConnectionConstraint, round: boolean = true ): Point { let point = null; if (vertex != null && constraint.point != null) { - const bounds = this.getView().getPerimeterBounds(vertex); + const bounds = this.graph.view.getPerimeterBounds(vertex); const cx = new point(bounds.getCenterX(), bounds.getCenterY()); const direction = vertex.style.direction; let r1 = 0; @@ -336,7 +336,7 @@ class GraphConnections { point = getRotatedPoint(point, cos, sin, cx); } - point = this.getView().getPerimeterPoint(vertex, point, false); + point = this.graph.view.getPerimeterPoint(vertex, point, false); } else { r2 += r1; @@ -393,14 +393,14 @@ class GraphConnections { * @param edge {@link mxCell} whose terminal should be updated. * @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 constraint Optional {@link mxConnectionConstraint} to be used for this + * @param constraint Optional {@link ConnectionConstraint} to be used for this * connection. */ connectCell( edge: Cell, terminal: Cell, source: boolean = false, - constraint: mxConnectionConstraint | null = null + constraint: ConnectionConstraint | null = null ): Cell { this.getModel().beginUpdate(); try { @@ -439,7 +439,7 @@ class GraphConnections { edge: Cell, terminal: Cell, source: boolean = false, - constraint: mxConnectionConstraint | null = null + constraint: ConnectionConstraint | null = null ): void { if (edge != null) { this.getModel().beginUpdate(); @@ -500,10 +500,10 @@ class GraphConnections { this.getModel().beginUpdate(); try { const { scale } = this.view; - const tr = this.getView().translate; + const tr = this.graph.view.translate; // Fast lookup for finding cells in array - const dict = new mxDictionary(); + const dict = new Dictionary(); for (let i = 0; i < cells.length; i += 1) { dict.put(cells[i], true); @@ -514,9 +514,9 @@ class GraphConnections { let geo = cell.getGeometry(); if (geo != null) { - const state = this.getView().getState(cell); + const state = this.graph.view.getState(cell); const pstate = ( - this.getView().getState(cell.getParent()) + this.graph.view.getState(cell.getParent()) ); if (state != null && pstate != null) { @@ -733,19 +733,19 @@ class GraphConnections { /** * 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. */ setConnectable(connectable: boolean): void { - (this.connectionHandler).setEnabled(connectable); + (this.connectionHandler).setEnabled(connectable); } /** * Returns true if the {@link connectionHandler} is enabled. */ isConnectable(): boolean { - return (this.connectionHandler).isEnabled(); + return (this.connectionHandler).isEnabled(); } } diff --git a/packages/core/src/view/drag_drop/DragSource.js b/packages/core/src/view/drag_drop/DragSource.ts similarity index 100% rename from packages/core/src/view/drag_drop/DragSource.js rename to packages/core/src/view/drag_drop/DragSource.ts diff --git a/packages/core/src/view/editing/InPlaceEditing.ts b/packages/core/src/view/editing/GraphEditing.ts similarity index 99% rename from packages/core/src/view/editing/InPlaceEditing.ts rename to packages/core/src/view/editing/GraphEditing.ts index a564f0df7..d00afc28a 100644 --- a/packages/core/src/view/editing/InPlaceEditing.ts +++ b/packages/core/src/view/editing/GraphEditing.ts @@ -6,7 +6,7 @@ import CellEditor from "./CellEditor"; import InternalMouseEvent from "../event/InternalMouseEvent"; import Graph from "../Graph"; -class InPlaceEditing { +class GraphEditing { constructor(graph: Graph) { this.graph = graph; } @@ -248,4 +248,4 @@ class InPlaceEditing { } } -export default InPlaceEditing; +export default GraphEditing; diff --git a/packages/core/src/view/event/EventSource.js b/packages/core/src/view/event/EventSource.ts similarity index 72% rename from packages/core/src/view/event/EventSource.js rename to packages/core/src/view/event/EventSource.ts index 7d1376bba..ef282ddd6 100644 --- a/packages/core/src/view/event/EventSource.js +++ b/packages/core/src/view/event/EventSource.ts @@ -30,8 +30,8 @@ import EventObject from './EventObject'; * Constructs a new event source. */ class EventSource { - constructor(eventSource) { - this.setEventSource(eventSource); + constructor(eventSource: EventSource) { + this.eventSource = eventSource; } /** @@ -41,32 +41,28 @@ class EventSource { * contains the event name followed by the respective listener for each * registered listener. */ - // eventListeners: any[]; - eventListeners = null; + eventListeners: ({funct: Function, name: string})[] = []; /** * Variable: eventsEnabled * * Specifies if events can be fired. Default is true. */ - // eventsEnabled: boolean; - eventsEnabled = true; + eventsEnabled: boolean = true; /** * Variable: eventSource * * Optional source for events. Default is null. */ - // eventSource: any; - eventSource = null; + eventSource: EventSource; /** * Function: isEventsEnabled * * Returns . */ - // isEventsEnabled(): boolean; - isEventsEnabled() { + isEventsEnabled(): boolean { return this.eventsEnabled; } @@ -75,8 +71,7 @@ class EventSource { * * Sets . */ - // setEventsEnabled(value: boolean): void; - setEventsEnabled(value) { + setEventsEnabled(value: boolean): void { this.eventsEnabled = value; } @@ -85,8 +80,7 @@ class EventSource { * * Returns . */ - // getEventSource(): any; - getEventSource() { + getEventSource(): EventSource { return this.eventSource; } @@ -95,8 +89,7 @@ class EventSource { * * Sets . */ - // setEventSource(value: any): void; - setEventSource(value) { + setEventSource(value: EventSource): void { this.eventSource = value; } @@ -108,14 +101,13 @@ class EventSource { * * The parameters of the listener are the sender and an . */ - // addListener(name: string, funct: (...args: any[]) => any): void; - addListener(name, funct) { + addListener(name: string, + funct: (...args: any[]) => any): void { + if (this.eventListeners == null) { this.eventListeners = []; } - - this.eventListeners.push(name); - this.eventListeners.push(funct); + this.eventListeners.push({name, funct}); } /** @@ -123,16 +115,15 @@ class EventSource { * * Removes all occurrences of the given listener from . */ - // removeListener(funct: (...args: any[]) => any): void; - removeListener(funct) { + removeListener(funct: (...args: any[]) => any): void { if (this.eventListeners != null) { let i = 0; while (i < this.eventListeners.length) { - if (this.eventListeners[i + 1] === funct) { - this.eventListeners.splice(i, 2); + if (this.eventListeners[i].funct === funct) { + this.eventListeners.splice(i, 1); } else { - i += 2; + i += 1; } } } @@ -157,8 +148,7 @@ class EventSource { * sender - Optional sender to be passed to the listener. Default value is * the return value of . */ - // fireEvent(evt: mxEventObject, sender: any): void; - fireEvent(evt, sender) { + fireEvent(evt: EventObject, sender: any = null): void { if (this.eventListeners != null && this.isEventsEnabled()) { if (evt == null) { evt = new EventObject(); @@ -167,18 +157,13 @@ class EventSource { if (sender == null) { sender = this.getEventSource(); } - if (sender == null) { sender = this; } - const args = [sender, evt]; - - for (let i = 0; i < this.eventListeners.length; i += 2) { - const listen = this.eventListeners[i]; - - if (listen == null || listen === evt.getName()) { - this.eventListeners[i + 1].apply(this, args); + for (const eventListener of this.eventListeners) { + if (eventListener.name == null || eventListener.name === evt.getName()) { + eventListener.funct.apply(this, [sender, evt]); } } } diff --git a/packages/core/src/view/event/GraphEvents.ts b/packages/core/src/view/event/GraphEvents.ts index 8bdd0b191..988b32316 100644 --- a/packages/core/src/view/event/GraphEvents.ts +++ b/packages/core/src/view/event/GraphEvents.ts @@ -13,7 +13,7 @@ import { import CellState from "../cell/datatypes/CellState"; import Cell from "../cell/datatypes/Cell"; import PanningHandler from "../panning/PanningHandler"; -import mxConnectionHandler from "../connection/mxConnectionHandler"; +import ConnectionHandler from "../connection/ConnectionHandler"; import Point from "../geometry/Point"; import {convertPoint, getValue} from "../../util/Utils"; import {NONE, SHAPE_SWIMLANE} from "../../util/Constants"; @@ -360,7 +360,7 @@ class GraphEvents { me.getCell() ); const panningHandler = this.panningHandler; - const connectionHandler = this.connectionHandler; + const connectionHandler = this.connectionHandler; // LATER: Check if event should be consumed if me is consumed this.graph.fireEvent(mxe); @@ -1083,8 +1083,8 @@ class GraphEvents { */ getPointForEvent(evt: InternalMouseEvent, addOffset: boolean = true): Point { const p = convertPoint(this.container, getClientX(evt), getClientY(evt)); - const s = this.getView().scale; - const tr = this.getView().translate; + const s = this.graph.view.scale; + const tr = this.graph.view.translate; const off = addOffset ? this.gridSize / 2 : 0; p.x = this.snap(p.x / s - tr.x - off); diff --git a/packages/core/src/view/event/InternalMouseEvent.js b/packages/core/src/view/event/InternalMouseEvent.ts similarity index 82% rename from packages/core/src/view/event/InternalMouseEvent.js rename to packages/core/src/view/event/InternalMouseEvent.ts index 702769012..d39334da6 100644 --- a/packages/core/src/view/event/InternalMouseEvent.js +++ b/packages/core/src/view/event/InternalMouseEvent.ts @@ -6,6 +6,9 @@ */ import {getClientX, getClientY, getSource, isMouseEvent, isPopupTrigger} from '../../util/EventUtils'; 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 @@ -42,7 +45,7 @@ import { isAncestorNode } from '../../util/DomUtils'; * */ class InternalMouseEvent { - constructor(evt, state) { + constructor(evt: MouseEvent, state?: CellState) { this.evt = evt; this.state = state; this.sourceState = state; @@ -53,16 +56,14 @@ class InternalMouseEvent { * * Holds the consumed state of this event. */ - // consumed: boolean; - consumed = false; + consumed: boolean = false; /** * Variable: evt * * Holds the inner event object. */ - // evt: Event; - evt = null; + evt: MouseEvent; /** * Variable: graphX @@ -70,8 +71,7 @@ class InternalMouseEvent { * Holds the x-coordinate of the event in the graph. This value is set in * . */ - // graphX: number; - graphX = null; + graphX?: number; /** * Variable: graphY @@ -79,16 +79,14 @@ class InternalMouseEvent { * Holds the y-coordinate of the event in the graph. This value is set in * . */ - // graphY: number; - graphY = null; + graphY?: number; /** * Variable: state * * Holds the optional associated with this event. */ - // state: mxCellState; - state = null; + state?: CellState; /** * Variable: sourceState @@ -96,16 +94,14 @@ class InternalMouseEvent { * Holds the that was passed to the constructor. This can be * different from depending on the result of . */ - // sourceState: mxCellState; - sourceState = null; + sourceState?: CellState; /** * Function: getEvent * * Returns . */ - // getEvent(): MouseEvent; - getEvent() { + getEvent(): MouseEvent { return this.evt; } @@ -114,8 +110,7 @@ class InternalMouseEvent { * * Returns the target DOM element using for . */ - // getSource(): Element; - getSource() { + getSource(): Element { return getSource(this.evt); } @@ -124,12 +119,10 @@ class InternalMouseEvent { * * Returns true if the given is the source of . */ - // isSource(shape: mxShape): boolean; - isSource(shape) { + isSource(shape: Shape): boolean { if (shape != null) { return isAncestorNode(shape.node, this.getSource()); } - return false; } @@ -138,8 +131,7 @@ class InternalMouseEvent { * * Returns . */ - // getX(): number; - getX() { + getX(): number { return getClientX(this.getEvent()); } @@ -148,8 +140,7 @@ class InternalMouseEvent { * * Returns . */ - // getY(): number; - getY() { + getY(): number { return getClientY(this.getEvent()); } @@ -158,8 +149,7 @@ class InternalMouseEvent { * * Returns . */ - // getGraphX(): number; - getGraphX() { + getGraphX(): number | undefined { return this.graphX; } @@ -168,8 +158,7 @@ class InternalMouseEvent { * * Returns . */ - // getGraphY(): number; - getGraphY() { + getGraphY(): number | undefined { return this.graphY; } @@ -178,8 +167,7 @@ class InternalMouseEvent { * * Returns . */ - // getState(): mxCellState; - getState() { + getState(): CellState | undefined { return this.state; } @@ -188,14 +176,11 @@ class InternalMouseEvent { * * Returns the in is not null. */ - // getCell(): mxCell; - getCell() { + getCell(): Cell | null { const state = this.getState(); - if (state != null) { return state.cell; } - return null; } @@ -204,8 +189,7 @@ class InternalMouseEvent { * * Returns true if the event is a popup trigger. */ - // isPopupTrigger(): boolean; - isPopupTrigger() { + isPopupTrigger(): boolean { return isPopupTrigger(this.getEvent()); } @@ -214,8 +198,7 @@ class InternalMouseEvent { * * Returns . */ - // isConsumed(): boolean; - isConsumed() { + isConsumed(): boolean { return this.consumed; } @@ -232,8 +215,7 @@ class InternalMouseEvent { * preventDefault - Specifies if the native event should be canceled. Default * is true. */ - // consume(preventDefault?: boolean): void; - consume(preventDefault) { + consume(preventDefault?: boolean): void { preventDefault = preventDefault != null ? preventDefault diff --git a/packages/core/src/view/event/mxCellTracker.js b/packages/core/src/view/event/mxCellTracker.ts similarity index 100% rename from packages/core/src/view/event/mxCellTracker.js rename to packages/core/src/view/event/mxCellTracker.ts diff --git a/packages/core/src/view/event/mxKeyHandler.js b/packages/core/src/view/event/mxKeyHandler.ts similarity index 100% rename from packages/core/src/view/event/mxKeyHandler.js rename to packages/core/src/view/event/mxKeyHandler.ts diff --git a/packages/core/src/view/geometry/shape/node/Stencil.ts b/packages/core/src/view/geometry/shape/node/Stencil.ts index c3dee5b97..9da385325 100644 --- a/packages/core/src/view/geometry/shape/node/Stencil.ts +++ b/packages/core/src/view/geometry/shape/node/Stencil.ts @@ -5,7 +5,7 @@ * Type definitions from the typed-mxgraph project */ -import mxConnectionConstraint from '../../../connection/mxConnectionConstraint'; +import ConnectionConstraint from '../../../connection/ConnectionConstraint'; import Rectangle from '../../Rectangle'; import Shape from '../Shape'; import Resources from '../../../../util/Resources'; @@ -64,7 +64,7 @@ class Stencil extends Shape { * * Holds an array of as defined in the shape. */ - constraints: mxConnectionConstraint[] = []; + constraints: ConnectionConstraint[] = []; /** * Variable: aspect @@ -168,7 +168,7 @@ class Stencil extends Shape { const perimeter = node.getAttribute('perimeter') == '1'; const name = node.getAttribute('name'); - return new mxConnectionConstraint(new Point(x, y), perimeter, name); + return new ConnectionConstraint(new Point(x, y), perimeter, name); } /** diff --git a/packages/core/src/view/layout/layout/hierarchical/model/mxGraphHierarchyModel.js b/packages/core/src/view/layout/layout/hierarchical/model/mxGraphHierarchyModel.js index b14aee9af..6718a8b56 100644 --- a/packages/core/src/view/layout/layout/hierarchical/model/mxGraphHierarchyModel.js +++ b/packages/core/src/view/layout/layout/hierarchical/model/mxGraphHierarchyModel.js @@ -5,7 +5,7 @@ * Type definitions from the typed-mxgraph project */ -import mxDictionary from '../../../../../util/mxDictionary'; +import Dictionary from '../../../../../util/Dictionary'; import mxGraphHierarchyNode from './mxGraphHierarchyNode'; import mxGraphHierarchyEdge from './mxGraphHierarchyEdge'; @@ -42,8 +42,8 @@ class mxGraphHierarchyModel { // map of cells to internal cell needed for second run through // to setup the sink of edges correctly - this.vertexMapper = new mxDictionary(); - this.edgeMapper = new mxDictionary(); + this.vertexMapper = new Dictionary(); + this.edgeMapper = new Dictionary(); this.maxRank = 0; const internalVertices = []; diff --git a/packages/core/src/view/layout/layout/hierarchical/model/mxSwimlaneModel.js b/packages/core/src/view/layout/layout/hierarchical/model/mxSwimlaneModel.js index 5db51cfbb..0a8bad3f0 100644 --- a/packages/core/src/view/layout/layout/hierarchical/model/mxSwimlaneModel.js +++ b/packages/core/src/view/layout/layout/hierarchical/model/mxSwimlaneModel.js @@ -42,8 +42,8 @@ class mxSwimlaneModel { // map of cells to internal cell needed for second run through // to setup the sink of edges correctly - this.vertexMapper = new mxDictionary(); - this.edgeMapper = new mxDictionary(); + this.vertexMapper = new Dictionary(); + this.edgeMapper = new Dictionary(); this.maxRank = 0; const internalVertices = []; diff --git a/packages/core/src/view/layout/layout/hierarchical/mxHierarchicalLayout.js b/packages/core/src/view/layout/layout/hierarchical/mxHierarchicalLayout.js index 7e5f254bf..0a0ba4a95 100644 --- a/packages/core/src/view/layout/layout/hierarchical/mxHierarchicalLayout.js +++ b/packages/core/src/view/layout/layout/hierarchical/mxHierarchicalLayout.js @@ -7,7 +7,7 @@ import mxGraphLayout from '../mxGraphLayout'; import { DIRECTION_NORTH } from '../../../../util/Constants'; import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; -import mxDictionary from '../../../../util/mxDictionary'; +import Dictionary from '../../../../util/Dictionary'; import mxGraphHierarchyModel from './model/mxGraphHierarchyModel'; import mxObjectIdentity from '../../../../util/mxObjectIdentity'; import mxMinimumCycleRemover from './stage/mxMinimumCycleRemover'; @@ -208,9 +208,9 @@ class mxHierarchicalLayout extends mxGraphLayout { execute(parent, roots) { this.parent = parent; const { model } = this.graph; - this.edgesCache = new mxDictionary(); - this.edgeSourceTermCache = new mxDictionary(); - this.edgesTargetTermCache = new mxDictionary(); + this.edgesCache = new Dictionary(); + this.edgeSourceTermCache = new Dictionary(); + this.edgesTargetTermCache = new Dictionary(); if (roots != null && !(roots instanceof Array)) { roots = [roots]; diff --git a/packages/core/src/view/layout/layout/hierarchical/mxSwimlaneLayout.js b/packages/core/src/view/layout/layout/hierarchical/mxSwimlaneLayout.js index 80c0ff5ce..3cceae9ab 100644 --- a/packages/core/src/view/layout/layout/hierarchical/mxSwimlaneLayout.js +++ b/packages/core/src/view/layout/layout/hierarchical/mxSwimlaneLayout.js @@ -8,7 +8,7 @@ import mxGraphLayout from '../mxGraphLayout'; import { DIRECTION_NORTH } from '../../../../util/Constants'; import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; -import mxDictionary from '../../../../util/mxDictionary'; +import Dictionary from '../../../../util/Dictionary'; import Rectangle from '../../../geometry/Rectangle'; import mxSwimlaneModel from './model/mxSwimlaneModel'; import mxObjectIdentity from '../../../../util/mxObjectIdentity'; @@ -223,9 +223,9 @@ class mxSwimlaneLayout extends mxGraphLayout { execute(parent, swimlanes) { this.parent = parent; const { model } = this.graph; - this.edgesCache = new mxDictionary(); - this.edgeSourceTermCache = new mxDictionary(); - this.edgesTargetTermCache = new mxDictionary(); + this.edgesCache = new Dictionary(); + this.edgeSourceTermCache = new Dictionary(); + this.edgesTargetTermCache = new Dictionary(); // If the roots are set and the parent is set, only // use the roots that are some dependent of the that diff --git a/packages/core/src/view/layout/layout/hierarchical/stage/mxCoordinateAssignment.js b/packages/core/src/view/layout/layout/hierarchical/stage/mxCoordinateAssignment.js index 0c7b13deb..1f533929a 100644 --- a/packages/core/src/view/layout/layout/hierarchical/stage/mxCoordinateAssignment.js +++ b/packages/core/src/view/layout/layout/hierarchical/stage/mxCoordinateAssignment.js @@ -13,7 +13,7 @@ import { } from '../../../../../util/Constants'; import mxLog from '../../../../../util/gui/mxLog'; import WeightedCellSorter from '../../WeightedCellSorter'; -import mxDictionary from '../../../../../util/mxDictionary'; +import Dictionary from '../../../../../util/Dictionary'; import Point from '../../../../geometry/Point'; import mxHierarchicalEdgeStyle from '../mxHierarchicalEdgeStyle'; @@ -331,7 +331,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { const nodeList = []; // Need to be able to map from cell to cellWrapper - const map = new mxDictionary(); + const map = new Dictionary(); const rank = []; for (let i = 0; i <= model.maxRank; i += 1) { diff --git a/packages/core/src/view/layout/layout/mxCompactTreeLayout.js b/packages/core/src/view/layout/layout/mxCompactTreeLayout.js index 0799bb1d0..8fea05305 100644 --- a/packages/core/src/view/layout/layout/mxCompactTreeLayout.js +++ b/packages/core/src/view/layout/layout/mxCompactTreeLayout.js @@ -5,7 +5,7 @@ * Type definitions from the typed-mxgraph project */ -import mxDictionary from '../../../util/mxDictionary'; +import Dictionary from '../../../util/Dictionary'; import Point from '../../geometry/Point'; import mxGraphLayout from './mxGraphLayout'; import CellPath from '../../cell/datatypes/CellPath'; @@ -414,7 +414,7 @@ class mxCompactTreeLayout extends mxGraphLayout { */ // sortOutgoingEdges(source: mxCell, edges: Array): void; sortOutgoingEdges(source, edges) { - const lookup = new mxDictionary(); + const lookup = new Dictionary(); edges.sort((e1, e2) => { const end1 = e1.getTerminal(e1.getTerminal(false) == source); diff --git a/packages/core/src/view/layout/layout/mxGraphLayout.js b/packages/core/src/view/layout/layout/mxGraphLayout.js index f3bffe13f..757a01c9d 100644 --- a/packages/core/src/view/layout/layout/mxGraphLayout.js +++ b/packages/core/src/view/layout/layout/mxGraphLayout.js @@ -5,7 +5,7 @@ * Type definitions from the typed-mxgraph project */ -import mxDictionary from '../../../util/mxDictionary'; +import Dictionary from '../../../util/Dictionary'; import Rectangle from '../../geometry/Rectangle'; import Geometry from '../../geometry/Geometry'; import Point from '../../geometry/Point'; @@ -136,13 +136,13 @@ class mxGraphLayout { * edge as arguments. The traversal stops if the function returns false. * @param edge Optional {@link mxCell} that represents the incoming edge. This is * 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, directed, func, edge, visited) { if (func != null && vertex != null) { directed = directed != null ? directed : true; - visited = visited || new mxDictionary(); + visited = visited || new Dictionary(); if (!visited.get(vertex)) { visited.put(vertex, true); diff --git a/packages/core/src/view/model/Model.ts b/packages/core/src/view/model/Model.ts index 26a2894a7..5ca5b3618 100644 --- a/packages/core/src/view/model/Model.ts +++ b/packages/core/src/view/model/Model.ts @@ -223,46 +223,39 @@ class Model extends EventSource { * 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. */ - // root: mxCell; root: Cell | null = null; /** * Maps from Ids to cells. */ - // cells: any; cells: any = {}; /** * Specifies if edges should automatically be moved into the nearest common * ancestor of their terminals. Default is true. */ - // maintainEdgeParent: boolean; maintainEdgeParent: boolean = true; /** * Specifies if relative edge parents should be ignored for finding the nearest * common ancestors of an edge's terminals. Default is true. */ - // ignoreRelativeEdgeParent: boolean; ignoreRelativeEdgeParent: boolean = true; /** * Specifies if the model should automatically create Ids for new cells. * Default is true. */ - // createIds: boolean; createIds: boolean = true; /** * Defines the prefix of new Ids. Default is an empty string. */ - // prefix: string; prefix: string = ''; /** * Defines the postfix of new Ids. Default is an empty string. */ - // postfix: string; postfix: string = ''; /** @@ -276,7 +269,6 @@ class Model extends EventSource { * closed then a new object is created for this variable using * {@link createUndoableEdit}. */ - // currentEdit: any; currentEdit: any = null; /** @@ -285,19 +277,16 @@ class Model extends EventSource { * it. When the counter reaches 0, the transaction is closed and the * respective events are fired. Initial value is 0. */ - // updateLevel: number; updateLevel: number = 0; /** * True if the program flow is currently inside endUpdate. */ - // endingUpdate: boolean; endingUpdate: boolean = false; /** * Sets a new root using {@link createRoot}. */ - // clear(): void; clear(): void { this.setRoot(this.createRoot()); } @@ -305,7 +294,6 @@ class Model extends EventSource { /** * Returns {@link createIds}. */ - // isCreateIds(): boolean; isCreateIds(): boolean { return this.createIds; } @@ -313,7 +301,6 @@ class Model extends EventSource { /** * Sets {@link createIds}. */ - // setCreateIds(value: boolean): void; setCreateIds(value: boolean): void { this.createIds = value; } @@ -321,7 +308,6 @@ class Model extends EventSource { /** * Creates a new root cell with a default layer (child 0). */ - // createRoot(): mxCell; createRoot(): Cell { const cell = 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. */ - // getCell(id: string): mxCell; getCell(id: string): Cell | 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. */ - // setRoot(root: mxCell): mxCell; setRoot(root: Cell | null): Cell | null { this.execute(new RootChange(this, root)); return root; @@ -513,7 +497,6 @@ class Model extends EventSource { * * @param {Cell} cell to create the Id for. */ - // createId(cell: mxCell): string; createId(cell: Cell): string { const id = 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 * its descendants using {@link updateEdgeParent}. */ - // updateEdgeParents(cell: mxCell, root: mxCell): void; updateEdgeParents(cell: Cell, root: Cell=this.getRoot(cell)): void { @@ -563,7 +545,6 @@ class Model extends EventSource { * @param {Cell} edge that specifies the edge. * @param {Cell} root that represents the current root of the model. */ - // updateEdgeParent(edge: mxCell, root: mxCell): void; updateEdgeParent(edge: Cell, root: Cell): void { @@ -630,8 +611,7 @@ class Model extends EventSource { * * @param {Cell} cell that should be removed. */ - // remove(cell: mxCell): mxCell; - remove(cell: Cell) { + remove(cell: Cell): Cell { if (cell === this.root) { this.setRoot(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. */ - // cellRemoved(cell: mxCell): void; - cellRemoved(cell: Cell) { + cellRemoved(cell: Cell): void { if (cell != null && this.cells != null) { // Recursively processes child cells const childCount = cell.getChildCount(); @@ -890,9 +869,8 @@ class Model extends EventSource { * @param style String of the form [stylename;|key=value;] to specify * the new cell style. */ - // setStyle(cell: mxCell, style: string): string; setStyle(cell: Cell, - style: any): any { + style: string): string { if (style !== cell.getStyle()) { 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 * the new cell style. */ - // styleForCellChanged(cell: mxCell, style: string): string; styleForCellChanged(cell: Cell, style: string): string | null { @@ -956,9 +933,8 @@ class Model extends EventSource { * @param {Cell} cell whose visible state should be changed. * @param visible Boolean that specifies the new visible state. */ - // setVisible(cell: mxCell, visible: boolean): boolean; setVisible(cell: Cell, - visible: boolean) { + visible: boolean): boolean { if (visible !== cell.isVisible()) { 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 visible Boolean that specifies the new visible state. */ - // visibleStateForCellChanged(cell: mxCell, visible: boolean): boolean; visibleStateForCellChanged(cell: Cell, visible: boolean): boolean { const previous = cell.isVisible(); @@ -993,7 +968,6 @@ class Model extends EventSource { * * @param change Object that described the change. */ - // execute(change: any): void; execute(change: any): void { change.execute(); this.beginUpdate(); @@ -1041,7 +1015,6 @@ class Model extends EventSource { * graph.addCells([v1, v2]). * ``` */ - // beginUpdate(): void; beginUpdate(): void { this.updateLevel += 1; 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 * the edit. */ - // endUpdate(): void; endUpdate(): void { this.updateLevel -= 1; @@ -1226,7 +1198,6 @@ class Model extends EventSource { * * @param {Cell} cell to be cloned. */ - // cloneCell(cell: mxCell): mxCell; cloneCell(cell: Cell | null, includeChildren: boolean): Cell | null { if (cell != null) { diff --git a/packages/core/src/view/selection/mxRubberband.js b/packages/core/src/view/selection/RubberBand.ts similarity index 77% rename from packages/core/src/view/selection/mxRubberband.js rename to packages/core/src/view/selection/RubberBand.ts index 0f7389e45..3c499ef26 100644 --- a/packages/core/src/view/selection/mxRubberband.js +++ b/packages/core/src/view/selection/RubberBand.ts @@ -3,7 +3,7 @@ * Copyright (c) 2006-2016, Gaudenz Alder */ -import utils from '../../util/Utils'; +import utils, { getOffset, getScrollOrigin } from '../../util/Utils'; import InternalEvent from '../event/InternalEvent'; import Point from '../geometry/Point'; import InternalMouseEvent from '../event/InternalMouseEvent'; @@ -11,61 +11,65 @@ import mxClient from '../../mxClient'; import Rectangle from '../geometry/Rectangle'; import { isAltDown, isMultiTouchEvent } from '../../util/EventUtils'; import { clearSelection } from '../../util/DomUtils'; +import Graph from '../Graph'; /** * Event handler that selects rectangular regions. * This is not built-into [mxGraph]. * To enable rubberband selection in a graph, use the following code. */ -class mxRubberband { - constructor(graph) { - if (graph != null) { - this.graph = graph; - this.graph.addMouseListener(this); +class RubberBand { + forceRubberbandHandler: Function; + panHandler: Function; + gestureHandler: Function; + graph: Graph; + first: Point | null = null; + destroyed: boolean = false; + dragHandler?: Function; + dropHandler?: Function; - // Handles force rubberband event - this.forceRubberbandHandler = (sender, evt) => { - const evtName = evt.getProperty('eventName'); - const me = evt.getProperty('event'); + constructor(graph: Graph) { + this.graph = graph; + this.graph.addMouseListener(this); - if (evtName === InternalEvent.MOUSE_DOWN && this.isForceRubberbandEvent(me)) { - const offset = utils.getOffset(this.graph.container); - const origin = utils.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); - } - }; + // Handles force rubberband event + this.forceRubberbandHandler = (sender, evt) => { + const evtName = evt.getProperty('eventName'); + const me = evt.getProperty('event'); - this.graph.addListener( - InternalEvent.FIRE_MOUSE_EVENT, - this.forceRubberbandHandler - ); + if (evtName === InternalEvent.MOUSE_DOWN && this.isForceRubberbandEvent(me)) { + const offset = getOffset(this.graph.container); + 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.panHandler = () => { - this.repaint(); - }; + this.graph.addListener(InternalEvent.FIRE_MOUSE_EVENT, this.forceRubberbandHandler); - 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.gestureHandler = (sender, eo) => { - if (this.first != null) { - this.reset(); - } - }; + this.graph.addListener(InternalEvent.PAN, this.panHandler); - 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. */ - // defaultOpacity: number; - defaultOpacity = 20; + defaultOpacity: number = 20; /** * Variable: enabled @@ -105,14 +109,12 @@ class mxRubberband { /** * Optional fade out effect. Default is false. */ - // fadeOut: boolean; - fadeOut = false; + fadeOut: boolean = false; /** * Creates the rubberband selection shape. */ - // isEnabled(): boolean; - isEnabled() { + isEnabled(): boolean { return this.enabled; } @@ -122,7 +124,7 @@ class mxRubberband { * Enables or disables event handling. This implementation updates * . */ - setEnabled(enabled) { + setEnabled(enabled: boolean) { this.enabled = enabled; } @@ -132,7 +134,7 @@ class mxRubberband { * Returns true if the given should start rubberband selection. * This implementation returns true if the alt key is pressed. */ - isForceRubberbandEvent(me) { + isForceRubberbandEvent(me: InternalMouseEvent) { return isAltDown(me.getEvent()); } @@ -143,7 +145,8 @@ class mxRubberband { * event all subsequent events of the gesture are redirected to this * handler. */ - mouseDown(sender, me) { + mouseDown(sender: any, + me: InternalMouseEvent): void { if ( !me.isConsumed() && this.isEnabled() && @@ -169,8 +172,7 @@ class mxRubberband { /** * Creates the rubberband selection shape. */ - // start(x: number, y: number): void; - start(x, y) { + start(x: number, y: number): void { this.first = new Point(x, y); const { container } = this.graph; @@ -185,11 +187,11 @@ class mxRubberband { return me; } - this.dragHandler = evt => { + this.dragHandler = (evt) => { this.mouseMove(this.graph, createMouseEvent(evt)); }; - this.dropHandler = evt => { + this.dropHandler = (evt) => { this.mouseUp(this.graph, createMouseEvent(evt)); }; @@ -209,10 +211,12 @@ class mxRubberband { * * Handles the event by updating therubberband selection. */ - mouseMove(sender, me) { + mouseMove(sender: any, + me: InternalMouseEvent): void { + if (!me.isConsumed() && this.first != null) { - const origin = utils.getScrollOrigin(this.graph.container); - const offset = utils.getOffset(this.graph.container); + const origin = getScrollOrigin(this.graph.container); + const offset = getOffset(this.graph.container); origin.x -= offset.x; origin.y -= offset.y; const x = me.getX() + origin.x; @@ -239,8 +243,7 @@ class mxRubberband { /** * Creates the rubberband selection shape. */ - // createShape(): HTMLElement; - createShape() { + createShape(): HTMLElement { if (this.sharedDiv == null) { this.sharedDiv = document.createElement('div'); this.sharedDiv.className = 'mxRubberband'; @@ -262,7 +265,8 @@ class mxRubberband { * * 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'; } @@ -272,7 +276,9 @@ class mxRubberband { * Handles the event by selecting the region of the rubberband using * . */ - mouseUp(sender, me) { + mouseUp(sender: any, + me: InternalMouseEvent): void { + const active = this.isActive(); this.reset(); @@ -388,4 +394,4 @@ class mxRubberband { } } -export default mxRubberband; +export default RubberBand; diff --git a/packages/core/src/view/selection/Selection.ts b/packages/core/src/view/selection/Selection.ts index 5fe83eb5a..ecb59056d 100644 --- a/packages/core/src/view/selection/Selection.ts +++ b/packages/core/src/view/selection/Selection.ts @@ -3,11 +3,11 @@ import CellArray from "../cell/datatypes/CellArray"; import Rectangle from "../geometry/Rectangle"; import InternalMouseEvent from "../event/InternalMouseEvent"; import CellState from "../cell/datatypes/CellState"; -import mxEdgeHandler from "../cell/edge/mxEdgeHandler"; -import mxVertexHandler from "../cell/vertex/mxVertexHandler"; +import EdgeHandler from "../cell/edge/EdgeHandler"; +import VertexHandler from "../cell/vertex/VertexHandler"; import EdgeStyle from "../style/EdgeStyle"; -import mxEdgeSegmentHandler from "../cell/edge/mxEdgeSegmentHandler"; -import mxElbowEdgeHandler from "../cell/edge/mxElbowEdgeHandler"; +import EdgeSegmentHandler from "../cell/edge/EdgeSegmentHandler"; +import ElbowEdgeHandler from "../cell/edge/ElbowEdgeHandler"; import graph from "../Graph"; import mxClient from "../../mxClient"; import SelectionChange from "./SelectionChange"; @@ -15,7 +15,7 @@ import mxUndoableEdit from "../model/mxUndoableEdit"; import EventObject from "../event/EventObject"; import InternalEvent from "../event/InternalEvent"; import EventSource from "../event/EventSource"; -import mxDictionary from "../../util/mxDictionary"; +import Dictionary from "../../util/Dictionary"; import RootChange from "../model/RootChange"; import ChildChange from "../model/ChildChange"; @@ -631,7 +631,7 @@ class Selection extends EventSource { changes: any[], ignoreFn: Function | null = null ): CellArray { - const dict = new mxDictionary(); + const dict = new Dictionary(); const cells: CellArray = new CellArray(); const addCell = (cell: Cell) => { diff --git a/packages/core/src/view/selection/mxSelectionCellsHandler.js b/packages/core/src/view/selection/mxSelectionCellsHandler.js index fee00a974..09bea7976 100644 --- a/packages/core/src/view/selection/mxSelectionCellsHandler.js +++ b/packages/core/src/view/selection/mxSelectionCellsHandler.js @@ -5,7 +5,7 @@ * Type definitions from the typed-mxgraph project */ import EventSource from '../event/EventSource'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import EventObject from '../event/EventObject'; import InternalEvent from '../event/InternalEvent'; import utils from '../../util/Utils'; @@ -37,7 +37,7 @@ class mxSelectionCellsHandler extends EventSource { super(); this.graph = graph; - this.handlers = new mxDictionary(); + this.handlers = new Dictionary(); this.graph.addMouseListener(this); this.refreshHandler = (sender, evt) => { @@ -46,9 +46,7 @@ class mxSelectionCellsHandler extends EventSource { } }; - this.graph - .getSelectionModel() - .addListener(InternalEvent.CHANGE, this.refreshHandler); + this.graph.getSelectionModel().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.TRANSLATE, this.refreshHandler); @@ -168,7 +166,7 @@ class mxSelectionCellsHandler extends EventSource { refresh() { // Removes all existing handlers const oldHandlers = this.handlers; - this.handlers = new mxDictionary(); + this.handlers = new Dictionary(); // Creates handles for all selection cells const tmp = utils.sortCells(this.getHandledSelectionCells(), false); @@ -200,14 +198,10 @@ class mxSelectionCellsHandler extends EventSource { } // Destroys unused handlers - oldHandlers.visit( - (key, handler) => { - this.fireEvent( - new EventObject(InternalEvent.REMOVE, 'state', handler.state) - ); - handler.destroy(); - } - ); + oldHandlers.visit((key, handler) => { + this.fireEvent(new EventObject(InternalEvent.REMOVE, 'state', handler.state)); + handler.destroy(); + }); // Creates new handlers and updates parent highlight on existing handlers for (let i = 0; i < tmp.length; i += 1) { diff --git a/packages/core/src/view/terminal/GraphTerminal.ts b/packages/core/src/view/terminal/GraphTerminal.ts index e5cbd8f94..b6c80c915 100644 --- a/packages/core/src/view/terminal/GraphTerminal.ts +++ b/packages/core/src/view/terminal/GraphTerminal.ts @@ -1,6 +1,6 @@ import CellArray from "../cell/datatypes/CellArray"; import Cell from "../cell/datatypes/Cell"; -import mxDictionary from "../../util/mxDictionary"; +import Dictionary from "../../util/Dictionary"; class GraphTerminal { /***************************************************************************** @@ -47,7 +47,7 @@ class GraphTerminal { const terminals = new CellArray(); // 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) { const state = this.view.getState(edges[i]); diff --git a/packages/core/src/view/view/GraphView.ts b/packages/core/src/view/view/GraphView.ts index 956d8f156..1501cd5e1 100644 --- a/packages/core/src/view/view/GraphView.ts +++ b/packages/core/src/view/view/GraphView.ts @@ -7,7 +7,7 @@ import Point from '../geometry/Point'; import Rectangle from '../geometry/Rectangle'; -import mxDictionary from '../../util/mxDictionary'; +import Dictionary from '../../util/Dictionary'; import EventSource from '../event/EventSource'; import EventObject from '../event/EventObject'; import RectangleShape from '../geometry/shape/node/RectangleShape'; @@ -45,7 +45,7 @@ import CurrentRootChange from './CurrentRootChange'; import Model from '../model/Model'; import Shape from '../geometry/shape/Shape'; import Geometry from '../geometry/Geometry'; -import mxConnectionConstraint from '../connection/mxConnectionConstraint'; +import ConnectionConstraint from '../connection/ConnectionConstraint'; import PopupMenuHandler from '../popups_menus/PopupMenuHandler'; import { getClientX, @@ -178,7 +178,7 @@ class GraphView extends EventSource { */ translate = new Point(); - states = new mxDictionary(); + states = new Dictionary(); /** * Specifies if the style should be updated in each validation step. If this @@ -319,7 +319,7 @@ class GraphView extends EventSource { * Sets {@link states}. */ // setStates(value: mxDictionary): void; - setStates(value: mxDictionary): void { + setStates(value: Dictionary): void { this.states = value; } @@ -1240,7 +1240,7 @@ class GraphView extends EventSource { edge: CellState, terminal: CellState, source: boolean, - constraint: mxConnectionConstraint + constraint: ConnectionConstraint ) { edge.setAbsoluteTerminalPoint( this.getFixedTerminalPoint(edge, terminal, source, constraint), @@ -1264,7 +1264,7 @@ class GraphView extends EventSource { edge: CellState, terminal: CellState, source: boolean, - constraint: mxConnectionConstraint + constraint: ConnectionConstraint ): Point | null { let pt = null; @@ -2155,7 +2155,7 @@ class GraphView extends EventSource { * this returns {@link states}. */ // getCellStates(cells: mxCellArray): mxCellState[]; - getCellStates(cells: CellArray | null): CellState[] | mxDictionary | null { + getCellStates(cells: CellArray | null): CellState[] | Dictionary | null { if (cells == null) { return this.states; } diff --git a/packages/html/stories/JsonData.stories.js b/packages/html/stories/JsonData.stories.js index 954081672..16127d13c 100644 --- a/packages/html/stories/JsonData.stories.js +++ b/packages/html/stories/JsonData.stories.js @@ -63,7 +63,7 @@ const Template = ({ label, ...args }) => { // Enables rubberband selection if (args.rubberBand) - new mxRubberband(graph); + new RubberBand(graph); // Gets the default parent for inserting new cells. This // is normally the first child of the root (ie. layer 0). diff --git a/packages/html/stories/UserObject.stories.js b/packages/html/stories/UserObject.stories.js index e33f8f528..aa28b81e7 100644 --- a/packages/html/stories/UserObject.stories.js +++ b/packages/html/stories/UserObject.stories.js @@ -155,7 +155,7 @@ const Template = ({ label, ...args }) => { // Enables rubberband selection if (args.rubberBand) - new mxRubberband(graph); + new RubberBand(graph); const buttons = document.createElement('div'); div.appendChild(buttons);