From af8338c077478390b9fe588c075dfab93acce5e0 Mon Sep 17 00:00:00 2001 From: mcyph <20507948+mcyph@users.noreply.github.com> Date: Tue, 23 Mar 2021 11:27:48 +1100 Subject: [PATCH] replaced fn() => {} syntax with fn() class function syntax to fix "this" binding --- src/mxgraph/editor/mxDefaultKeyHandler.js | 8 +- src/mxgraph/editor/mxDefaultPopupMenu.js | 18 +- src/mxgraph/editor/mxDefaultToolbar.js | 58 +- src/mxgraph/editor/mxEditor.js | 238 +-- src/mxgraph/handler/mxCellHighlight.js | 38 +- src/mxgraph/handler/mxCellMarker.js | 88 +- src/mxgraph/handler/mxCellTracker.js | 14 +- src/mxgraph/handler/mxConnectionHandler.js | 202 +-- src/mxgraph/handler/mxConstraintHandler.js | 78 +- src/mxgraph/handler/mxEdgeHandler.js | 264 +-- src/mxgraph/handler/mxEdgeSegmentHandler.js | 36 +- src/mxgraph/handler/mxElbowEdgeHandler.js | 40 +- src/mxgraph/handler/mxGraphHandler.js | 200 +-- src/mxgraph/handler/mxHandle.js | 84 +- src/mxgraph/handler/mxKeyHandler.js | 60 +- src/mxgraph/handler/mxPanningHandler.js | 64 +- src/mxgraph/handler/mxPopupMenuHandler.js | 28 +- src/mxgraph/handler/mxRubberband.js | 56 +- .../handler/mxSelectionCellsHandler.js | 52 +- src/mxgraph/handler/mxTooltipHandler.js | 64 +- src/mxgraph/handler/mxVertexHandler.js | 242 ++- src/mxgraph/index.txt | 9 +- src/mxgraph/io/mxCellCodec.js | 20 +- src/mxgraph/io/mxChildChangeCodec.js | 20 +- src/mxgraph/io/mxCodec.js | 60 +- src/mxgraph/io/mxDefaultKeyHandlerCodec.js | 8 +- src/mxgraph/io/mxDefaultPopupMenuCodec.js | 8 +- src/mxgraph/io/mxDefaultToolbarCodec.js | 8 +- src/mxgraph/io/mxEditorCodec.js | 16 +- src/mxgraph/io/mxGenericChangeCodec.js | 4 +- src/mxgraph/io/mxGraphViewCodec.js | 8 +- src/mxgraph/io/mxModelCodec.js | 12 +- src/mxgraph/io/mxObjectCodec.js | 120 +- src/mxgraph/io/mxRootChangeCodec.js | 14 +- src/mxgraph/io/mxStylesheetCodec.js | 12 +- src/mxgraph/io/mxTerminalChangeCodec.js | 4 +- src/mxgraph/layout/WeightedCellSorter.js | 4 +- .../model/mxGraphAbstractHierarchyCell.js | 36 +- .../model/mxGraphHierarchyEdge.js | 32 +- .../model/mxGraphHierarchyModel.js | 28 +- .../model/mxGraphHierarchyNode.js | 36 +- .../hierarchical/model/mxSwimlaneModel.js | 38 +- .../hierarchical/mxHierarchicalLayout.js | 76 +- .../layout/hierarchical/mxSwimlaneLayout.js | 82 +- .../hierarchical/stage/MedianCellSorter.js | 4 +- .../stage/mxCoordinateAssignment.js | 80 +- .../stage/mxHierarchicalLayoutStage.js | 2 +- .../stage/mxMedianHybridCrossingReduction.js | 30 +- .../stage/mxMinimumCycleRemover.js | 6 +- .../hierarchical/stage/mxSwimlaneOrdering.js | 8 +- src/mxgraph/layout/mxCircleLayout.js | 14 +- src/mxgraph/layout/mxCompactTreeLayout.js | 98 +- src/mxgraph/layout/mxCompositeLayout.js | 10 +- src/mxgraph/layout/mxEdgeLabelLayout.js | 18 +- src/mxgraph/layout/mxFastOrganicLayout.js | 26 +- src/mxgraph/layout/mxGraphLayout.js | 72 +- src/mxgraph/layout/mxParallelEdgeLayout.js | 26 +- src/mxgraph/layout/mxPartitionLayout.js | 12 +- src/mxgraph/layout/mxRadialTreeLayout.js | 12 +- src/mxgraph/layout/mxStackLayout.js | 40 +- .../atomic_changes/mxCellAttributeChange.js | 4 +- .../model/atomic_changes/mxChildChange.js | 8 +- .../model/atomic_changes/mxCollapseChange.js | 4 +- .../model/atomic_changes/mxGeometryChange.js | 4 +- .../model/atomic_changes/mxRootChange.js | 4 +- .../model/atomic_changes/mxStyleChange.js | 4 +- .../model/atomic_changes/mxTerminalChange.js | 4 +- .../model/atomic_changes/mxValueChange.js | 4 +- .../model/atomic_changes/mxVisibleChange.js | 4 +- src/mxgraph/model/mxCell.js | 160 +- src/mxgraph/model/mxGeometry.js | 26 +- src/mxgraph/model/mxGraphModel.js | 304 ++-- src/mxgraph/shape/mxActor.js | 8 +- src/mxgraph/shape/mxArrow.js | 8 +- src/mxgraph/shape/mxArrowConnector.js | 54 +- src/mxgraph/shape/mxCloud.js | 4 +- src/mxgraph/shape/mxConnector.js | 16 +- src/mxgraph/shape/mxCylinder.js | 12 +- src/mxgraph/shape/mxDoubleEllipse.js | 12 +- src/mxgraph/shape/mxEllipse.js | 4 +- src/mxgraph/shape/mxHexagon.js | 4 +- src/mxgraph/shape/mxImageShape.js | 28 +- src/mxgraph/shape/mxLabel.js | 36 +- src/mxgraph/shape/mxLine.js | 4 +- src/mxgraph/shape/mxPolyline.js | 20 +- src/mxgraph/shape/mxRectangleShape.js | 16 +- src/mxgraph/shape/mxRhombus.js | 8 +- src/mxgraph/shape/mxShape.js | 217 ++- src/mxgraph/shape/mxStencil.js | 47 +- src/mxgraph/shape/mxSwimlane.js | 48 +- src/mxgraph/shape/mxText.js | 106 +- src/mxgraph/shape/mxTriangle.js | 8 +- src/mxgraph/util/mxAbstractCanvas2D.js | 154 +- src/mxgraph/util/mxAnimation.js | 16 +- src/mxgraph/util/mxAutoSaveManager.js | 28 +- src/mxgraph/util/mxDictionary.js | 28 +- src/mxgraph/util/mxDivResizer.js | 12 +- src/mxgraph/util/mxDragSource.js | 100 +- src/mxgraph/util/mxEventObject.js | 20 +- src/mxgraph/util/mxEventSource.js | 28 +- src/mxgraph/util/mxForm.js | 32 +- src/mxgraph/util/mxGuide.js | 46 +- src/mxgraph/util/mxImageBundle.js | 8 +- src/mxgraph/util/mxImageExport.js | 28 +- src/mxgraph/util/mxLog.js | 8 +- src/mxgraph/util/mxMorphing.js | 24 +- src/mxgraph/util/mxMouseEvent.js | 48 +- src/mxgraph/util/mxPoint.js | 8 +- src/mxgraph/util/mxPopupMenu.js | 65 +- src/mxgraph/util/mxRectangle.js | 32 +- src/mxgraph/util/mxSvgCanvas2D.js | 180 +- src/mxgraph/util/mxToolbar.js | 48 +- src/mxgraph/util/mxUndoManager.js | 32 +- src/mxgraph/util/mxUndoableEdit.js | 24 +- src/mxgraph/util/mxUrlConverter.js | 36 +- src/mxgraph/util/mxWindow.js | 104 +- src/mxgraph/util/mxXmlCanvas2D.js | 178 +- src/mxgraph/util/mxXmlRequest.js | 44 +- src/mxgraph/view/mxCellEditor.js | 98 +- src/mxgraph/view/mxCellOverlay.js | 8 +- src/mxgraph/view/mxCellRenderer.js | 148 +- src/mxgraph/view/mxCellState.js | 48 +- src/mxgraph/view/mxCellStatePreview.js | 24 +- src/mxgraph/view/mxGraph.js | 1530 +++++++++-------- src/mxgraph/view/mxGraphSelectionModel.js | 60 +- src/mxgraph/view/mxGraphView.js | 324 ++-- src/mxgraph/view/mxLayoutManager.js | 80 +- src/mxgraph/view/mxMultiplicity.js | 16 +- src/mxgraph/view/mxOutline.js | 64 +- src/mxgraph/view/mxPerimeter.js | 20 +- src/mxgraph/view/mxPrintPreview.js | 76 +- src/mxgraph/view/mxSelectionChange.js | 4 +- src/mxgraph/view/mxStylesheet.js | 32 +- src/mxgraph/view/mxSwimlaneManager.js | 68 +- src/mxgraph/view/mxTemporaryCellStates.js | 4 +- src/pages/_app.js | 8 +- src/pages/api/hello.js | 4 +- src/pages/index.js | 15 +- 138 files changed, 4083 insertions(+), 4114 deletions(-) diff --git a/src/mxgraph/editor/mxDefaultKeyHandler.js b/src/mxgraph/editor/mxDefaultKeyHandler.js index d44d1575a..126b43647 100644 --- a/src/mxgraph/editor/mxDefaultKeyHandler.js +++ b/src/mxgraph/editor/mxDefaultKeyHandler.js @@ -96,7 +96,7 @@ class mxDefaultKeyHandler { * control - Optional boolean that specifies if control must be pressed. * Default is false. */ - bindAction = (code, action, control) => { + bindAction(code, action, control) { const keyHandler = () => { this.editor.execute(action); }; @@ -108,7 +108,7 @@ class mxDefaultKeyHandler { // Binds the function to the normal keycode this.handler.bindKey(code, keyHandler); } - }; + } /** * Function: destroy @@ -117,10 +117,10 @@ class mxDefaultKeyHandler { * not need to be called, the is destroyed automatically when the * window unloads (in IE) by . */ - destroy = () => { + destroy() { this.handler.destroy(); this.handler = null; - }; + } } export default mxDefaultKeyHandler; diff --git a/src/mxgraph/editor/mxDefaultPopupMenu.js b/src/mxgraph/editor/mxDefaultPopupMenu.js index e577c49a5..50cc164f4 100644 --- a/src/mxgraph/editor/mxDefaultPopupMenu.js +++ b/src/mxgraph/editor/mxDefaultPopupMenu.js @@ -155,14 +155,14 @@ class mxDefaultPopupMenu { * cell - Optional which is under the mousepointer. * evt - Optional mouse event which triggered the menu. */ - createMenu = (editor, menu, cell, evt) => { + createMenu(editor, menu, cell, evt) { if (this.config != null) { const conditions = this.createConditions(editor, cell, evt); const item = this.config.firstChild; this.addItems(editor, menu, cell, evt, conditions, item, null); } - }; + } /** * Function: addItems @@ -179,7 +179,7 @@ class mxDefaultPopupMenu { * item - XML node that represents the current menu item. * parent - DOM node that represents the parent menu item. */ - addItems = (editor, menu, cell, evt, conditions, item, parent) => { + addItems(editor, menu, cell, evt, conditions, item, parent) { let addSeparator = false; while (item != null) { @@ -233,7 +233,7 @@ class mxDefaultPopupMenu { item = item.nextSibling; } - }; + } /** * Function: addAction @@ -256,7 +256,7 @@ class mxDefaultPopupMenu { * enabled - Optional boolean that specifies if the menu item is enabled. * Default is true. */ - addAction = ( + addAction( menu, editor, lab, @@ -267,7 +267,7 @@ class mxDefaultPopupMenu { parent, iconCls, enabled - ) => { + ) { const clickHandler = evt => { if (typeof funct === 'function') { funct.call(editor, editor, cell, evt); @@ -277,14 +277,14 @@ class mxDefaultPopupMenu { } }; return menu.addItem(lab, icon, clickHandler, parent, iconCls, enabled); - }; + } /** * Function: createConditions * * Evaluates the default conditions for the given context. */ - createConditions = (editor, cell, evt) => { + createConditions(editor, cell, evt) { // Creates array with conditions const model = editor.graph.getModel(); const childCount = model.getChildCount(cell); @@ -318,7 +318,7 @@ class mxDefaultPopupMenu { } return conditions; - }; + } } export default mxDefaultPopupMenu; diff --git a/src/mxgraph/editor/mxDefaultToolbar.js b/src/mxgraph/editor/mxDefaultToolbar.js index baeb6e8c6..9d4466fac 100644 --- a/src/mxgraph/editor/mxDefaultToolbar.js +++ b/src/mxgraph/editor/mxDefaultToolbar.js @@ -8,7 +8,7 @@ import mxClient from '../mxClient'; import mxToolbar from '../util/mxToolbar'; import mxGeometry from '../model/mxGeometry'; import mxUtils from '../util/mxUtils'; -import mxEvent from "../util/mxEvent"; +import mxEvent from '../util/mxEvent'; class mxDefaultToolbar { /** @@ -105,7 +105,7 @@ class mxDefaultToolbar { * * container - DOM node that contains the toolbar. */ - init = container => { + init(container) { if (container != null) { this.toolbar = new mxToolbar(container); @@ -134,7 +134,7 @@ class mxDefaultToolbar { this.editor.graph.addListener(mxEvent.DOUBLE_CLICK, this.resetHandler); this.editor.addListener(mxEvent.ESCAPE, this.resetHandler); } - }; + } /** * Function: addItem @@ -149,14 +149,14 @@ class mxDefaultToolbar { * action - Name of the action to execute when the item is clicked. * pressed - Optional URL of the icon for the pressed state. */ - addItem = (title, icon, action, pressed) => { + addItem(title, icon, action, pressed) { const clickHandler = () => { if (action != null && action.length > 0) { this.editor.execute(action); } }; return this.toolbar.addItem(title, icon, clickHandler, pressed); - }; + } /** * Function: addSeparator @@ -168,10 +168,10 @@ class mxDefaultToolbar { * icon - Optional URL of the icon that represents the vertical separator. * Default is + '/separator.gif'. */ - addSeparator = icon => { + addSeparator(icon) { icon = icon || `${mxClient.imageBasePath}/separator.gif`; this.toolbar.addSeparator(icon); - }; + } /** * Function: addCombo @@ -179,9 +179,9 @@ class mxDefaultToolbar { * Helper method to invoke on and return the * resulting DOM node. */ - addCombo = () => { + addCombo() { return this.toolbar.addCombo(); - }; + } /** * Function: addActionCombo @@ -193,9 +193,9 @@ class mxDefaultToolbar { * * title - String that represents the title of the combo. */ - addActionCombo = title => { + addActionCombo(title) { return this.toolbar.addActionCombo(title); - }; + } /** * Function: addActionOption @@ -210,13 +210,13 @@ class mxDefaultToolbar { * title - String that represents the title of the combo. * action - Name of the action to execute in . */ - addActionOption = (combo, title, action) => { + addActionOption(combo, title, action) { const clickHandler = mxUtils.bind(this, () => { this.editor.execute(action); }); this.addOption(combo, title, clickHandler); - }; + } /** * Function: addOption @@ -230,9 +230,9 @@ class mxDefaultToolbar { * title - String that represents the title of the combo. * value - Object that represents the value of the option. */ - addOption = (combo, title, value) => { + addOption(combo, title, value) { return this.toolbar.addOption(combo, title, value); - }; + } /** * Function: addMode @@ -251,7 +251,7 @@ class mxDefaultToolbar { * first and only argument that is executed after the mode has been * selected. */ - addMode = (title, icon, mode, pressed, funct) => { + addMode(title, icon, mode, pressed, funct) { const clickHandler = () => { this.editor.setMode(mode); @@ -260,7 +260,7 @@ class mxDefaultToolbar { } }; return this.toolbar.addSwitchMode(title, icon, clickHandler, pressed); - }; + } /** * Function: addPrototype @@ -283,7 +283,7 @@ class mxDefaultToolbar { * toggle - Optional boolean that specifies if the item can be toggled. * Default is true. */ - addPrototype = (title, icon, ptype, pressed, insert, toggle) => { + addPrototype(title, icon, ptype, pressed, insert, toggle) { // Creates a wrapper function that is in charge of constructing // the new cell instance to be inserted into the graph const factory = mxUtils.bind(this, () => { @@ -328,7 +328,7 @@ class mxDefaultToolbar { this.installDropHandler(img, dropHandler); return img; - }; + } /** * Function: drop @@ -343,7 +343,7 @@ class mxDefaultToolbar { * evt - Mouse event that represents the drop. * target - Optional that represents the drop target. */ - drop = (vertex, evt, target) => { + drop(vertex, evt, target) { const { graph } = this.editor; const model = graph.getModel(); @@ -363,7 +363,7 @@ class mxDefaultToolbar { } else { this.connect(vertex, evt, target); } - }; + } /** * Function: insert @@ -377,7 +377,7 @@ class mxDefaultToolbar { * evt - Mouse event that represents the drop. * parent - Optional that represents the parent. */ - insert = (vertex, evt, target) => { + insert(vertex, evt, target) { const { graph } = this.editor; if (graph.canImportCell(vertex)) { @@ -396,7 +396,7 @@ class mxDefaultToolbar { } return null; - }; + } /** * Function: connect @@ -407,7 +407,7 @@ class mxDefaultToolbar { * evt - Mouse event that represents the drop. * source - Optional that represents the source terminal. */ - connect = (vertex, evt, source) => { + connect(vertex, evt, source) { const { graph } = this.editor; const model = graph.getModel(); @@ -464,7 +464,7 @@ class mxDefaultToolbar { graph.setSelectionCells([vertex, edge]); graph.scrollCellToVisible(vertex); } - }; + } /** * Function: installDropHandler @@ -477,7 +477,7 @@ class mxDefaultToolbar { * img - DOM node that represents the image. * dropHandler - Function that handles a drop of the image. */ - installDropHandler = (img, dropHandler) => { + installDropHandler(img, dropHandler) { const sprite = document.createElement('img'); sprite.setAttribute('src', img.getAttribute('src')); @@ -494,7 +494,7 @@ class mxDefaultToolbar { mxUtils.makeDraggable(img, this.editor.graph, dropHandler, sprite); mxEvent.removeListener(sprite, 'load', loader); }); - }; + } /** * Function: destroy @@ -504,7 +504,7 @@ class mxDefaultToolbar { * is destroyed automatically when the window unloads (in IE) by * . */ - destroy = () => { + destroy() { if (this.resetHandler != null) { this.editor.graph.removeListener('dblclick', this.resetHandler); this.editor.removeListener('escape', this.resetHandler); @@ -515,7 +515,7 @@ class mxDefaultToolbar { this.toolbar.destroy(); this.toolbar = null; } - }; + } } export default mxDefaultToolbar; diff --git a/src/mxgraph/editor/mxEditor.js b/src/mxgraph/editor/mxEditor.js index c7d64bc6d..2ae96a8ef 100644 --- a/src/mxgraph/editor/mxEditor.js +++ b/src/mxgraph/editor/mxEditor.js @@ -29,9 +29,9 @@ import mxEvent from '../util/mxEvent'; import mxRootChange from '../model/atomic_changes/mxRootChange'; import mxValueChange from '../model/atomic_changes/mxValueChange'; import mxCellAttributeChange from '../model/atomic_changes/mxCellAttributeChange'; -import mxPrintPreview from "../view/mxPrintPreview"; -import mxClipboard from "../util/mxClipboard"; -import mxLog from "../util/mxLog"; +import mxPrintPreview from '../view/mxPrintPreview'; +import mxClipboard from '../util/mxClipboard'; +import mxLog from '../util/mxLog'; /** * Installs the required language resources at class @@ -929,18 +929,18 @@ class mxEditor extends mxEventSource { * * Returns . */ - isModified = () => { + isModified() { return this.modified; - }; + } /** * Function: setModified * * Sets to the specified boolean value. */ - setModified = value => { + setModified(value) { this.modified = value; - }; + } /** * Function: addActions @@ -1001,7 +1001,7 @@ class mxEditor extends mxEventSource { * toggleOutline - Shows or hides the outline window. * toggleConsole - Shows or hides the console window. */ - addActions = () => { + addActions() { this.addAction('save', editor => { editor.save(); }); @@ -1372,7 +1372,7 @@ class mxEditor extends mxEventSource { this.addAction('toggleConsole', editor => { mxLog.setVisible(!mxLog.isVisible()); }); - }; + } /** * Function: configure @@ -1389,7 +1389,7 @@ class mxEditor extends mxEventSource { * * node - XML node that contains the configuration. */ - configure = node => { + configure(node) { if (node != null) { // Creates a decoder for the XML data // and uses it to configure the editor @@ -1400,7 +1400,7 @@ class mxEditor extends mxEventSource { // command history this.resetHistory(); } - }; + } /** * Function: resetFirstTime @@ -1408,22 +1408,22 @@ class mxEditor extends mxEventSource { * Resets the cookie that is used to remember if the editor has already * been used. */ - resetFirstTime = () => { + resetFirstTime() { document.cookie = 'mxgraph=seen; expires=Fri, 27 Jul 2001 02:47:11 UTC; path=/'; - }; + } /** * Function: resetHistory * * Resets the command history, modified state and counters. */ - resetHistory = () => { + resetHistory() { this.lastSnapshot = new Date().getTime(); this.undoManager.clear(); this.ignoredChanges = 0; this.setModified(false); - }; + } /** * Function: addAction @@ -1447,9 +1447,9 @@ class mxEditor extends mxEventSource { * }); * (end) */ - addAction = (actionname, funct) => { + addAction(actionname, funct) { this.actions[actionname] = funct; - }; + } /** * Function: execute @@ -1467,7 +1467,7 @@ class mxEditor extends mxEventSource { * editor.execute("showProperties", cell); * (end) */ - execute = (actionname, cell, evt) => { + execute(actionname, cell, evt) { const action = this.actions[actionname]; if (action != null) { @@ -1486,25 +1486,25 @@ class mxEditor extends mxEventSource { } else { mxUtils.error(`Cannot find action ${actionname}`, 280, true); } - }; + } /** * Function: addTemplate * * Adds the specified template under the given name in . */ - addTemplate = (name, template) => { + addTemplate(name, template) { this.templates[name] = template; - }; + } /** * Function: getTemplate * * Returns the template for the given name. */ - getTemplate = name => { + getTemplate(name) { return this.templates[name]; - }; + } /** * Function: createGraph @@ -1512,7 +1512,7 @@ class mxEditor extends mxEventSource { * Creates the for the editor. The graph is created with no * container and is initialized from . */ - createGraph = () => { + createGraph() { const graph = new mxGraph(null, null, this.graphRenderHint); // Enables rubberband, tooltips, panning @@ -1555,14 +1555,14 @@ class mxEditor extends mxEventSource { this.createLayoutManager(graph); return graph; - }; + } /** * Function: createSwimlaneManager * * Sets the graph's container using . */ - createSwimlaneManager = graph => { + createSwimlaneManager(graph) { const swimlaneMgr = new mxSwimlaneManager(graph, false); swimlaneMgr.isHorizontal = mxUtils.bind(this, () => { @@ -1574,7 +1574,7 @@ class mxEditor extends mxEventSource { }; return swimlaneMgr; - }; + } /** * Function: createLayoutManager @@ -1582,7 +1582,7 @@ class mxEditor extends mxEventSource { * Creates a layout manager for the swimlane and diagram layouts, that * is, the locally defined inter- and intraswimlane layouts. */ - createLayoutManager = graph => { + createLayoutManager(graph) { const layoutMgr = new mxLayoutManager(graph); const self = this; // closure @@ -1622,14 +1622,14 @@ class mxEditor extends mxEventSource { }; return layoutMgr; - }; + } /** * Function: setGraphContainer * * Sets the graph's container using . */ - setGraphContainer = container => { + setGraphContainer(container) { if (this.graph.container == null) { // Creates the graph instance inside the given container and render hint // this.graph = new mxGraph(container, null, this.graphRenderHint); @@ -1644,7 +1644,7 @@ class mxEditor extends mxEventSource { mxEvent.disableContextMenu(container); } } - }; + } /** * Function: installDblClickHandler @@ -1652,7 +1652,7 @@ class mxEditor extends mxEventSource { * Overrides to invoke * on a cell and reset the selection tool in the toolbar. */ - installDblClickHandler = graph => { + installDblClickHandler(graph) { // Installs a listener for double click events graph.addListener( mxEvent.DOUBLE_CLICK, @@ -1665,14 +1665,14 @@ class mxEditor extends mxEventSource { } }) ); - }; + } /** * Function: installUndoHandler * * Adds the to the graph model and the view. */ - installUndoHandler = graph => { + installUndoHandler(graph) { const listener = (sender, evt) => { const edit = evt.getProperty('edit'); this.undoManager.undoableEditHappened(edit); @@ -1689,21 +1689,21 @@ class mxEditor extends mxEventSource { this.undoManager.addListener(mxEvent.UNDO, undoHandler); this.undoManager.addListener(mxEvent.REDO, undoHandler); - }; + } /** * Function: installDrillHandler * * Installs listeners for dispatching the event. */ - installDrillHandler = graph => { + installDrillHandler(graph) { const listener = mxUtils.bind(this, sender => { this.fireEvent(new mxEventObject(mxEvent.ROOT)); }); graph.getView().addListener(mxEvent.DOWN, listener); graph.getView().addListener(mxEvent.UP, listener); - }; + } /** * Function: installChangeHandler @@ -1712,7 +1712,7 @@ class mxEditor extends mxEventSource { * the graph. On each change of the root, this implementation * fires a event. */ - installChangeHandler = graph => { + installChangeHandler(graph) { const listener = (sender, evt) => { // Updates the modified state this.setModified(true); @@ -1743,7 +1743,7 @@ class mxEditor extends mxEventSource { }; graph.getModel().addListener(mxEvent.CHANGE, listener); - }; + } /** * Function: installInsertHandler @@ -1751,7 +1751,7 @@ class mxEditor extends mxEventSource { * Installs the handler for invoking if * one is defined. */ - installInsertHandler = graph => { + installInsertHandler(graph) { const self = this; // closure const insertHandler = { mouseDown: (sender, me) => { @@ -1785,7 +1785,7 @@ class mxEditor extends mxEventSource { }; graph.addMouseListener(insertHandler); - }; + } /** * Function: createDiagramLayout @@ -1793,7 +1793,7 @@ class mxEditor extends mxEventSource { * Creates the layout instance used to layout the * swimlanes in the diagram. */ - createDiagramLayout = () => { + createDiagramLayout() { const gs = this.graph.gridSize; const layout = new mxStackLayout( this.graph, @@ -1809,7 +1809,7 @@ class mxEditor extends mxEventSource { }; return layout; - }; + } /** * Function: createSwimlaneLayout @@ -1817,27 +1817,27 @@ class mxEditor extends mxEventSource { * Creates the layout instance used to layout the * children of each swimlane. */ - createSwimlaneLayout = () => { + createSwimlaneLayout() { return new mxCompactTreeLayout(this.graph, this.horizontalFlow); - }; + } /** * Function: createToolbar * * Creates the with no container. */ - createToolbar = () => { + createToolbar() { return new mxDefaultToolbar(null, this); - }; + } /** * Function: setToolbarContainer * * Initializes the toolbar for the given container. */ - setToolbarContainer = container => { + setToolbarContainer(container) { this.toolbar.init(container); - }; + } /** * Function: setStatusContainer @@ -1852,7 +1852,7 @@ class mxEditor extends mxEventSource { * * container - DOM node that will contain the statusbar. */ - setStatusContainer = container => { + setStatusContainer(container) { if (this.status == null) { this.status = container; @@ -1878,7 +1878,7 @@ class mxEditor extends mxEventSource { ); }); } - }; + } /** * Function: setStatus @@ -1890,11 +1890,11 @@ class mxEditor extends mxEventSource { * message - String the specified the message to * be displayed. */ - setStatus = message => { + setStatus(message) { if (this.status != null && message != null) { this.status.innerHTML = message; } - }; + } /** * Function: setTitleContainer @@ -1906,14 +1906,14 @@ class mxEditor extends mxEventSource { * * container - DOM node that will contain the title. */ - setTitleContainer = container => { + setTitleContainer(container) { this.addListener( mxEvent.ROOT, mxUtils.bind(this, sender => { container.innerHTML = this.getTitle(); }) ); - }; + } /** * Function: treeLayout @@ -1928,12 +1928,12 @@ class mxEditor extends mxEventSource { * horizontal - Optional boolean to specify the tree's * orientation. Default is true. */ - treeLayout = (cell, horizontal) => { + treeLayout(cell, horizontal) { if (cell != null) { const layout = new mxCompactTreeLayout(this.graph, horizontal); layout.execute(cell); } - }; + } /** * Function: getTitle @@ -1941,7 +1941,7 @@ class mxEditor extends mxEventSource { * Returns the string value for the current root of the * diagram. */ - getTitle = () => { + getTitle() { let title = ''; const { graph } = this; let cell = graph.getCurrentRoot(); @@ -1961,7 +1961,7 @@ class mxEditor extends mxEventSource { const prefix = this.getRootTitle(); return prefix + title; - }; + } /** * Function: getRootTitle @@ -1969,28 +1969,28 @@ class mxEditor extends mxEventSource { * Returns the string value of the root cell in * . */ - getRootTitle = () => { + getRootTitle() { const root = this.graph.getModel().getRoot(); return this.graph.convertValueToString(root); - }; + } /** * Function: undo * * Undo the last change in . */ - undo = () => { + undo() { this.undoManager.undo(); - }; + } /** * Function: redo * * Redo the last change in . */ - redo = () => { + redo() { this.undoManager.redo(); - }; + } /** * Function: groupCells @@ -1999,11 +1999,11 @@ class mxEditor extends mxEventSource { * , using the grid size of the graph as the spacing * in the group's content area. */ - groupCells = () => { + groupCells() { const border = this.groupBorderSize != null ? this.groupBorderSize : this.graph.gridSize; return this.graph.groupCells(this.createGroup(), border); - }; + } /** * Function: createGroup @@ -2011,11 +2011,11 @@ class mxEditor extends mxEventSource { * Creates and returns a clone of to be used * as a new group cell in . */ - createGroup = () => { + createGroup() { const model = this.graph.getModel(); return model.cloneCell(this.defaultGroup); - }; + } /** * Function: open @@ -2040,7 +2040,7 @@ class mxEditor extends mxEventSource { * * filename - URL of the file to be opened. */ - open = filename => { + open(filename) { if (filename != null) { const xml = mxUtils.load(filename).getXml(); this.readGraphModel(xml.documentElement); @@ -2048,7 +2048,7 @@ class mxEditor extends mxEventSource { this.fireEvent(new mxEventObject(mxEvent.OPEN, 'filename', filename)); } - }; + } /** * Function: readGraphModel @@ -2056,11 +2056,11 @@ class mxEditor extends mxEventSource { * Reads the specified XML node into the existing graph model and resets * the command history and modified state. */ - readGraphModel = node => { + readGraphModel(node) { const dec = new mxCodec(node.ownerDocument); dec.decode(node, this.graph.getModel()); this.resetHistory(); - }; + } /** * Function: save @@ -2082,7 +2082,7 @@ class mxEditor extends mxEventSource { * } * (end) */ - save = (url, linefeed) => { + save(url, linefeed) { // Gets the URL to post the data to url = url || this.getUrlPost(); @@ -2097,7 +2097,7 @@ class mxEditor extends mxEventSource { // Dispatches a save event this.fireEvent(new mxEventObject(mxEvent.SAVE, 'url', url)); - }; + } /** * Function: postDiagram @@ -2121,7 +2121,7 @@ class mxEditor extends mxEventSource { * }); * (end) */ - postDiagram = (url, data) => { + postDiagram(url, data) { if (this.escapePostData) { data = encodeURIComponent(data); } @@ -2139,7 +2139,7 @@ class mxEditor extends mxEventSource { ) ); }); - }; + } /** * Function: writeGraphModel @@ -2159,13 +2159,13 @@ class mxEditor extends mxEventSource { * linefeed - Optional character to be used as the linefeed. Default is * . */ - writeGraphModel = linefeed => { + writeGraphModel(linefeed) { linefeed = linefeed != null ? linefeed : this.linefeed; const enc = new mxCodec(); const node = enc.encode(this.graph.getModel()); return mxUtils.getXml(node, linefeed); - }; + } /** * Function: getUrlPost @@ -2174,9 +2174,9 @@ class mxEditor extends mxEventSource { * in . The default implementation returns , * adding ?draft=true. */ - getUrlPost = () => { + getUrlPost() { return this.urlPost; - }; + } /** * Function: getUrlImage @@ -2187,9 +2187,9 @@ class mxEditor extends mxEventSource { * in the image action to create an image. This implementation * returns . */ - getUrlImage = () => { + getUrlImage() { return this.urlImage; - }; + } /** * Function: swapStyles @@ -2197,7 +2197,7 @@ class mxEditor extends mxEventSource { * Swaps the styles for the given names in the graph's * stylesheet and refreshes the graph. */ - swapStyles = (first, second) => { + swapStyles(first, second) { const style = this.graph.getStylesheet().styles[second]; this.graph .getView() @@ -2205,7 +2205,7 @@ class mxEditor extends mxEventSource { .putCellStyle(second, this.graph.getStylesheet().styles[first]); this.graph.getStylesheet().putCellStyle(first, style); this.graph.refresh(); - }; + } /** * Function: showProperties @@ -2214,7 +2214,7 @@ class mxEditor extends mxEventSource { * cell. The content area of the dialog is created using * . */ - showProperties = cell => { + showProperties(cell) { cell = cell || this.graph.getSelectionCell(); // Uses the root node for the properties dialog @@ -2274,16 +2274,16 @@ class mxEditor extends mxEventSource { this.properties.setVisible(true); } } - }; + } /** * Function: isPropertiesVisible * * Returns true if the properties dialog is currently visible. */ - isPropertiesVisible = () => { + isPropertiesVisible() { return this.properties != null; - }; + } /** * Function: createProperties @@ -2293,7 +2293,7 @@ class mxEditor extends mxEventSource { * works for user objects that are XML nodes and display all the * node attributes in a form. */ - createProperties = cell => { + createProperties(cell) { const model = this.graph.getModel(); const value = model.getValue(cell); @@ -2414,19 +2414,19 @@ class mxEditor extends mxEventSource { } return null; - }; + } /** * Function: hideProperties * * Hides the properties dialog. */ - hideProperties = () => { + hideProperties() { if (this.properties != null) { this.properties.destroy(); this.properties = null; } - }; + } /** * Function: showTasks @@ -2450,7 +2450,7 @@ class mxEditor extends mxEventSource { * }; * (end) */ - showTasks = () => { + showTasks() { if (this.tasks == null) { const div = document.createElement('div'); div.style.padding = '4px'; @@ -2489,21 +2489,21 @@ class mxEditor extends mxEventSource { } this.tasks.setVisible(true); - }; + } /** * Function: refreshTasks * * Updates the contents of the tasks window using . */ - refreshTasks = div => { + refreshTasks(div) { if (this.tasks != null) { const div = this.tasks.content; mxEvent.release(div); div.innerHTML = ''; this.createTasks(div); } - }; + } /** * Function: createTasks @@ -2514,9 +2514,9 @@ class mxEditor extends mxEventSource { * is a possible change of state in the editor. * Default implementation is empty. */ - createTasks = div => { + createTasks(div) { // override - }; + } /** * Function: showHelp @@ -2526,7 +2526,7 @@ class mxEditor extends mxEventSource { * for the urlHelp key or if the resource * is undefined. */ - showHelp = tasks => { + showHelp(tasks) { if (this.help == null) { const frame = document.createElement('iframe'); frame.setAttribute('src', mxResources.get('urlHelp') || this.urlHelp); @@ -2574,7 +2574,7 @@ class mxEditor extends mxEventSource { } this.help.setVisible(true); - }; + } /** * Function: showOutline @@ -2582,7 +2582,7 @@ class mxEditor extends mxEventSource { * Shows the outline window. If the window does not exist, then it is * created using an . */ - showOutline = () => { + showOutline() { const create = this.outline == null; if (create) { @@ -2623,7 +2623,7 @@ class mxEditor extends mxEventSource { // Finally shows the outline this.outline.setVisible(true); this.outline.outline.update(true); - }; + } /** * Function: setMode @@ -2637,7 +2637,7 @@ class mxEditor extends mxEventSource { * connections if mouse over cell hotspot. See . * pan - Pans using the left mouse button, new connections are disabled. */ - setMode = modename => { + setMode(modename) { if (modename === 'select') { this.graph.panningHandler.useLeftButtonForPanning = false; this.graph.setConnectable(false); @@ -2648,7 +2648,7 @@ class mxEditor extends mxEventSource { this.graph.panningHandler.useLeftButtonForPanning = true; this.graph.setConnectable(false); } - }; + } /** * Function: createPopupMenu @@ -2657,9 +2657,9 @@ class mxEditor extends mxEventSource { * panning handler. The redirection is setup in * . */ - createPopupMenu = (menu, cell, evt) => { + createPopupMenu(menu, cell, evt) { this.popupHandler.createMenu(this, menu, cell, evt); - }; + } /** * Function: createEdge @@ -2669,7 +2669,7 @@ class mxEditor extends mxEventSource { * edge will be overridden with the value returned by * . */ - createEdge = (source, target) => { + createEdge(source, target) { // Clones the defaultedge prototype let e = null; @@ -2693,7 +2693,7 @@ class mxEditor extends mxEventSource { } return e; - }; + } /** * Function: getEdgeStyle @@ -2702,9 +2702,9 @@ class mxEditor extends mxEventSource { * The function is used in when new edges * are created in the graph. */ - getEdgeStyle = () => { + getEdgeStyle() { return this.defaultEdgeStyle; - }; + } /** * Function: consumeCycleAttribute @@ -2713,7 +2713,7 @@ class mxEditor extends mxEventSource { * or null, if not attribute should be used in the * specified cell. */ - consumeCycleAttribute = cell => { + consumeCycleAttribute(cell) { return this.cycleAttributeValues != null && this.cycleAttributeValues.length > 0 && this.graph.isSwimlane(cell) @@ -2721,7 +2721,7 @@ class mxEditor extends mxEventSource { this.cycleAttributeIndex++ % this.cycleAttributeValues.length ] : null; - }; + } /** * Function: cycleAttribute @@ -2730,7 +2730,7 @@ class mxEditor extends mxEventSource { * as the value for the key in * the given cell's style. */ - cycleAttribute = cell => { + cycleAttribute(cell) { if (this.cycleAttributeName != null) { const value = this.consumeCycleAttribute(cell); @@ -2738,7 +2738,7 @@ class mxEditor extends mxEventSource { cell.setStyle(`${cell.getStyle()};${this.cycleAttributeName}=${value}`); } } - }; + } /** * Function: addVertex @@ -2746,7 +2746,7 @@ class mxEditor extends mxEventSource { * Adds the given vertex as a child of parent at the specified * x and y coordinate and fires an event. */ - addVertex = (parent, vertex, x, y) => { + addVertex(parent, vertex, x, y) { const model = this.graph.getModel(); while (parent != null && !this.graph.isValidDropTarget(parent)) { @@ -2838,7 +2838,7 @@ class mxEditor extends mxEventSource { } return vertex; - }; + } /** * Function: destroy @@ -2847,7 +2847,7 @@ class mxEditor extends mxEventSource { * normally need to be called, it is called automatically when the window * unloads. */ - destroy = () => { + destroy() { if (!this.destroyed) { this.destroyed = true; @@ -2882,7 +2882,7 @@ class mxEditor extends mxEventSource { this.status = null; this.templates = null; } - }; + } } export default mxEditor; diff --git a/src/mxgraph/handler/mxCellHighlight.js b/src/mxgraph/handler/mxCellHighlight.js index ebc539f14..d8052b1f8 100644 --- a/src/mxgraph/handler/mxCellHighlight.js +++ b/src/mxgraph/handler/mxCellHighlight.js @@ -5,7 +5,7 @@ */ import mxConstants from '../util/mxConstants'; import mxEvent from '../util/mxEvent'; -import mxRectangle from "../util/mxRectangle"; +import mxRectangle from '../util/mxRectangle'; class mxCellHighlight { /** @@ -113,20 +113,20 @@ class mxCellHighlight { * * color - String that represents the new highlight color. */ - setHighlightColor = color => { + setHighlightColor(color) { this.highlightColor = color; if (this.shape != null) { this.shape.stroke = color; } - }; + } /** * Function: drawHighlight * * Creates and returns the highlight shape for the given state. */ - drawHighlight = () => { + drawHighlight() { this.shape = this.createShape(); this.repaint(); @@ -139,14 +139,14 @@ class mxCellHighlight { this.shape.node.parentNode.firstChild ); } - }; + } /** * Function: createShape * * Creates and returns the highlight shape for the given state. */ - createShape = () => { + createShape() { const shape = this.graph.cellRenderer.createShape(this.state); shape.svgStrokeTolerance = this.graph.tolerance; @@ -168,23 +168,23 @@ class mxCellHighlight { } return shape; - }; + } /** * Function: getStrokeWidth * * Returns the stroke width. */ - getStrokeWidth = state => { + getStrokeWidth(state) { return this.strokeWidth; - }; + } /** * Function: repaint * * Updates the highlight after a change of the model or view. */ - repaint = () => { + repaint() { if (this.state != null && this.shape != null) { this.shape.scale = this.state.view.scale; @@ -213,23 +213,23 @@ class mxCellHighlight { this.shape.redraw(); } - }; + } /** * Function: hide * * Resets the state of the cell marker. */ - hide = () => { + hide() { this.highlight(null); - }; + } /** * Function: mark * * Marks the and fires a event. */ - highlight = state => { + highlight(state) { if (this.state !== state) { if (this.shape != null) { this.shape.destroy(); @@ -242,14 +242,14 @@ class mxCellHighlight { this.drawHighlight(); } } - }; + } /** * Function: isHighlightAt * * Returns true if this highlight is at the given position. */ - isHighlightAt = (x, y) => { + isHighlightAt(x, y) { let hit = false; if (this.shape != null && document.elementFromPoint != null) { @@ -266,14 +266,14 @@ class mxCellHighlight { } return hit; - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { this.graph.getView().removeListener(this.resetHandler); this.graph.getView().removeListener(this.repaintHandler); this.graph.getModel().removeListener(this.repaintHandler); @@ -282,7 +282,7 @@ class mxCellHighlight { this.shape.destroy(); this.shape = null; } - }; + } } export default mxCellHighlight; diff --git a/src/mxgraph/handler/mxCellMarker.js b/src/mxgraph/handler/mxCellMarker.js index f992ce0ca..bf286dca8 100644 --- a/src/mxgraph/handler/mxCellMarker.js +++ b/src/mxgraph/handler/mxCellMarker.js @@ -7,8 +7,8 @@ import mxEventSource from '../util/mxEventSource'; import mxConstants from '../util/mxConstants'; import mxCellHighlight from './mxCellHighlight'; import mxEventObject from '../util/mxEventObject'; -import mxEvent from "../util/mxEvent"; -import mxUtils from "../util/mxUtils"; +import mxEvent from '../util/mxEvent'; +import mxUtils from '../util/mxUtils'; class mxCellMarker extends mxEventSource { /** @@ -142,9 +142,9 @@ class mxCellMarker extends mxEventSource { * * enabled - Boolean that specifies the new enabled state. */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: isEnabled @@ -152,86 +152,86 @@ class mxCellMarker extends mxEventSource { * Returns true if events are handled. This implementation * returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setHotspot * * Sets the . */ - setHotspot = hotspot => { + setHotspot(hotspot) { this.hotspot = hotspot; - }; + } /** * Function: getHotspot * * Returns the . */ - getHotspot = () => { + getHotspot() { return this.hotspot; - }; + } /** * Function: setHotspotEnabled * * Specifies whether the hotspot should be used in . */ - setHotspotEnabled = enabled => { + setHotspotEnabled(enabled) { this.hotspotEnabled = enabled; - }; + } /** * Function: isHotspotEnabled * * Returns true if hotspot is used in . */ - isHotspotEnabled = () => { + isHotspotEnabled() { return this.hotspotEnabled; - }; + } /** * Function: hasValidState * * Returns true if is not null. */ - hasValidState = () => { + hasValidState() { return this.validState != null; - }; + } /** * Function: getValidState * * Returns the . */ - getValidState = () => { + getValidState() { return this.validState; - }; + } /** * Function: getMarkedState * * Returns the . */ - getMarkedState = () => { + getMarkedState() { return this.markedState; - }; + } /** * Function: reset * * Resets the state of the cell marker. */ - reset = () => { + reset() { this.validState = null; if (this.markedState != null) { this.markedState = null; this.unmark(); } - }; + } /** * Function: process @@ -243,7 +243,7 @@ class mxCellMarker extends mxEventSource { * regardless of the marker color. The state is returned regardless of the * marker color and valid state. */ - process = me => { + process(me) { let state = null; if (this.isEnabled()) { @@ -252,14 +252,14 @@ class mxCellMarker extends mxEventSource { } return state; - }; + } /** * Function: setCurrentState * * Sets and marks the current valid state. */ - setCurrentState = (state, me, color) => { + setCurrentState(state, me, color) { const isValid = state != null ? this.isValidState(state) : false; color = color != null @@ -283,14 +283,14 @@ class mxCellMarker extends mxEventSource { this.unmark(); } } - }; + } /** * Function: markCell * * Marks the given cell using the given color, or if no color is specified. */ - markCell = (cell, color) => { + markCell(cell, color) { const state = this.graph.getView().getState(cell); if (state != null) { @@ -298,27 +298,27 @@ class mxCellMarker extends mxEventSource { this.markedState = state; this.mark(); } - }; + } /** * Function: mark * * Marks the and fires a event. */ - mark = () => { + mark() { this.highlight.setHighlightColor(this.currentColor); this.highlight.highlight(this.markedState); this.fireEvent(new mxEventObject(mxEvent.MARK, 'state', this.markedState)); - }; + } /** * Function: unmark * * Hides the marker and fires a event. */ - unmark = () => { + unmark() { this.mark(); - }; + } /** * Function: isValidState @@ -327,9 +327,9 @@ class mxCellMarker extends mxEventSource { * returns true, then the state is stored in . The return value * of this method is used as the argument for . */ - isValidState = state => { + isValidState(state) { return true; - }; + } /** * Function: getMarkerColor @@ -337,9 +337,9 @@ class mxCellMarker extends mxEventSource { * Returns the valid- or invalidColor depending on the value of isValid. * The given is ignored by this implementation. */ - getMarkerColor = (evt, state, isValid) => { + getMarkerColor(evt, state, isValid) { return isValid ? this.validColor : this.invalidColor; - }; + } /** * Function: getState @@ -347,13 +347,13 @@ class mxCellMarker extends mxEventSource { * Uses , and to return the * for the given . */ - getState = me => { + getState(me) { const view = this.graph.getView(); const cell = this.getCell(me); const state = this.getStateToMark(view.getState(cell)); return state != null && this.intersects(state, me) ? state : null; - }; + } /** * Function: getCell @@ -363,7 +363,7 @@ class mxCellMarker extends mxEventSource { */ getCell(me) { return me.getCell(); - }; + } /** * Function: getStateToMark @@ -371,9 +371,9 @@ class mxCellMarker extends mxEventSource { * Returns the to be marked for the given under * the mouse. This returns the given state. */ - getStateToMark = state => { + getStateToMark(state) { return state; - }; + } /** * Function: intersects @@ -382,7 +382,7 @@ class mxCellMarker extends mxEventSource { * This returns true if the is 0 or the coordinates are inside * the hotspot for the given cell state. */ - intersects = (state, me) => { + intersects(state, me) { if (this.hotspotEnabled) { return mxUtils.intersectsHotspot( state, @@ -395,7 +395,7 @@ class mxCellMarker extends mxEventSource { } return true; - }; + } /** * Function: destroy @@ -406,7 +406,7 @@ class mxCellMarker extends mxEventSource { this.graph.getView().removeListener(this.resetHandler); this.graph.getModel().removeListener(this.resetHandler); this.highlight.destroy(); - }; + } } export default mxCellMarker; diff --git a/src/mxgraph/handler/mxCellTracker.js b/src/mxgraph/handler/mxCellTracker.js index 4e95fa716..4d85e17cc 100644 --- a/src/mxgraph/handler/mxCellTracker.js +++ b/src/mxgraph/handler/mxCellTracker.js @@ -3,7 +3,7 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxCellMarker from "./mxCellMarker"; +import mxCellMarker from './mxCellMarker'; class mxCellTracker extends mxCellMarker { /** @@ -91,7 +91,7 @@ class mxCellTracker extends mxCellMarker { * * Ignores the event. The event is not consumed. */ - mouseDown = (sender, me) => {}; + mouseDown(sender, me) {} /** * Function: mouseMove @@ -99,18 +99,18 @@ class mxCellTracker extends mxCellMarker { * Handles the event by highlighting the cell under the mousepointer if it * is over the hotspot region of the cell. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (this.isEnabled()) { this.process(me); } - }; + } /** * Function: mouseUp * * Handles the event by reseting the highlight. */ - mouseUp = (sender, me) => {}; + mouseUp(sender, me) {} /** * Function: destroy @@ -119,14 +119,14 @@ class mxCellTracker extends mxCellMarker { * normally need to be called. It is called automatically when the window * unloads. */ - destroy = () => { + destroy() { if (!this.destroyed) { this.destroyed = true; this.graph.removeMouseListener(this); super.destroy(); } - }; + } } export default mxCellTracker; diff --git a/src/mxgraph/handler/mxConnectionHandler.js b/src/mxgraph/handler/mxConnectionHandler.js index 96ae83b9f..cbe5c8de4 100644 --- a/src/mxgraph/handler/mxConnectionHandler.js +++ b/src/mxgraph/handler/mxConnectionHandler.js @@ -16,7 +16,7 @@ import mxConstraintHandler from './mxConstraintHandler'; import mxPolyline from '../shape/mxPolyline'; import mxEventSource from '../util/mxEventSource'; import mxRectangle from '../util/mxRectangle'; -import mxLog from "../util/mxLog"; +import mxLog from '../util/mxLog'; class mxConnectionHandler extends mxEventSource { /** @@ -403,9 +403,9 @@ class mxConnectionHandler extends mxEventSource { * Returns true if events are handled. This implementation * returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -417,9 +417,9 @@ class mxConnectionHandler extends mxEventSource { * * enabled - Boolean that specifies the new enabled state. */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: isInsertBefore @@ -435,9 +435,9 @@ class mxConnectionHandler extends mxEventSource { * dropTarget - that represents the cell under the mouse when it was * released. */ - isInsertBefore = (edge, source, target, evt, dropTarget) => { + isInsertBefore(edge, source, target, evt, dropTarget) { return this.insertBeforeSource && source !== target; - }; + } /** * Function: isCreateTarget @@ -448,25 +448,25 @@ class mxConnectionHandler extends mxEventSource { * * evt - Current active native pointer event. */ - isCreateTarget = evt => { + isCreateTarget(evt) { return this.createTarget; - }; + } /** * Function: setCreateTarget * * Sets . */ - setCreateTarget = value => { + setCreateTarget(value) { this.createTarget = value; - }; + } /** * Function: createShape * * Creates the preview shape for new connections. */ - createShape = () => { + createShape() { // Creates the edge preview const shape = this.livePreview && this.edgeState != null @@ -480,7 +480,7 @@ class mxConnectionHandler extends mxEventSource { mxEvent.redirectMouseEvents(shape.node, this.graph, null); return shape; - }; + } /** * Function: init @@ -489,7 +489,7 @@ class mxConnectionHandler extends mxEventSource { * be invoked if is assigned after the connection * handler has been created. */ - init = () => { + init() { this.graph.addMouseListener(this); this.marker = this.createMarker(); this.constraintHandler = new mxConstraintHandler(this.graph); @@ -526,7 +526,7 @@ class mxConnectionHandler extends mxEventSource { this.graph.addListener(mxEvent.START_EDITING, this.drillHandler); this.graph.getView().addListener(mxEvent.DOWN, this.drillHandler); this.graph.getView().addListener(mxEvent.UP, this.drillHandler); - }; + } /** * Function: isConnectableCell @@ -534,16 +534,16 @@ class mxConnectionHandler extends mxEventSource { * Returns true if the given cell is connectable. This is a hook to * disable floating connections. This implementation returns true. */ - isConnectableCell = cell => { + isConnectableCell(cell) { return true; - }; + } /** * Function: createMarker * * Creates and returns the used in . */ - createMarker = () => { + createMarker() { const self = this; class MyCellMarker extends mxCellMarker { @@ -640,14 +640,14 @@ class mxConnectionHandler extends mxEventSource { } return new MyCellMarker(this.graph); - }; + } /** * Function: start * * Starts a new connection for the given state and coordinates. */ - start = (state, x, y, edgeState) => { + start(state, x, y, edgeState) { this.previous = state; this.first = new mxPoint(x, y); this.edgeState = edgeState != null ? edgeState : this.createEdgeState(null); @@ -658,7 +658,7 @@ class mxConnectionHandler extends mxEventSource { this.marker.mark(); this.fireEvent(new mxEventObject(mxEvent.START, 'state', this.previous)); - }; + } /** * Function: isConnecting @@ -666,9 +666,9 @@ class mxConnectionHandler extends mxEventSource { * Returns true if the source terminal has been clicked and a new * connection is currently being previewed. */ - isConnecting = () => { + isConnecting() { return this.first != null && this.shape != null; - }; + } /** * Function: isValidSource @@ -680,9 +680,9 @@ class mxConnectionHandler extends mxEventSource { * cell - that represents the source terminal. * me - that is associated with this call. */ - isValidSource = (cell, me) => { + isValidSource(cell, me) { return this.graph.isValidSource(cell); - }; + } /** * Function: isValidTarget @@ -695,9 +695,9 @@ class mxConnectionHandler extends mxEventSource { * * cell - that represents the target terminal. */ - isValidTarget = cell => { + isValidTarget(cell) { return true; - }; + } /** * Function: validateConnection @@ -711,13 +711,13 @@ class mxConnectionHandler extends mxEventSource { * source - that represents the source terminal. * target - that represents the target terminal. */ - validateConnection = (source, target) => { + validateConnection(source, target) { if (!this.isValidTarget(target)) { return ''; } return this.graph.getEdgeValidationError(null, source, target); - }; + } /** * Function: getConnectImage @@ -729,9 +729,9 @@ class mxConnectionHandler extends mxEventSource { * * state - whose connect image should be returned. */ - getConnectImage = state => { + getConnectImage(state) { return this.connectImage; - }; + } /** * Function: isMoveIconToFrontForState @@ -743,7 +743,7 @@ class mxConnectionHandler extends mxEventSource { * * state - whose connect icons should be returned. */ - isMoveIconToFrontForState = state => { + isMoveIconToFrontForState(state) { if ( state.text != null && state.text.node.parentNode === this.graph.container @@ -752,7 +752,7 @@ class mxConnectionHandler extends mxEventSource { } return this.moveIconFront; - }; + } /** * Function: createIcons @@ -764,7 +764,7 @@ class mxConnectionHandler extends mxEventSource { * * state - whose connect icons should be returned. */ - createIcons = state => { + createIcons(state) { const image = this.getConnectImage(state); if (image != null && state != null) { @@ -822,7 +822,7 @@ class mxConnectionHandler extends mxEventSource { } return null; - }; + } /** * Function: redrawIcons @@ -833,14 +833,14 @@ class mxConnectionHandler extends mxEventSource { * * icons - Optional array of to be redrawn. */ - redrawIcons = (icons, state) => { + redrawIcons(icons, state) { if (icons != null && icons[0] != null && state != null) { const pos = this.getIconPosition(icons[0], state); icons[0].bounds.x = pos.x; icons[0].bounds.y = pos.y; icons[0].redraw(); } - }; + } /** * Function: getIconPosition @@ -852,7 +852,7 @@ class mxConnectionHandler extends mxEventSource { * icon - The connect icon of with the mouse. * state - under the mouse. */ - getIconPosition = (icon, state) => { + getIconPosition(icon, state) { const { scale } = this.graph.getView(); let cx = state.getCenterX(); let cy = state.getCenterY(); @@ -878,14 +878,14 @@ class mxConnectionHandler extends mxEventSource { } return new mxPoint(cx - icon.bounds.width / 2, cy - icon.bounds.height / 2); - }; + } /** * Function: destroyIcons * * Destroys the connect icons and resets the respective state. */ - destroyIcons = () => { + destroyIcons() { if (this.icons != null) { for (let i = 0; i < this.icons.length; i += 1) { this.icons[i].destroy(); @@ -896,7 +896,7 @@ class mxConnectionHandler extends mxEventSource { this.selectedIcon = null; this.iconState = null; } - }; + } /** * Function: isStartEvent @@ -907,7 +907,7 @@ class mxConnectionHandler extends mxEventSource { * are not null, or and are not null and * is null or and are not null. */ - isStartEvent = me => { + isStartEvent(me) { return ( (this.constraintHandler.currentFocus !== null && this.constraintHandler.currentConstraint !== null) || @@ -915,14 +915,14 @@ class mxConnectionHandler extends mxEventSource { this.error === null && (this.icons === null || this.icon !== null)) ); - }; + } /** * Function: mouseDown * * Handles the event by initiating a new connection. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { this.mouseDownCounter += 1; if ( @@ -970,7 +970,7 @@ class mxConnectionHandler extends mxEventSource { this.selectedIcon = this.icon; this.icon = null; - }; + } /** * Function: isImmediateConnectSource @@ -979,9 +979,9 @@ class mxConnectionHandler extends mxEventSource { * connecting. This implementation returns true if the state is not movable * in the graph. */ - isImmediateConnectSource = state => { + isImmediateConnectSource(state) { return !this.graph.isCellMovable(state.cell); - }; + } /** * Function: createEdgeState @@ -1000,9 +1000,9 @@ class mxConnectionHandler extends mxEventSource { * }; * (end) */ - createEdgeState = me => { + createEdgeState(me) { return null; - }; + } /** * Function: isOutlineConnectEvent @@ -1010,7 +1010,7 @@ class mxConnectionHandler extends mxEventSource { * Returns true if is true and the source of the event is the outline shape * or shift is pressed. */ - isOutlineConnectEvent = me => { + isOutlineConnectEvent(me) { const offset = mxUtils.getOffset(this.graph.container); const evt = me.getEvent(); @@ -1036,7 +1036,7 @@ class mxConnectionHandler extends mxEventSource { me.getState() == null && this.marker.highlight.isHighlightAt(gridX, gridY))) ); - }; + } /** * Function: updateCurrentState @@ -1044,7 +1044,7 @@ class mxConnectionHandler extends mxEventSource { * Updates the current state for a given mouse move event by using * the . */ - updateCurrentState = (me, point) => { + updateCurrentState(me, point) { this.constraintHandler.update( me, this.first == null, @@ -1172,7 +1172,7 @@ class mxConnectionHandler extends mxEventSource { } } } - }; + } /** * Function: isCellEnabled @@ -1180,22 +1180,22 @@ class mxConnectionHandler extends mxEventSource { * Returns true if the given cell allows new connections to be created. This implementation * always returns true. */ - isCellEnabled = cell => { + isCellEnabled(cell) { return true; - }; + } /** * Function: convertWaypoint * * Converts the given point from screen coordinates to model coordinates. */ - convertWaypoint = point => { + convertWaypoint(point) { const scale = this.graph.getView().getScale(); const tr = this.graph.getView().getTranslate(); point.x = point.x / scale - tr.x; point.y = point.y / scale - tr.y; - }; + } /** * Function: snapToPreview @@ -1203,7 +1203,7 @@ class mxConnectionHandler extends mxEventSource { * Called to snap the given point to the current preview. This snaps to the * first point of the preview if alt is not pressed. */ - snapToPreview = (me, point) => { + snapToPreview(me, point) { if (!mxEvent.isAltDown(me.getEvent()) && this.previous != null) { const tol = (this.graph.gridSize * this.graph.view.scale) / 2; const tmp = @@ -1219,7 +1219,7 @@ class mxConnectionHandler extends mxEventSource { point.y = tmp.y; } } - }; + } /** * Function: mouseMove @@ -1227,7 +1227,7 @@ class mxConnectionHandler extends mxEventSource { * Handles the event by updating the preview edge or by highlighting * a possible source or target terminal. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if ( !me.isConsumed() && (this.ignoreMouseDown || this.first != null || !this.graph.isMouseDown) @@ -1483,14 +1483,14 @@ class mxConnectionHandler extends mxEventSource { } else { this.constraintHandler.reset(); } - }; + } /** * Function: updateEdgeState * * Updates . */ - updateEdgeState = (current, constraint) => { + updateEdgeState(current, constraint) { // TODO: Use generic method for writing constraint to style if (this.sourceConstraint != null && this.sourceConstraint.point != null) { this.edgeState.style[ @@ -1562,7 +1562,7 @@ class mxConnectionHandler extends mxEventSource { this.previous, this.currentState ); - }; + } /** * Function: getTargetPerimeterPoint @@ -1574,7 +1574,7 @@ class mxConnectionHandler extends mxEventSource { * state - that represents the target cell state. * me - that represents the mouse move. */ - getTargetPerimeterPoint = (state, me) => { + getTargetPerimeterPoint(state, me) { let result = null; const { view } = state; const targetPerimeter = view.getPerimeterFunction(state); @@ -1599,7 +1599,7 @@ class mxConnectionHandler extends mxEventSource { } return result; - }; + } /** * Function: getSourcePerimeterPoint @@ -1613,7 +1613,7 @@ class mxConnectionHandler extends mxEventSource { * next - that represents the next point along the previewed edge. * me - that represents the mouse move. */ - getSourcePerimeterPoint = (state, next, me) => { + getSourcePerimeterPoint(state, next, me) { let result = null; const { view } = state; const sourcePerimeter = view.getPerimeterFunction(state); @@ -1660,7 +1660,7 @@ class mxConnectionHandler extends mxEventSource { } return result; - }; + } /** * Function: updateIcons @@ -1674,9 +1674,9 @@ class mxConnectionHandler extends mxEventSource { * icons - Array of currently displayed icons. * me - that contains the mouse event. */ - updateIcons = (state, icons, me) => { + updateIcons(state, icons, me) { // empty - }; + } /** * Function: isStopEvent @@ -1686,16 +1686,16 @@ class mxConnectionHandler extends mxEventSource { * called if is true. This implemtation returns true * if there is a cell state in the given event. */ - isStopEvent = me => { + isStopEvent(me) { return me.getState() != null; - }; + } /** * Function: addWaypoint * * Adds the waypoint for the given event to . */ - addWaypointForEvent = me => { + addWaypointForEvent(me) { let point = mxUtils.convertPoint( this.graph.container, me.getX(), @@ -1720,7 +1720,7 @@ class mxConnectionHandler extends mxEventSource { ); this.waypoints.push(point); } - }; + } /** * Function: checkConstraints @@ -1729,7 +1729,7 @@ class mxConnectionHandler extends mxEventSource { * implementation returns true if the constraints are not pointing to the * same fixed connection point. */ - checkConstraints = (c1, c2) => { + checkConstraints(c1, c2) { return ( c1 == null || c2 == null || @@ -1740,14 +1740,14 @@ class mxConnectionHandler extends mxEventSource { c1.dy !== c2.dy || c1.perimeter !== c2.perimeter ); - }; + } /** * Function: mouseUp * * Handles the event by inserting the new connection. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if (!me.isConsumed() && this.isConnecting()) { if (this.waypointsEnabled && !this.isStopEvent(me)) { this.addWaypointForEvent(me); @@ -1807,14 +1807,14 @@ class mxConnectionHandler extends mxEventSource { if (this.first != null) { this.reset(); } - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { if (this.shape != null) { this.shape.destroy(); this.shape = null; @@ -1838,7 +1838,7 @@ class mxConnectionHandler extends mxEventSource { this.first = null; this.fireEvent(new mxEventObject(mxEvent.RESET)); - }; + } /** * Function: drawPreview @@ -1846,10 +1846,10 @@ class mxConnectionHandler extends mxEventSource { * Redraws the preview edge using the color and width returned by * and . */ - drawPreview = () => { + drawPreview() { this.updatePreview(this.error == null); this.shape.redraw(); - }; + } /** * Function: getEdgeColor @@ -1862,10 +1862,10 @@ class mxConnectionHandler extends mxEventSource { * valid - Boolean indicating if the color for a valid edge should be * returned. */ - updatePreview = valid => { + updatePreview(valid) { this.shape.strokewidth = this.getEdgeWidth(valid); this.shape.stroke = this.getEdgeColor(valid); - }; + } /** * Function: getEdgeColor @@ -1878,9 +1878,9 @@ class mxConnectionHandler extends mxEventSource { * valid - Boolean indicating if the color for a valid edge should be * returned. */ - getEdgeColor = valid => { + getEdgeColor(valid) { return valid ? mxConstants.VALID_COLOR : mxConstants.INVALID_COLOR; - }; + } /** * Function: getEdgeWidth @@ -1893,9 +1893,9 @@ class mxConnectionHandler extends mxEventSource { * valid - Boolean indicating if the width for a valid edge should be * returned. */ - getEdgeWidth = valid => { + getEdgeWidth(valid) { return valid ? 3 : 1; - }; + } /** * Function: connect @@ -1911,7 +1911,7 @@ class mxConnectionHandler extends mxEventSource { * dropTarget - that represents the cell under the mouse when it was * released. */ - connect = (source, target, evt, dropTarget) => { + connect(source, target, evt, dropTarget) { if ( target != null || this.isCreateTarget(evt) || @@ -2102,7 +2102,7 @@ class mxConnectionHandler extends mxEventSource { this.selectCells(edge, terminalInserted ? target : null); } } - }; + } /** * Function: selectCells @@ -2110,9 +2110,9 @@ class mxConnectionHandler extends mxEventSource { * Selects the given edge after adding a new connection. The target argument * contains the target vertex if one has been inserted. */ - selectCells = (edge, target) => { + selectCells(edge, target) { this.graph.setSelectionCell(edge); - }; + } /** * Function: insertEdge @@ -2121,7 +2121,7 @@ class mxConnectionHandler extends mxEventSource { * implementation does only use if is defined, * otherwise will be used. */ - insertEdge = (parent, id, value, source, target, style) => { + insertEdge(parent, id, value, source, target, style) { if (this.factoryMethod == null) { return this.graph.insertEdge(parent, id, value, source, target, style); } @@ -2129,7 +2129,7 @@ class mxConnectionHandler extends mxEventSource { edge = this.graph.addEdge(edge, parent, source, target); return edge; - }; + } /** * Function: createTargetVertex @@ -2143,7 +2143,7 @@ class mxConnectionHandler extends mxEventSource { * evt - Mousedown event of the connect gesture. * source - that represents the source terminal. */ - createTargetVertex = (evt, source) => { + createTargetVertex(evt, source) { // Uses the first non-relative source let geo = this.graph.getCellGeometry(source); @@ -2187,18 +2187,18 @@ class mxConnectionHandler extends mxEventSource { } return clone; - }; + } /** * Function: getAlignmentTolerance * * Returns the tolerance for aligning new targets to sources. This returns the grid size / 2. */ - getAlignmentTolerance = evt => { + getAlignmentTolerance(evt) { return this.graph.isGridEnabled() ? this.graph.gridSize / 2 : this.graph.tolerance; - }; + } /** * Function: createEdge @@ -2215,7 +2215,7 @@ class mxConnectionHandler extends mxEventSource { * target - that represents the target terminal. * style - Optional style from the preview edge. */ - createEdge = (value, source, target, style) => { + createEdge(value, source, target, style) { let edge = null; // Creates a new edge using the factoryMethod @@ -2234,7 +2234,7 @@ class mxConnectionHandler extends mxEventSource { } return edge; - }; + } /** * Function: destroy @@ -2243,7 +2243,7 @@ class mxConnectionHandler extends mxEventSource { * called on all instances. It is called automatically for the built-in * instance created for each . */ - destroy = () => { + destroy() { this.graph.removeMouseListener(this); if (this.shape != null) { @@ -2277,7 +2277,7 @@ class mxConnectionHandler extends mxEventSource { this.graph.removeListener(this.escapeHandler); this.escapeHandler = null; } - }; + } } export default mxConnectionHandler; diff --git a/src/mxgraph/handler/mxConstraintHandler.js b/src/mxgraph/handler/mxConstraintHandler.js index 629784535..7b161e17e 100644 --- a/src/mxgraph/handler/mxConstraintHandler.js +++ b/src/mxgraph/handler/mxConstraintHandler.js @@ -7,10 +7,10 @@ import mxImage from '../util/mxImage'; import mxClient from '../mxClient'; import mxConstants from '../util/mxConstants'; import mxEvent from '../util/mxEvent'; -import mxUtils from "../util/mxUtils"; -import mxRectangle from "../util/mxRectangle"; -import mxImageShape from "../shape/mxImageShape"; -import mxRectangleShape from "../shape/mxRectangleShape"; +import mxUtils from '../util/mxUtils'; +import mxRectangle from '../util/mxRectangle'; +import mxImageShape from '../shape/mxImageShape'; +import mxRectangleShape from '../shape/mxRectangleShape'; class mxConstraintHandler { /** @@ -87,9 +87,9 @@ class mxConstraintHandler { * Returns true if events are handled. This implementation * returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -101,16 +101,16 @@ class mxConstraintHandler { * * enabled - Boolean that specifies the new enabled state. */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { if (this.focusIcons != null) { for (let i = 0; i < this.focusIcons.length; i += 1) { this.focusIcons[i].destroy(); @@ -129,7 +129,7 @@ class mxConstraintHandler { this.currentPoint = null; this.currentFocus = null; this.focusPoints = null; - }; + } /** * Function: getTolerance @@ -141,18 +141,18 @@ class mxConstraintHandler { * * me - whose tolerance should be returned. */ - getTolerance = me => { + getTolerance(me) { return this.graph.getTolerance(); - }; + } /** * Function: getImageForConstraint * * Returns the tolerance to be used for intersecting connection points. */ - getImageForConstraint = (state, constraint, point) => { + getImageForConstraint(state, constraint, point) { return this.pointImage; - }; + } /** * Function: isEventIgnored @@ -160,25 +160,25 @@ class mxConstraintHandler { * Returns true if the given should be ignored in . This * implementation always returns false. */ - isEventIgnored = (me, source) => { + isEventIgnored(me, source) { return false; - }; + } /** * Function: isStateIgnored * * Returns true if the given state should be ignored. This always returns false. */ - isStateIgnored = (state, source) => { + isStateIgnored(state, source) { return false; - }; + } /** * Function: destroyIcons * * Destroys the if they exist. */ - destroyIcons = () => { + destroyIcons() { if (this.focusIcons != null) { for (let i = 0; i < this.focusIcons.length; i += 1) { this.focusIcons[i].destroy(); @@ -187,19 +187,19 @@ class mxConstraintHandler { this.focusIcons = null; this.focusPoints = null; } - }; + } /** * Function: destroyFocusHighlight * * Destroys the if one exists. */ - destroyFocusHighlight = () => { + destroyFocusHighlight() { if (this.focusHighlight != null) { this.focusHighlight.destroy(); this.focusHighlight = null; } - }; + } /** * Function: isKeepFocusEvent @@ -207,16 +207,16 @@ class mxConstraintHandler { * Returns true if the current focused state should not be changed for the given event. * This returns true if shift and alt are pressed. */ - isKeepFocusEvent = me => { + isKeepFocusEvent(me) { return mxEvent.isShiftDown(me.getEvent()); - }; + } /** * Function: getCellForEvent * * Returns the cell for the given event. */ - getCellForEvent = (me, point) => { + getCellForEvent(me, point) { let cell = me.getCell(); // Gets cell under actual point if different from event location @@ -241,7 +241,7 @@ class mxConstraintHandler { } return this.graph.isCellLocked(cell) ? null : cell; - }; + } /** * Function: update @@ -249,7 +249,7 @@ class mxConstraintHandler { * Updates the state of this handler based on the given . * Source is a boolean indicating if the cell is a source or target. */ - update = (me, source, existingEdge, point) => { + update(me, source, existingEdge, point) { if (this.isEnabled() && !this.isEventIgnored(me)) { // Lazy installation of mouseleave handler if (this.mouseleaveHandler == null && this.graph.container != null) { @@ -332,7 +332,7 @@ class mxConstraintHandler { if (this.focusHighlight == null) { const hl = this.createHighlightShape(); - hl.dialect = mxConstants.DIALECT_SVG + hl.dialect = mxConstants.DIALECT_SVG; hl.pointerEvents = false; hl.init(this.graph.getView().getOverlayPane()); @@ -359,7 +359,7 @@ class mxConstraintHandler { this.currentFocus = null; this.currentPoint = null; } - }; + } /** * Function: redraw @@ -368,7 +368,7 @@ class mxConstraintHandler { * the handler is not enabled then the outline is painted, but the constraints * are ignored. */ - redraw = () => { + redraw() { if ( this.currentFocus != null && this.constraints != null && @@ -399,7 +399,7 @@ class mxConstraintHandler { this.focusPoints[i] = cp; } } - }; + } /** * Function: setFocus @@ -408,7 +408,7 @@ class mxConstraintHandler { * the handler is not enabled then the outline is painted, but the constraints * are ignored. */ - setFocus = (me, state, source) => { + setFocus(me, state, source) { this.constraints = state != null && !this.isStateIgnored(state, source) && @@ -484,7 +484,7 @@ class mxConstraintHandler { this.destroyIcons(); this.destroyFocusHighlight(); } - }; + } /** * Function: createHighlightShape @@ -493,7 +493,7 @@ class mxConstraintHandler { * * Returns true if the given icon intersects the given point. */ - createHighlightShape = () => { + createHighlightShape() { const hl = new mxRectangleShape( null, this.highlightColor, @@ -503,23 +503,23 @@ class mxConstraintHandler { hl.opacity = mxConstants.HIGHLIGHT_OPACITY; return hl; - }; + } /** * Function: intersects * * Returns true if the given icon intersects the given rectangle. */ - intersects = (icon, mouse, source, existingEdge) => { + intersects(icon, mouse, source, existingEdge) { return mxUtils.intersects(icon.bounds, mouse); - }; + } /** * Function: destroy * * Destroy this handler. */ - destroy = () => { + destroy() { this.reset(); if (this.resetHandler != null) { @@ -537,7 +537,7 @@ class mxConstraintHandler { ); this.mouseleaveHandler = null; } - }; + } } export default mxConstraintHandler; diff --git a/src/mxgraph/handler/mxEdgeHandler.js b/src/mxgraph/handler/mxEdgeHandler.js index 9210b1391..4a8c4f8cf 100644 --- a/src/mxgraph/handler/mxEdgeHandler.js +++ b/src/mxgraph/handler/mxEdgeHandler.js @@ -14,7 +14,7 @@ import mxEvent from '../util/mxEvent'; import mxConstraintHandler from './mxConstraintHandler'; import mxRectangle from '../util/mxRectangle'; import mxClient from '../mxClient'; -import mxEdgeStyle from "../view/mxEdgeStyle"; +import mxEdgeStyle from '../view/mxEdgeStyle'; class mxEdgeHandler { /** @@ -208,18 +208,18 @@ class mxEdgeHandler { * Returns true if the parent highlight should be visible. This implementation * always returns true. */ - isParentHighlightVisible = () => { + isParentHighlightVisible() { return !this.graph.isCellSelected( this.graph.model.getParent(this.state.cell) ); - }; + } /** * Function: updateParentHighlight * * Updates the highlight of the parent if is true. */ - updateParentHighlight = () => { + updateParentHighlight() { if (!this.isDestroyed()) { const visible = this.isParentHighlightVisible(); const parent = this.graph.model.getParent(this.state.cell); @@ -271,7 +271,7 @@ class mxEdgeHandler { } } } - }; + } /** * Class: mxEdgeHandler @@ -326,7 +326,7 @@ class mxEdgeHandler { * * Initializes the shapes required for this edge handler. */ - init = () => { + init() { this.graph = this.state.view.graph; this.marker = this.createMarker(); this.constraintHandler = new mxConstraintHandler(this.graph); @@ -377,7 +377,10 @@ class mxEdgeHandler { // Creates bends for the non-routed absolute points // or bends that don't correspond to points - if (this.graph.getSelectionCount() < this.graph.graphHandler.maxCells || this.graph.graphHandler.maxCells <= 0) { + if ( + this.graph.getSelectionCount() < this.graph.graphHandler.maxCells || + this.graph.graphHandler.maxCells <= 0 + ) { this.bends = this.createBends(); if (this.isVirtualBendsEnabled()) { @@ -398,16 +401,16 @@ class mxEdgeHandler { this.updateParentHighlight(); this.redraw(); - }; + } /** * Function: createCustomHandles * * Returns an array of custom handles. This implementation returns null. */ - createCustomHandles = () => { + createCustomHandles() { return null; - }; + } /** * Function: isVirtualBendsEnabled @@ -416,7 +419,7 @@ class mxEdgeHandler { * is true and the current style allows and * renders custom waypoints. */ - isVirtualBendsEnabled = evt => { + isVirtualBendsEnabled(evt) { return ( this.virtualBendsEnabled && (this.state.style[mxConstants.STYLE_EDGE] == null || @@ -425,7 +428,7 @@ class mxEdgeHandler { mxUtils.getValue(this.state.style, mxConstants.STYLE_SHAPE, null) !== 'arrow' ); - }; + } /** * Function: isCellEnabled @@ -433,9 +436,9 @@ class mxEdgeHandler { * Returns true if the given cell allows new connections to be created. This implementation * always returns true. */ - isCellEnabled = cell => { + isCellEnabled(cell) { return true; - }; + } /** * Function: isAddPointEvent @@ -443,9 +446,9 @@ class mxEdgeHandler { * Returns true if the given event is a trigger to add a new point. This * implementation returns true if shift is pressed. */ - isAddPointEvent = evt => { + isAddPointEvent(evt) { return mxEvent.isShiftDown(evt); - }; + } /** * Function: isRemovePointEvent @@ -453,25 +456,25 @@ class mxEdgeHandler { * Returns true if the given event is a trigger to remove a point. This * implementation returns true if shift is pressed. */ - isRemovePointEvent = evt => { + isRemovePointEvent(evt) { return mxEvent.isShiftDown(evt); - }; + } /** * Function: getSelectionPoints * * Returns the list of points that defines the selection stroke. */ - getSelectionPoints = state => { + getSelectionPoints(state) { return state.absolutePoints; - }; + } /** * Function: createParentHighlightShape * * Creates the shape used to draw the selection border. */ - createParentHighlightShape = bounds => { + createParentHighlightShape(bounds) { const shape = new mxRectangleShape( mxRectangle.fromRectangle(bounds), null, @@ -481,14 +484,14 @@ class mxEdgeHandler { shape.isDashed = this.isSelectionDashed(); return shape; - }; + } /** * Function: createSelectionShape * * Creates the shape used to draw the selection border. */ - createSelectionShape = points => { + createSelectionShape(points) { const shape = new this.state.shape.constructor(); shape.outline = true; shape.apply(this.state); @@ -498,34 +501,34 @@ class mxEdgeHandler { shape.isShadow = false; return shape; - }; + } /** * Function: getSelectionColor * * Returns . */ - getSelectionColor = () => { + getSelectionColor() { return mxConstants.EDGE_SELECTION_COLOR; - }; + } /** * Function: getSelectionStrokeWidth * * Returns . */ - getSelectionStrokeWidth = () => { + getSelectionStrokeWidth() { return mxConstants.EDGE_SELECTION_STROKEWIDTH; - }; + } /** * Function: isSelectionDashed * * Returns . */ - isSelectionDashed = () => { + isSelectionDashed() { return mxConstants.EDGE_SELECTION_DASHED; - }; + } /** * Function: isConnectableCell @@ -533,25 +536,25 @@ class mxEdgeHandler { * Returns true if the given cell is connectable. This is a hook to * disable floating connections. This implementation returns true. */ - isConnectableCell = cell => { + isConnectableCell(cell) { return true; - }; + } /** * Function: getCellAt * * Creates and returns the used in . */ - getCellAt = (x, y) => { + getCellAt(x, y) { return !this.outlineConnect ? this.graph.getCellAt(x, y) : null; - }; + } /** * Function: createMarker * * Creates and returns the used in . */ - createMarker = () => { + createMarker() { const self = this; // closure class MyMarker extends mxCellMarker { @@ -628,7 +631,7 @@ class mxEdgeHandler { } return new MyMarker(this.graph); - }; + } /** * Function: validateConnection @@ -642,9 +645,9 @@ class mxEdgeHandler { * source - that represents the source terminal. * target - that represents the target terminal. */ - validateConnection = (source, target) => { + validateConnection(source, target) { return this.graph.getEdgeValidationError(this.state.cell, source, target); - }; + } /** * Function: createBends @@ -652,7 +655,7 @@ class mxEdgeHandler { * Creates and returns the bends used for modifying the edge. This is * typically an array of . */ - createBends = () => { + createBends() { const { cell } = this.state; const bends = []; @@ -691,7 +694,7 @@ class mxEdgeHandler { } return bends; - }; + } /** * Function: createVirtualBends @@ -699,7 +702,7 @@ class mxEdgeHandler { * Creates and returns the bends used for modifying the edge. This is * typically an array of . */ - createVirtualBends = () => { + createVirtualBends() { const { cell } = this.state; const last = this.abspoints[0]; const bends = []; @@ -715,23 +718,23 @@ class mxEdgeHandler { } return bends; - }; + } /** * Function: isHandleEnabled * * Creates the shape used to display the given bend. */ - isHandleEnabled = index => { + isHandleEnabled(index) { return true; - }; + } /** * Function: isHandleVisible * * Returns true if the handle at the given index is visible. */ - isHandleVisible = index => { + isHandleVisible(index) { const source = this.state.getVisibleTerminalState(true); const target = this.state.getVisibleTerminalState(false); const geo = this.graph.getCellGeometry(this.state.cell); @@ -745,7 +748,7 @@ class mxEdgeHandler { index === 0 || index === this.abspoints.length - 1 ); - }; + } /** * Function: createHandleShape @@ -756,7 +759,7 @@ class mxEdgeHandler { * returned if support for HTML labels with not foreign objects is required. * Index if null for virtual handles. */ - createHandleShape = index => { + createHandleShape(index) { if (this.handleImage != null) { const shape = new mxImageShape( new mxRectangle(0, 0, this.handleImage.width, this.handleImage.height), @@ -779,14 +782,14 @@ class mxEdgeHandler { mxConstants.HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR ); - }; + } /** * Function: createLabelHandleShape * * Creates the shape used to display the the label handle. */ - createLabelHandleShape = () => { + createLabelHandleShape() { if (this.labelHandleImage != null) { const shape = new mxImageShape( new mxRectangle( @@ -809,7 +812,7 @@ class mxEdgeHandler { mxConstants.LABEL_HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR ); - }; + } /** * Function: initBend @@ -820,7 +823,7 @@ class mxEdgeHandler { * * bend - that represents the bend to be initialized. */ - initBend = (bend, dblClick) => { + initBend(bend, dblClick) { if (this.preferHtml) { bend.dialect = mxConstants.DIALECT_STRICTHTML; bend.init(this.graph.container); @@ -845,14 +848,14 @@ class mxEdgeHandler { if (mxClient.IS_TOUCH) { bend.node.setAttribute('pointer-events', 'none'); } - }; + } /** * Function: getHandleForEvent * * Returns the index of the handle for the given event. */ - getHandleForEvent = me => { + getHandleForEvent(me) { let result = null; if (this.state != null) { @@ -924,7 +927,7 @@ class mxEdgeHandler { } return result; - }; + } /** * Function: isAddVirtualBendEvent @@ -932,9 +935,9 @@ class mxEdgeHandler { * Returns true if the given event allows virtual bends to be added. This * implementation returns true. */ - isAddVirtualBendEvent = me => { + isAddVirtualBendEvent(me) { return true; - }; + } /** * Function: isCustomHandleEvent @@ -942,9 +945,9 @@ class mxEdgeHandler { * Returns true if the given event allows custom handles to be changed. This * implementation returns true. */ - isCustomHandleEvent = me => { + isCustomHandleEvent(me) { return true; - }; + } /** * Function: mouseDown @@ -955,7 +958,7 @@ class mxEdgeHandler { * control point. The source and target points are used for reconnecting * the edge. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { const handle = this.getHandleForEvent(me); if (this.bends != null && this.bends[handle] != null) { @@ -989,14 +992,14 @@ class mxEdgeHandler { me.consume(); } - }; + } /** * Function: start * * Starts the handling of the mouse gesture. */ - start = (x, y, index) => { + start(x, y, index) { this.startX = x; this.startY = y; @@ -1034,16 +1037,16 @@ class mxEdgeHandler { } } } - }; + } /** * Function: clonePreviewState * * Returns a clone of the current preview state for the given point and terminal. */ - clonePreviewState = (point, terminal) => { + clonePreviewState(point, terminal) { return this.state.clone(); - }; + } /** * Function: getSnapToTerminalTolerance @@ -1051,48 +1054,48 @@ class mxEdgeHandler { * Returns the tolerance for the guides. Default value is * gridSize * scale / 2. */ - getSnapToTerminalTolerance = () => { + getSnapToTerminalTolerance() { return (this.graph.gridSize * this.graph.view.scale) / 2; - }; + } /** * Function: updateHint * * Hook for subclassers do show details while the handler is active. */ - updateHint = (me, point) => {}; + updateHint(me, point) {} /** * Function: removeHint * * Hooks for subclassers to hide details when the handler gets inactive. */ - removeHint = () => {}; + removeHint() {} /** * Function: roundLength * * Hook for rounding the unscaled width or height. This uses Math.round. */ - roundLength = length => { + roundLength(length) { return Math.round(length); - }; + } /** * Function: isSnapToTerminalsEvent * * Returns true if is true and if alt is not pressed. */ - isSnapToTerminalsEvent = me => { + isSnapToTerminalsEvent(me) { return this.snapToTerminals && !mxEvent.isAltDown(me.getEvent()); - }; + } /** * Function: getPointForEvent * * Returns the point for the given event. */ - getPointForEvent = me => { + getPointForEvent(me) { const view = this.graph.getView(); const { scale } = view; const point = new mxPoint( @@ -1105,7 +1108,6 @@ class mxEdgeHandler { let overrideY = false; if (tt > 0 && this.isSnapToTerminalsEvent(me)) { - const snapToPoint = pt => { if (pt != null) { const { x } = pt; @@ -1157,14 +1159,14 @@ class mxEdgeHandler { } return point; - }; + } /** * Function: getPreviewTerminalState * * Updates the given preview state taking into account the state of the constraint handler. */ - getPreviewTerminalState = me => { + getPreviewTerminalState(me) { this.constraintHandler.update( me, this.isSource, @@ -1243,7 +1245,7 @@ class mxEdgeHandler { this.marker.reset(); return null; - }; + } /** * Function: getPreviewPoints @@ -1255,7 +1257,7 @@ class mxEdgeHandler { * pt - that contains the current pointer position. * me - Optional that contains the current event. */ - getPreviewPoints = (pt, me) => { + getPreviewPoints(pt, me) { const geometry = this.graph.getCellGeometry(this.state.cell); let points = geometry.points != null ? geometry.points.slice() : null; const point = new mxPoint(pt.x, pt.y); @@ -1370,7 +1372,7 @@ class mxEdgeHandler { } return result != null ? result : points; - }; + } /** * Function: isOutlineConnectEvent @@ -1378,7 +1380,7 @@ class mxEdgeHandler { * Returns true if is true and the source of the event is the outline shape * or shift is pressed. */ - isOutlineConnectEvent = me => { + isOutlineConnectEvent(me) { const offset = mxUtils.getOffset(this.graph.container); const evt = me.getEvent(); @@ -1404,14 +1406,14 @@ class mxEdgeHandler { me.getState() == null && this.marker.highlight.isHighlightAt(gridX, gridY))) ); - }; + } /** * Function: updatePreviewState * * Updates the given preview state taking into account the state of the constraint handler. */ - updatePreviewState = (edge, point, terminalState, me, outline) => { + updatePreviewState(edge, point, terminalState, me, outline) { // Computes the points for the edge style and terminals const sourceState = this.isSource ? terminalState @@ -1534,14 +1536,14 @@ class mxEdgeHandler { edge.view.updatePoints(edge, this.points, sourceState, targetState); edge.view.updateFloatingTerminalPoints(edge, sourceState, targetState); - }; + } /** * Function: mouseMove * * Handles the event by updating the preview. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (this.index != null && this.marker != null) { this.currentPoint = this.getPointForEvent(me); this.error = null; @@ -1651,7 +1653,7 @@ class mxEdgeHandler { mxEvent.consume(me.getEvent()); me.consume(); } - }; + } /** * Function: mouseUp @@ -1659,7 +1661,7 @@ class mxEdgeHandler { * Handles the event to applying the previewed changes on the edge by * using , or . */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { // Workaround for wrong event source in Webkit if (this.index != null && this.marker != null) { if (this.shape != null && this.shape.node != null) { @@ -1802,14 +1804,14 @@ class mxEdgeHandler { me.consume(); } - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { if (this.active) { this.refresh(); } @@ -1849,18 +1851,18 @@ class mxEdgeHandler { this.setPreviewColor(mxConstants.EDGE_SELECTION_COLOR); this.removeHint(); this.redraw(); - }; + } /** * Function: setPreviewColor * * Sets the color of the preview to the given value. */ - setPreviewColor = color => { + setPreviewColor(color) { if (this.shape != null) { this.shape.stroke = color; } - }; + } /** * Function: convertPoint @@ -1874,7 +1876,7 @@ class mxEdgeHandler { * point - to be converted. * gridEnabled - Boolean that specifies if the grid should be applied. */ - convertPoint = (point, gridEnabled) => { + convertPoint(point, gridEnabled) { const scale = this.graph.getView().getScale(); const tr = this.graph.getView().getTranslate(); @@ -1896,7 +1898,7 @@ class mxEdgeHandler { } return point; - }; + } /** * Function: moveLabel @@ -1909,7 +1911,7 @@ class mxEdgeHandler { * x - Integer that specifies the x-coordinate of the new location. * y - Integer that specifies the y-coordinate of the new location. */ - moveLabel = (edgeState, x, y) => { + moveLabel(edgeState, x, y) { const model = this.graph.getModel(); let geometry = model.getGeometry(edgeState.cell); @@ -1951,7 +1953,7 @@ class mxEdgeHandler { model.setGeometry(edgeState.cell, geometry); } - }; + } /** * Function: connect @@ -1969,7 +1971,7 @@ class mxEdgeHandler { * the old edge. * me - that contains the mouse up event. */ - connect = (edge, terminal, isSource, isClone, me) => { + connect(edge, terminal, isSource, isClone, me) { const model = this.graph.getModel(); const parent = model.getParent(edge); @@ -1987,14 +1989,14 @@ class mxEdgeHandler { } return edge; - }; + } /** * Function: changeTerminalPoint * * Changes the terminal point of the given edge. */ - changeTerminalPoint = (edge, point, isSource, clone) => { + changeTerminalPoint(edge, point, isSource, clone) { const model = this.graph.getModel(); model.beginUpdate(); @@ -2025,14 +2027,14 @@ class mxEdgeHandler { } return edge; - }; + } /** * Function: changePoints * * Changes the control points of the given edge in the graph model. */ - changePoints = (edge, points, clone) => { + changePoints(edge, points, clone) { const model = this.graph.getModel(); model.beginUpdate(); try { @@ -2059,14 +2061,14 @@ class mxEdgeHandler { } return edge; - }; + } /** * Function: addPoint * * Adds a control point for the given state and event. */ - addPoint = (state, evt) => { + addPoint(state, evt) { const pt = mxUtils.convertPoint( this.graph.container, mxEvent.getClientX(evt), @@ -2076,14 +2078,14 @@ class mxEdgeHandler { this.convertPoint(pt, gridEnabled); this.addPointAt(state, pt.x, pt.y); mxEvent.consume(evt); - }; + } /** * Function: addPointAt * * Adds a control point at the given point. */ - addPointAt = (state, x, y) => { + addPointAt(state, x, y) { let geo = this.graph.getCellGeometry(state.cell); const pt = new mxPoint(x, y); @@ -2116,14 +2118,14 @@ class mxEdgeHandler { this.refresh(); this.redraw(); } - }; + } /** * Function: removePoint * * Removes the control point at the given index from the given state. */ - removePoint = (state, index) => { + removePoint(state, index) { if (index > 0 && index < this.abspoints.length - 1) { let geo = this.graph.getCellGeometry(this.state.cell); @@ -2135,14 +2137,14 @@ class mxEdgeHandler { this.redraw(); } } - }; + } /** * Function: getHandleFillColor * * Returns the fillcolor for the handle at the given index. */ - getHandleFillColor = index => { + getHandleFillColor(index) { const isSource = index === 0; const { cell } = this.state; const terminal = this.graph.getModel().getTerminal(cell, isSource); @@ -2162,14 +2164,14 @@ class mxEdgeHandler { } return color; - }; + } /** * Function: redraw * * Redraws the preview, and the bends- and label control points. */ - redraw = ignoreHandles => { + redraw(ignoreHandles) { if (this.state != null) { this.abspoints = this.state.absolutePoints.slice(); const g = this.graph.getModel().getGeometry(this.state.cell); @@ -2198,14 +2200,14 @@ class mxEdgeHandler { this.redrawHandles(); } } - }; + } /** * Function: redrawHandles * * Redraws the handles. */ - redrawHandles = () => { + redrawHandles() { const { cell } = this.state; // Updates the handle for the label position @@ -2319,25 +2321,25 @@ class mxEdgeHandler { : 'hidden'; } } - }; + } /** * Function: isCustomHandleVisible * * Returns true if the given custom handle is visible. */ - isCustomHandleVisible = handle => { + isCustomHandleVisible(handle) { return ( !this.graph.isEditing() && this.state.view.graph.getSelectionCount() === 1 ); - }; + } /** * Function: hideHandles * * Shortcut to . */ - setHandlesVisible = visible => { + setHandlesVisible(visible) { if (this.bends != null) { for (let i = 0; i < this.bends.length; i += 1) { this.bends[i].node.style.display = visible ? '' : 'none'; @@ -2359,7 +2361,7 @@ class mxEdgeHandler { this.customHandles[i].setVisible(visible); } } - }; + } /** * Function: redrawInnerBends @@ -2371,7 +2373,7 @@ class mxEdgeHandler { * p0 - that represents the location of the first point. * pe - that represents the location of the last point. */ - redrawInnerBends = (p0, pe) => { + redrawInnerBends(p0, pe) { for (let i = 1; i < this.bends.length - 1; i += 1) { if (this.bends[i] != null) { if (this.abspoints[i] != null) { @@ -2411,7 +2413,7 @@ class mxEdgeHandler { } } } - }; + } /** * Function: checkLabelHandle @@ -2419,7 +2421,7 @@ class mxEdgeHandler { * Checks if the label handle intersects the given bounds and moves it if it * intersects. */ - checkLabelHandle = b => { + checkLabelHandle(b) { if (this.labelShape != null) { const b2 = this.labelShape.bounds; @@ -2431,14 +2433,14 @@ class mxEdgeHandler { } } } - }; + } /** * Function: drawPreview * * Redraws the preview. */ - drawPreview = () => { + drawPreview() { try { if (this.isLabel) { const b = this.labelShape.bounds; @@ -2474,14 +2476,14 @@ class mxEdgeHandler { } catch (e) { // ignore } - }; + } /** * Function: refresh * * Refreshes the bends of this handler. */ - refresh = () => { + refresh() { if (this.state != null) { this.abspoints = this.getSelectionPoints(this.state); this.points = []; @@ -2510,23 +2512,23 @@ class mxEdgeHandler { this.labelShape.node.parentNode.appendChild(this.labelShape.node); } } - }; + } /** * Function: isDestroyed * * Returns true if was called. */ - isDestroyed = () => { + isDestroyed() { return this.shape == null; - }; + } /** * Function: destroyBends * * Destroys all elements in . */ - destroyBends = bends => { + destroyBends(bends) { if (bends != null) { for (let i = 0; i < bends.length; i += 1) { if (bends[i] != null) { @@ -2534,7 +2536,7 @@ class mxEdgeHandler { } } } - }; + } /** * Function: destroy @@ -2543,7 +2545,7 @@ class mxEdgeHandler { * normally not need to be called as handlers are destroyed automatically * when the corresponding cell is deselected. */ - destroy = () => { + destroy() { if (this.escapeHandler != null) { this.state.view.graph.removeListener(this.escapeHandler); this.escapeHandler = null; @@ -2591,7 +2593,7 @@ class mxEdgeHandler { this.bends = null; this.removeHint(); - }; + } } export default mxEdgeHandler; diff --git a/src/mxgraph/handler/mxEdgeSegmentHandler.js b/src/mxgraph/handler/mxEdgeSegmentHandler.js index 94a21b9da..2ccf5ff87 100644 --- a/src/mxgraph/handler/mxEdgeSegmentHandler.js +++ b/src/mxgraph/handler/mxEdgeSegmentHandler.js @@ -20,7 +20,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { * * Returns the current absolute points. */ - getCurrentPoints = () => { + getCurrentPoints() { let pts = this.state.absolutePoints; if (pts != null) { @@ -48,14 +48,14 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } return pts; - }; + } /** * Function: getPreviewPoints * * Updates the given preview state taking into account the state of the constraint handler. */ - getPreviewPoints = point => { + getPreviewPoints(point) { if (this.isSource || this.isTarget) { return super.getPreviewPoints(point); } @@ -105,14 +105,14 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } return result; - }; + } /** * Function: updatePreviewState * * Overridden to perform optimization of the edge style result. */ - updatePreviewState = (edge, point, terminalState, me) => { + updatePreviewState(edge, point, terminalState, me) { super.updatePreviewState(edge, point, terminalState, me); // Checks and corrects preview by running edge style again @@ -203,12 +203,12 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { edge.view.updatePoints(edge, this.points, source, target); edge.view.updateFloatingTerminalPoints(edge, source, target); } - }; + } /** * Overriden to merge edge segments. */ - connect = (edge, terminal, isSource, isClone, me) => { + connect(edge, terminal, isSource, isClone, me) { const model = this.graph.getModel(); let geo = model.getGeometry(edge); let result = null; @@ -256,23 +256,23 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } return edge; - }; + } /** * Function: getTooltipForNode * * Returns no tooltips. */ - getTooltipForNode = node => { + getTooltipForNode(node) { return null; - }; + } /** * Function: start * * Starts the handling of the mouse gesture. */ - start = (x, y, index) => { + start(x, y, index) { super.start(x, y, index); if ( @@ -283,14 +283,14 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { ) { mxUtils.setOpacity(this.bends[index].node, 100); } - }; + } /** * Function: createBends * * Adds custom bends for the center of each segment. */ - createBends = () => { + createBends() { const bends = []; // Source @@ -329,24 +329,24 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { bends.push(bend); return bends; - }; + } /** * Function: redraw * * Overridden to invoke before the redraw. */ - redraw = () => { + redraw() { this.refresh(); super.redraw(); - }; + } /** * Function: redrawInnerBends * * Updates the position of the custom bends. */ - redrawInnerBends = (p0, pe) => { + redrawInnerBends(p0, pe) { if (this.graph.isCellBendable(this.state.cell)) { const pts = this.getCurrentPoints(); @@ -401,7 +401,7 @@ class mxEdgeSegmentHandler extends mxElbowEdgeHandler { } } } - }; + } } export default mxEdgeSegmentHandler; diff --git a/src/mxgraph/handler/mxElbowEdgeHandler.js b/src/mxgraph/handler/mxElbowEdgeHandler.js index fac85d27c..86a784d1a 100644 --- a/src/mxgraph/handler/mxElbowEdgeHandler.js +++ b/src/mxgraph/handler/mxElbowEdgeHandler.js @@ -4,14 +4,14 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxEdgeHandler from './mxEdgeHandler'; -import mxConstants from "../util/mxConstants"; -import mxEvent from "../util/mxEvent"; -import mxPoint from "../util/mxPoint"; -import mxEdgeStyle from "../view/mxEdgeStyle"; -import mxResources from "../util/mxResources"; -import mxRectangle from "../util/mxRectangle"; -import mxUtils from "../util/mxUtils"; -import mxClient from "../mxClient"; +import mxConstants from '../util/mxConstants'; +import mxEvent from '../util/mxEvent'; +import mxPoint from '../util/mxPoint'; +import mxEdgeStyle from '../view/mxEdgeStyle'; +import mxResources from '../util/mxResources'; +import mxRectangle from '../util/mxRectangle'; +import mxUtils from '../util/mxUtils'; +import mxClient from '../mxClient'; class mxElbowEdgeHandler extends mxEdgeHandler { /** @@ -56,7 +56,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { * * Overrides to create custom bends. */ - createBends = () => { + createBends() { const bends = []; // Source @@ -84,7 +84,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { bends.push(bend); return bends; - }; + } /** * Function: createVirtualBend @@ -92,7 +92,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { * Creates a virtual bend that supports double clicking and calls * . */ - createVirtualBend = dblClickHandler => { + createVirtualBend(dblClickHandler) { const bend = this.createHandleShape(); this.initBend(bend, dblClickHandler); @@ -103,14 +103,14 @@ class mxElbowEdgeHandler extends mxEdgeHandler { } return bend; - }; + } /** * Function: getCursorForBend * * Returns the cursor to be used for the bend. */ - getCursorForBend = () => { + getCursorForBend() { return this.state.style[mxConstants.STYLE_EDGE] === mxEdgeStyle.TopToBottom || this.state.style[mxConstants.STYLE_EDGE] === @@ -123,14 +123,14 @@ class mxElbowEdgeHandler extends mxEdgeHandler { mxConstants.ELBOW_VERTICAL) ? 'row-resize' : 'col-resize'; - }; + } /** * Function: getTooltipForNode * * Returns the tooltip for the given node. */ - getTooltipForNode = node => { + getTooltipForNode(node) { let tip = null; if ( @@ -143,7 +143,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { } return tip; - }; + } /** * Function: convertPoint @@ -156,7 +156,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { * point - to be converted. * gridEnabled - Boolean that specifies if the grid should be applied. */ - convertPoint = (point, gridEnabled) => { + convertPoint(point, gridEnabled) { const scale = this.graph.getView().getScale(); const tr = this.graph.getView().getTranslate(); const { origin } = this.state; @@ -170,7 +170,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { point.y = Math.round(point.y / scale - tr.y - origin.y); return point; - }; + } /** * Function: redrawInnerBends @@ -182,7 +182,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { * p0 - that represents the location of the first point. * pe - that represents the location of the last point. */ - redrawInnerBends = (p0, pe) => { + redrawInnerBends(p0, pe) { const g = this.graph.getModel().getGeometry(this.state.cell); const pts = this.state.absolutePoints; let pt = null; @@ -241,7 +241,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler { if (this.manageLabelHandle) { this.checkLabelHandle(this.bends[1].bounds); } - }; + } } export default mxElbowEdgeHandler; diff --git a/src/mxgraph/handler/mxGraphHandler.js b/src/mxgraph/handler/mxGraphHandler.js index 25a9d7502..89cdd1361 100644 --- a/src/mxgraph/handler/mxGraphHandler.js +++ b/src/mxgraph/handler/mxGraphHandler.js @@ -327,27 +327,27 @@ class mxGraphHandler { * * Returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled * * Sets . */ - setEnabled = value => { + setEnabled(value) { this.enabled = value; - }; + } /** * Function: isCloneEnabled * * Returns . */ - isCloneEnabled = () => { + isCloneEnabled() { return this.cloneEnabled; - }; + } /** * Function: setCloneEnabled @@ -358,63 +358,63 @@ class mxGraphHandler { * * value - Boolean that specifies the new clone enabled state. */ - setCloneEnabled = value => { + setCloneEnabled(value) { this.cloneEnabled = value; - }; + } /** * Function: isMoveEnabled * * Returns . */ - isMoveEnabled = () => { + isMoveEnabled() { return this.moveEnabled; - }; + } /** * Function: setMoveEnabled * * Sets . */ - setMoveEnabled = value => { + setMoveEnabled(value) { this.moveEnabled = value; - }; + } /** * Function: isSelectEnabled * * Returns . */ - isSelectEnabled = () => { + isSelectEnabled() { return this.selectEnabled; - }; + } /** * Function: setSelectEnabled * * Sets . */ - setSelectEnabled = value => { + setSelectEnabled(value) { this.selectEnabled = value; - }; + } /** * Function: isRemoveCellsFromParent * * Returns . */ - isRemoveCellsFromParent = () => { + isRemoveCellsFromParent() { return this.removeCellsFromParent; - }; + } /** * Function: setRemoveCellsFromParent * * Sets . */ - setRemoveCellsFromParent = value => { + setRemoveCellsFromParent(value) { this.removeCellsFromParent = value; - }; + } /** * Function: isPropagateSelectionCell @@ -422,7 +422,7 @@ class mxGraphHandler { * Returns true if the given cell and parent should propagate * selection state to the parent. */ - isPropagateSelectionCell = (cell, immediate, me) => { + isPropagateSelectionCell(cell, immediate, me) { const parent = this.graph.model.getParent(cell); if (immediate) { @@ -444,7 +444,7 @@ class mxGraphHandler { (this.graph.isToggleEvent(me.getEvent()) || !this.graph.isCellSelected(parent)) ); - }; + } /** * Function: getInitialCellForEvent @@ -452,7 +452,7 @@ class mxGraphHandler { * Hook to return initial cell for the given event. This returns * the topmost cell that is not a swimlane or is selected. */ - getInitialCellForEvent = me => { + getInitialCellForEvent(me) { let state = me.getState(); if ( @@ -478,14 +478,14 @@ class mxGraphHandler { } return state != null ? state.cell : null; - }; + } /** * Function: isDelayedSelection * * Returns true if the cell or one of its ancestors is selected. */ - isDelayedSelection = (cell, me) => { + isDelayedSelection(cell, me) { if ( !this.graph.isToggleEvent(me.getEvent()) || !mxEvent.isAltDown(me.getEvent()) @@ -503,14 +503,14 @@ class mxGraphHandler { this.graph.isToggleEvent(me.getEvent()) && !mxEvent.isAltDown(me.getEvent()) ); - }; + } /** * Function: selectDelayed * * Implements the delayed selection for the given mouse event. */ - selectDelayed = me => { + selectDelayed(me) { if (!this.graph.popupMenuHandler.isPopupTrigger(me)) { let cell = me.getCell(); @@ -520,14 +520,14 @@ class mxGraphHandler { this.selectCellForEvent(cell, me); } - }; + } /** * Function: selectCellForEvent * * Selects the given cell for the given . */ - selectCellForEvent = (cell, me) => { + selectCellForEvent(cell, me) { const state = this.graph.view.getState(cell); if (state != null) { @@ -556,7 +556,7 @@ class mxGraphHandler { } return cell; - }; + } /** * Function: consumeMouseEvent @@ -577,9 +577,9 @@ class mxGraphHandler { * } * */ - consumeMouseEvent = (evtName, me) => { + consumeMouseEvent(evtName, me) { me.consume(); - }; + } /** * Function: mouseDown @@ -588,7 +588,7 @@ class mxGraphHandler { * it. By consuming the event all subsequent events of the gesture are * redirected to this handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { if ( !me.isConsumed() && this.isEnabled() && @@ -628,14 +628,14 @@ class mxGraphHandler { this.consumeMouseEvent(mxEvent.MOUSE_DOWN, me); } } - }; + } /** * Function: getGuideStates * * Creates an array of cell states which should be used as guides. */ - getGuideStates = () => { + getGuideStates() { const parent = this.graph.getDefaultParent(); const model = this.graph.getModel(); @@ -651,7 +651,7 @@ class mxGraphHandler { return this.graph.view.getCellStates( model.filterDescendants(filter, parent) ); - }; + } /** * Function: getCells @@ -665,12 +665,12 @@ class mxGraphHandler { * * initialCell - that triggered this handler. */ - getCells = initialCell => { + getCells(initialCell) { if (!this.delayedSelection && this.graph.isCellMovable(initialCell)) { return [initialCell]; } return this.graph.getMovableCells(this.graph.getSelectionCells()); - }; + } /** * Function: getPreviewBounds @@ -678,7 +678,7 @@ class mxGraphHandler { * Returns the used as the preview bounds for * moving the given cells. */ - getPreviewBounds = cells => { + getPreviewBounds(cells) { const bounds = this.getBoundingBox(cells); if (bounds != null) { @@ -709,7 +709,7 @@ class mxGraphHandler { } return bounds; - }; + } /** * Function: getBoundingBox @@ -724,7 +724,7 @@ class mxGraphHandler { * * cells - Array of whose bounding box should be returned. */ - getBoundingBox = cells => { + getBoundingBox(cells) { let result = null; if (cells != null && cells.length > 0) { @@ -756,14 +756,14 @@ class mxGraphHandler { } return result; - }; + } /** * Function: createPreviewShape * * Creates the shape used to draw the preview for the given bounds. */ - createPreviewShape = bounds => { + createPreviewShape(bounds) { const shape = new mxRectangleShape(bounds, null, this.previewColor); shape.isDashed = true; @@ -787,14 +787,14 @@ class mxGraphHandler { } return shape; - }; + } /** * Function: start * * Starts the handling of the mouse gesture. */ - start = (cell, x, y, cells) => { + start(cell, x, y, cells) { this.cell = cell; this.first = mxUtils.convertPoint(this.graph.container, x, y); this.cells = cells != null ? cells : this.getCells(this.cell); @@ -843,14 +843,14 @@ class mxGraphHandler { ); }; } - }; + } /** * Function: addStates * * Adds the states for the given cell recursively to the given dictionary. */ - addStates = (cell, dict) => { + addStates(cell, dict) { const state = this.graph.view.getState(cell); let count = 0; @@ -866,16 +866,16 @@ class mxGraphHandler { } return count; - }; + } /** * Function: isCellMoving * * Returns true if the given cell is currently being moved. */ - isCellMoving = cell => { + isCellMoving(cell) { return this.allCells.get(cell) != null; - }; + } /** * Function: useGuidesForEvent @@ -883,26 +883,26 @@ class mxGraphHandler { * Returns true if the guides should be used for the given . * This implementation returns . */ - useGuidesForEvent = me => { + useGuidesForEvent(me) { return this.guide != null ? this.guide.isEnabledForEvent(me.getEvent()) && !this.graph.isConstrainedEvent(me.getEvent()) : true; - }; + } /** * Function: snap * * Snaps the given vector to the grid and returns the given mxPoint instance. */ - snap = vector => { + snap(vector) { const scale = this.scaleGrid ? this.graph.view.scale : 1; vector.x = this.graph.snap(vector.x / scale) * scale; vector.y = this.graph.snap(vector.y / scale) * scale; return vector; - }; + } /** * Function: getDelta @@ -910,7 +910,7 @@ class mxGraphHandler { * Returns an that represents the vector for moving the cells * for the given . */ - getDelta = me => { + getDelta(me) { const point = mxUtils.convertPoint( this.graph.container, me.getX(), @@ -921,21 +921,21 @@ class mxGraphHandler { point.x - this.first.x - this.graph.panDx, point.y - this.first.y - this.graph.panDy ); - }; + } /** * Function: updateHint * * Hook for subclassers do show details while the handler is active. */ - updateHint = me => {}; + updateHint(me) {} /** * Function: removeHint * * Hooks for subclassers to hide details when the handler gets inactive. */ - removeHint = () => {}; + removeHint() {} /** * Function: roundLength @@ -944,25 +944,25 @@ class mxGraphHandler { * numbers coming in should be rounded if no half steps are allowed (ie for non * aligned standard moving where pixel steps should be preferred). */ - roundLength = length => { + roundLength(length) { return Math.round(length * 100) / 100; - }; + } /** * Function: isValidDropTarget * * Returns true if the given cell is a valid drop target. */ - isValidDropTarget = (target, me) => { + isValidDropTarget(target, me) { return this.graph.model.getParent(this.cell) !== target; - }; + } /** * Function: checkPreview * * Updates the preview if cloning state has changed. */ - checkPreview = () => { + checkPreview() { if (this.livePreviewActive && this.cloning) { this.resetLivePreview(); this.livePreviewActive = false; @@ -978,7 +978,7 @@ class mxGraphHandler { } else if (!this.livePreviewUsed && this.shape == null) { this.shape = this.createPreviewShape(this.bounds); } - }; + } /** * Function: mouseMove @@ -986,7 +986,7 @@ class mxGraphHandler { * Handles the event by highlighting possible drop targets and updating the * preview. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { const { graph } = this; if ( @@ -1145,14 +1145,14 @@ class mxGraphHandler { me.sourceState.setCursor(cursor); } } - }; + } /** * Function: updatePreview * * Updates the bounds of the preview shape. */ - updatePreview = remote => { + updatePreview(remote) { if (this.livePreviewUsed && !remote) { if (this.cells != null) { this.setHandlesVisibleForCells( @@ -1164,14 +1164,14 @@ class mxGraphHandler { } else { this.updatePreviewShape(); } - }; + } /** * Function: updatePreviewShape * * Updates the bounds of the preview shape. */ - updatePreviewShape = () => { + updatePreviewShape() { if (this.shape != null && this.pBounds != null) { this.shape.bounds = new mxRectangle( Math.round(this.pBounds.x + this.currentDx), @@ -1181,14 +1181,14 @@ class mxGraphHandler { ); this.shape.redraw(); } - }; + } /** * Function: updateLivePreview * * Updates the bounds of the preview shape. */ - updateLivePreview = (dx, dy) => { + updateLivePreview(dx, dy) { if (!this.suspended) { const states = []; @@ -1352,14 +1352,14 @@ class mxGraphHandler { this.resetPreviewStates(states); } } - }; + } /** * Function: redrawHandles * * Redraws the preview shape for the given states array. */ - redrawHandles = states => { + redrawHandles(states) { for (let i = 0; i < states.length; i += 1) { const handler = this.graph.selectionCellsHandler.getHandler( states[i][0].cell @@ -1369,25 +1369,25 @@ class mxGraphHandler { handler.redraw(true); } } - }; + } /** * Function: resetPreviewStates * * Resets the given preview states array. */ - resetPreviewStates = states => { + resetPreviewStates(states) { for (let i = 0; i < states.length; i += 1) { states[i][0].setState(states[i][1]); } - }; + } /** * Function: suspend * * Suspends the livew preview. */ - suspend = () => { + suspend() { if (!this.suspended) { if (this.livePreviewUsed) { this.updateLivePreview(0, 0); @@ -1403,14 +1403,14 @@ class mxGraphHandler { this.suspended = true; } - }; + } /** * Function: resume * * Suspends the livew preview. */ - resume = () => { + resume() { if (this.suspended) { this.suspended = null; @@ -1426,14 +1426,14 @@ class mxGraphHandler { this.guide.setVisible(true); } } - }; + } /** * Function: resetLivePreview * * Resets the livew preview. */ - resetLivePreview = () => { + resetLivePreview() { if (this.allCells != null) { this.allCells.visit((key, state) => { // Restores event handling @@ -1473,7 +1473,7 @@ class mxGraphHandler { // Repaints all invalid states this.graph.view.validate(); } - }; + } /** * Function: setHandlesVisibleForCells @@ -1486,7 +1486,7 @@ class mxGraphHandler { * visible - Boolean that specifies if the handles should be visible. * force - Forces an update of the handler regardless of the last used value. */ - setHandlesVisibleForCells = (cells, visible, force) => { + setHandlesVisibleForCells(cells, visible, force) { if (force || this.handlesVisible !== visible) { this.handlesVisible = visible; @@ -1502,7 +1502,7 @@ class mxGraphHandler { } } } - }; + } /** * Function: setHighlightColor @@ -1513,18 +1513,18 @@ class mxGraphHandler { * * color - String that represents the new highlight color. */ - setHighlightColor = color => { + setHighlightColor(color) { if (this.highlight != null) { this.highlight.setHighlightColor(color); } - }; + } /** * Function: mouseUp * * Handles the event by applying the changes to the selection cells. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if (!me.isConsumed()) { if (this.livePreviewUsed) { this.resetLivePreview(); @@ -1598,14 +1598,14 @@ class mxGraphHandler { } this.reset(); - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { if (this.livePreviewUsed) { this.resetLivePreview(); this.setHandlesVisibleForCells( @@ -1633,7 +1633,7 @@ class mxGraphHandler { this.first = null; this.cells = null; this.cell = null; - }; + } /** * Function: shouldRemoveCellsFromParent @@ -1641,7 +1641,7 @@ class mxGraphHandler { * Returns true if the given cells should be removed from the parent for the specified * mousereleased event. */ - shouldRemoveCellsFromParent = (parent, cells, evt) => { + shouldRemoveCellsFromParent(parent, cells, evt) { if (this.graph.getModel().isVertex(parent)) { const pState = this.graph.getView().getState(parent); @@ -1667,14 +1667,14 @@ class mxGraphHandler { } return false; - }; + } /** * Function: moveCells * * Moves the given cells by the specified amount. */ - moveCells = (cells, dx, dy, clone, target, evt) => { + moveCells(cells, dx, dy, clone, target, evt) { if (clone) { cells = this.graph.getCloneableCells(cells); } @@ -1745,14 +1745,14 @@ class mxGraphHandler { if (this.isSelectEnabled() && this.scrollOnMove) { this.graph.scrollCellToVisible(cells[0]); } - }; + } /** * Function: shouldRemoveParent * * Returns true if the given parent should be removed after removal of child cells. */ - shouldRemoveParent = parent => { + shouldRemoveParent(parent) { const state = this.graph.view.getState(parent); return ( @@ -1763,14 +1763,14 @@ class mxGraphHandler { this.graph.model.getChildCount(state.cell) === 0 && this.graph.isTransparentState(state) ); - }; + } /** * Function: destroyShapes * * Destroy the preview and highlight shapes. */ - destroyShapes = () => { + destroyShapes() { // Destroys the preview dashed rectangle if (this.shape != null) { this.shape.destroy(); @@ -1787,14 +1787,14 @@ class mxGraphHandler { this.highlight.destroy(); this.highlight = null; } - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { this.graph.removeMouseListener(this); this.graph.removeListener(this.panHandler); @@ -1814,7 +1814,7 @@ class mxGraphHandler { this.destroyShapes(); this.removeHint(); - }; + } } export default mxGraphHandler; diff --git a/src/mxgraph/handler/mxHandle.js b/src/mxgraph/handler/mxHandle.js index 330d0b7fc..e984f54b9 100644 --- a/src/mxgraph/handler/mxHandle.js +++ b/src/mxgraph/handler/mxHandle.js @@ -4,13 +4,13 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxUtils from "../util/mxUtils"; -import mxPoint from "../util/mxPoint"; -import mxImageShape from "../shape/mxImageShape"; -import mxRectangle from "../util/mxRectangle"; -import mxRectangleShape from "../shape/mxRectangleShape"; -import mxConstants from "../util/mxConstants"; -import mxEvent from "../util/mxEvent"; +import mxUtils from '../util/mxUtils'; +import mxPoint from '../util/mxPoint'; +import mxImageShape from '../shape/mxImageShape'; +import mxRectangle from '../util/mxRectangle'; +import mxRectangleShape from '../shape/mxRectangleShape'; +import mxConstants from '../util/mxConstants'; +import mxEvent from '../util/mxEvent'; class mxHandle { /** @@ -61,37 +61,37 @@ class mxHandle { * * Hook for subclassers to return the current position of the handle. */ - getPosition = bounds => {}; + getPosition(bounds) {} /** * Function: setPosition * * Hooks for subclassers to update the style in the . */ - setPosition = (bounds, pt, me) => {}; + setPosition(bounds, pt, me) {} /** * Function: execute * * Hook for subclassers to execute the handle. */ - execute = me => {}; + execute(me) {} /** * Function: copyStyle * * Sets the cell style with the given name to the corresponding value in . */ - copyStyle = key => { + copyStyle(key) { this.graph.setCellStyles(key, this.state.style[key], [this.state.cell]); - }; + } /** * Function: processEvent * * Processes the given and invokes . */ - processEvent = me => { + processEvent(me) { const { scale } = this.graph.view; const tr = this.graph.view.translate; let pt = new mxPoint( @@ -119,7 +119,7 @@ class mxHandle { ); this.setPosition(this.state.getPaintBounds(), pt, me); this.redraw(); - }; + } /** * Function: positionChanged @@ -127,7 +127,7 @@ class mxHandle { * Should be called after in . * This repaints the state using . */ - positionChanged = () => { + positionChanged() { if (this.state.text != null) { this.state.text.apply(this.state); } @@ -137,20 +137,20 @@ class mxHandle { } this.graph.cellRenderer.redraw(this.state, true); - }; + } /** * Function: getRotation * * Returns the rotation defined in the style of the cell. */ - getRotation = () => { + getRotation() { if (this.state.shape != null) { return this.state.shape.getRotation(); } return 0; - }; + } /** * Function: getTotalRotation @@ -158,20 +158,20 @@ class mxHandle { * Returns the rotation from the style and the rotation from the direction of * the cell. */ - getTotalRotation = () => { + getTotalRotation() { if (this.state.shape != null) { return this.state.shape.getShapeRotation(); } return 0; - }; + } /** * Function: init * * Creates and initializes the shapes required for this handle. */ - init = () => { + init() { const html = this.isHtmlRequired(); if (this.image != null) { @@ -185,14 +185,14 @@ class mxHandle { } this.initShape(html); - }; + } /** * Function: createShape * * Creates and returns the shape for this handle. */ - createShape = html => { + createShape(html) { const bounds = new mxRectangle( 0, 0, @@ -205,14 +205,14 @@ class mxHandle { mxConstants.HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR ); - }; + } /** * Function: initShape * * Initializes and sets its cursor. */ - initShape = html => { + initShape(html) { if (html && this.shape.isHtmlAllowed()) { this.shape.dialect = mxConstants.DIALECT_STRICTHTML; this.shape.init(this.graph.container); @@ -229,14 +229,14 @@ class mxHandle { mxEvent.redirectMouseEvents(this.shape.node, this.graph, this.state); this.shape.node.style.cursor = this.cursor; - }; + } /** * Function: redraw * * Renders the shape for this handle. */ - redraw = () => { + redraw() { if (this.shape != null && this.state.shape != null) { let pt = this.getPosition(this.state.getPaintBounds()); @@ -257,7 +257,7 @@ class mxHandle { this.shape.redraw(); } } - }; + } /** * Function: isHtmlRequired @@ -265,33 +265,33 @@ 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 = () => { + isHtmlRequired() { return ( this.state.text != null && this.state.text.node.parentNode === this.graph.container ); - }; + } /** * Function: rotatePoint * * Rotates the point by the given angle. */ - rotatePoint = (pt, alpha) => { + rotatePoint(pt, alpha) { const bounds = this.state.getCellBounds(); const cx = new mxPoint(bounds.getCenterX(), bounds.getCenterY()); const cos = Math.cos(alpha); const sin = Math.sin(alpha); return mxUtils.getRotatedPoint(pt, cos, sin, cx); - }; + } /** * Function: flipPoint * * Flips the given point vertically and/or horizontally. */ - flipPoint = pt => { + flipPoint(pt) { if (this.state.shape != null) { const bounds = this.state.getCellBounds(); @@ -305,7 +305,7 @@ class mxHandle { } return pt; - }; + } /** * Function: snapPoint @@ -313,48 +313,48 @@ 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, ignore) => { + snapPoint(pt, ignore) { if (!ignore) { pt.x = this.graph.snap(pt.x); pt.y = this.graph.snap(pt.y); } return pt; - }; + } /** * Function: setVisible * * Shows or hides this handle. */ - setVisible = visible => { + setVisible(visible) { if (this.shape != null && this.shape.node != null) { this.shape.node.style.display = visible ? '' : 'none'; } - }; + } /** * Function: reset * * Resets the state of this handle by setting its visibility to true. */ - reset = () => { + reset() { this.setVisible(true); this.state.style = this.graph.getCellStyle(this.state.cell); this.positionChanged(); - }; + } /** * Function: destroy * * Destroys this handle. */ - destroy = () => { + destroy() { if (this.shape != null) { this.shape.destroy(); this.shape = null; } - }; + } } export default mxHandle; diff --git a/src/mxgraph/handler/mxKeyHandler.js b/src/mxgraph/handler/mxKeyHandler.js index 3e256b1c7..58bfcdd05 100644 --- a/src/mxgraph/handler/mxKeyHandler.js +++ b/src/mxgraph/handler/mxKeyHandler.js @@ -4,8 +4,8 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxEvent from "../util/mxEvent"; -import mxUtils from "../util/mxUtils"; +import mxEvent from '../util/mxEvent'; +import mxUtils from '../util/mxUtils'; class mxKeyHandler { /** @@ -145,9 +145,9 @@ class mxKeyHandler { * Returns true if events are handled. This implementation returns * . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -158,9 +158,9 @@ class mxKeyHandler { * * enabled - Boolean that specifies the new enabled state. */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: bindKey @@ -173,9 +173,9 @@ class mxKeyHandler { * code - Integer that specifies the keycode. * funct - JavaScript function that takes the key event as an argument. */ - bindKey = (code, funct) => { + bindKey(code, funct) { this.normalKeys[code] = funct; - }; + } /** * Function: bindShiftKey @@ -188,9 +188,9 @@ class mxKeyHandler { * code - Integer that specifies the keycode. * funct - JavaScript function that takes the key event as an argument. */ - bindShiftKey = (code, funct) => { + bindShiftKey(code, funct) { this.shiftKeys[code] = funct; - }; + } /** * Function: bindControlKey @@ -203,9 +203,9 @@ class mxKeyHandler { * code - Integer that specifies the keycode. * funct - JavaScript function that takes the key event as an argument. */ - bindControlKey = (code, funct) => { + bindControlKey(code, funct) { this.controlKeys[code] = funct; - }; + } /** * Function: bindControlShiftKey @@ -218,9 +218,9 @@ class mxKeyHandler { * code - Integer that specifies the keycode. * funct - JavaScript function that takes the key event as an argument. */ - bindControlShiftKey = (code, funct) => { + bindControlShiftKey(code, funct) { this.controlShiftKeys[code] = funct; - }; + } /** * Function: isControlDown @@ -231,9 +231,9 @@ class mxKeyHandler { * * evt - Key event whose control key pressed state should be returned. */ - isControlDown = evt => { + isControlDown(evt) { return mxEvent.isControlDown(evt); - }; + } /** * Function: getFunction @@ -245,7 +245,7 @@ class mxKeyHandler { * * evt - Key event whose associated function should be returned. */ - getFunction = evt => { + getFunction(evt) { if (evt != null && !mxEvent.isAltDown(evt)) { if (this.isControlDown(evt)) { if (mxEvent.isShiftDown(evt)) { @@ -260,7 +260,7 @@ class mxKeyHandler { } return null; - }; + } /** * Function: isGraphEvent @@ -274,7 +274,7 @@ class mxKeyHandler { * * evt - Key event that represents the keystroke. */ - isGraphEvent = evt => { + isGraphEvent(evt) { const source = mxEvent.getSource(evt); // Accepts events from the target object or @@ -290,7 +290,7 @@ class mxKeyHandler { // Accepts events from inside the container return mxUtils.isAncestorNode(this.graph.container, source); - }; + } /** * Function: keyDown @@ -304,7 +304,7 @@ class mxKeyHandler { * * evt - Key event that represents the keystroke. */ - keyDown = evt => { + keyDown(evt) { if (this.isEnabledForEvent(evt)) { // Cancels the editing if escape is pressed if (evt.keyCode === 27 /* Escape */) { @@ -321,7 +321,7 @@ class mxKeyHandler { } } } - }; + } /** * Function: isEnabledForEvent @@ -336,14 +336,14 @@ class mxKeyHandler { * * evt - Key event that represents the keystroke. */ - isEnabledForEvent = evt => { + isEnabledForEvent(evt) { return ( this.graph.isEnabled() && !mxEvent.isConsumed(evt) && this.isGraphEvent(evt) && this.isEnabled() ); - }; + } /** * Function: isEventIgnored @@ -355,9 +355,9 @@ class mxKeyHandler { * * evt - Key event that represents the keystroke. */ - isEventIgnored = evt => { + isEventIgnored(evt) { return this.graph.isEditing(); - }; + } /** * Function: escape @@ -371,11 +371,11 @@ class mxKeyHandler { * evt - Key event that represents the keystroke. Possible keycode in this * case is 27 (ESCAPE). */ - escape = evt => { + escape(evt) { if (this.graph.isEscapeEnabled()) { this.graph.escape(evt); } - }; + } /** * Function: destroy @@ -384,14 +384,14 @@ class mxKeyHandler { * normally not need to be called, it is called automatically when the * window unloads (in IE). */ - destroy = () => { + destroy() { if (this.target != null && this.keydownHandler != null) { mxEvent.removeListener(this.target, 'keydown', this.keydownHandler); this.keydownHandler = null; } this.target = null; - }; + } } export default mxKeyHandler; diff --git a/src/mxgraph/handler/mxPanningHandler.js b/src/mxgraph/handler/mxPanningHandler.js index 7b9080a17..3bfb4d1dd 100644 --- a/src/mxgraph/handler/mxPanningHandler.js +++ b/src/mxgraph/handler/mxPanningHandler.js @@ -205,45 +205,45 @@ class mxPanningHandler extends mxEventSource { * * Returns true if the handler is currently active. */ - isActive = () => { + isActive() { return this.active || this.initialScale != null; - }; + } /** * Function: isPanningEnabled * * Returns . */ - isPanningEnabled = () => { + isPanningEnabled() { return this.panningEnabled; - }; + } /** * Function: setPanningEnabled * * Sets . */ - setPanningEnabled = value => { + setPanningEnabled(value) { this.panningEnabled = value; - }; + } /** * Function: isPinchEnabled * * Returns . */ - isPinchEnabled = () => { + isPinchEnabled() { return this.pinchEnabled; - }; + } /** * Function: setPinchEnabled * * Sets . */ - setPinchEnabled = value => { + setPinchEnabled(value) { this.pinchEnabled = value; - }; + } /** * Function: isPanningTrigger @@ -252,7 +252,7 @@ class mxPanningHandler extends mxEventSource { * given cell. This returns true if control-shift is pressed or if * is true and the event is a popup trigger. */ - isPanningTrigger = me => { + isPanningTrigger(me) { const evt = me.getEvent(); return ( @@ -262,7 +262,7 @@ class mxPanningHandler extends mxEventSource { (mxEvent.isControlDown(evt) && mxEvent.isShiftDown(evt)) || (this.usePopupTrigger && mxEvent.isPopupTrigger(evt)) ); - }; + } /** * Function: isForcePanningEvent @@ -271,9 +271,9 @@ class mxPanningHandler extends mxEventSource { * implementation always returns true if is true or for * multi touch events. */ - isForcePanningEvent = me => { + isForcePanningEvent(me) { return this.ignoreCell || mxEvent.isMultiTouchEvent(me.getEvent()); - }; + } /** * Function: mouseDown @@ -281,7 +281,7 @@ class mxPanningHandler extends mxEventSource { * Handles the event by initiating the panning. By consuming the event all * subsequent events of the gesture are redirected to this handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { this.mouseDownEvent = me; if ( @@ -293,14 +293,14 @@ class mxPanningHandler extends mxEventSource { this.start(me); this.consumePanningTrigger(me); } - }; + } /** * Function: start * * Starts panning at the given event. */ - start = me => { + start(me) { this.dx0 = -this.graph.container.scrollLeft; this.dy0 = -this.graph.container.scrollTop; @@ -311,7 +311,7 @@ class mxPanningHandler extends mxEventSource { this.dy = null; this.panningTrigger = true; - }; + } /** * Function: consumePanningTrigger @@ -341,16 +341,16 @@ class mxPanningHandler extends mxEventSource { * }; * (end) */ - consumePanningTrigger = me => { + consumePanningTrigger(me) { me.consume(); - }; + } /** * Function: mouseMove * * Handles the event by updating the panning on the graph. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { this.dx = me.getX() - this.startX; this.dy = me.getY() - this.startY; @@ -383,7 +383,7 @@ class mxPanningHandler extends mxEventSource { if (this.active || this.panningTrigger) { me.consume(); } - }; + } /** * Function: mouseUp @@ -391,7 +391,7 @@ class mxPanningHandler extends mxEventSource { * Handles the event by setting the translation on the view or showing the * popupmenu. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if (this.active) { if (this.dx != null && this.dy != null) { // Ignores if scrollbars have been used for panning @@ -412,14 +412,14 @@ class mxPanningHandler extends mxEventSource { } this.reset(); - }; + } /** * Function: zoomGraph * * Zooms the graph to the given value and consumed the event if needed. */ - zoomGraph = evt => { + zoomGraph(evt) { let value = Math.round(this.initialScale * evt.scale * 100) / 100; if (this.minScale != null) { @@ -434,41 +434,41 @@ class mxPanningHandler extends mxEventSource { this.graph.zoomTo(value); mxEvent.consume(evt); } - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { this.panningTrigger = false; this.mouseDownEvent = null; this.active = false; this.dx = null; this.dy = null; - }; + } /** * Function: panGraph * * Pans by the given amount. */ - panGraph = (dx, dy) => { + panGraph(dx, dy) { this.graph.getView().setTranslate(dx, dy); - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { this.graph.removeMouseListener(this); this.graph.removeListener(this.forcePanningHandler); this.graph.removeListener(this.gestureHandler); mxEvent.removeListener(document, 'mouseup', this.mouseUpListener); - }; + } } export default mxPanningHandler; diff --git a/src/mxgraph/handler/mxPopupMenuHandler.js b/src/mxgraph/handler/mxPopupMenuHandler.js index e1e45da9a..a82d49d16 100644 --- a/src/mxgraph/handler/mxPopupMenuHandler.js +++ b/src/mxgraph/handler/mxPopupMenuHandler.js @@ -92,7 +92,7 @@ class mxPopupMenuHandler extends mxPopupMenu { * * Initializes the shapes required for this vertex handler. */ - init = () => { + init() { // Supercall super.init(); @@ -104,7 +104,7 @@ class mxPopupMenuHandler extends mxPopupMenu { this.graph.tooltipHandler.hide(); }) ); - }; + } /** * Function: isSelectOnPopup @@ -112,9 +112,9 @@ class mxPopupMenuHandler extends mxPopupMenu { * Hook for returning if a cell should be selected for a given . * This implementation returns . */ - isSelectOnPopup = me => { + isSelectOnPopup(me) { return this.selectOnPopup; - }; + } /** * Function: mouseDown @@ -122,7 +122,7 @@ class mxPopupMenuHandler extends mxPopupMenu { * Handles the event by initiating the panning. By consuming the event all * subsequent events of the gesture are redirected to this handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { if (this.isEnabled() && !mxEvent.isMultiTouchEvent(me.getEvent())) { // Hides the popupmenu if is is being displayed this.hideMenu(); @@ -133,14 +133,14 @@ class mxPopupMenuHandler extends mxPopupMenu { this.popupTrigger = this.isPopupTrigger(me); this.inTolerance = true; } - }; + } /** * Function: mouseMove * * Handles the event by updating the panning on the graph. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { // Popup trigger may change on mouseUp so ignore it if (this.inTolerance && this.screenX != null && this.screenY != null) { if ( @@ -152,7 +152,7 @@ class mxPopupMenuHandler extends mxPopupMenu { this.inTolerance = false; } } - }; + } /** * Function: mouseUp @@ -160,7 +160,7 @@ class mxPopupMenuHandler extends mxPopupMenu { * Handles the event by setting the translation on the view or showing the * popupmenu. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if ( this.popupTrigger && this.inTolerance && @@ -198,29 +198,29 @@ class mxPopupMenuHandler extends mxPopupMenu { this.popupTrigger = false; this.inTolerance = false; - }; + } /** * Function: getCellForPopupEvent * * Hook to return the cell for the mouse up popup trigger handling. */ - getCellForPopupEvent = me => { + getCellForPopupEvent(me) { return me.getCell(); - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { this.graph.removeMouseListener(this); this.graph.removeListener(this.gestureHandler); // Supercall super.destroy(); - }; + } } export default mxPopupMenuHandler; diff --git a/src/mxgraph/handler/mxRubberband.js b/src/mxgraph/handler/mxRubberband.js index 14b1e4326..aac22ff10 100644 --- a/src/mxgraph/handler/mxRubberband.js +++ b/src/mxgraph/handler/mxRubberband.js @@ -127,9 +127,9 @@ class mxRubberband { * Returns true if events are handled. This implementation returns * . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -137,9 +137,9 @@ class mxRubberband { * Enables or disables event handling. This implementation updates * . */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: isForceRubberbandEvent @@ -147,9 +147,9 @@ 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) { return mxEvent.isAltDown(me.getEvent()); - }; + } /** * Function: mouseDown @@ -158,7 +158,7 @@ class mxRubberband { * event all subsequent events of the gesture are redirected to this * handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { if ( !me.isConsumed() && this.isEnabled() && @@ -179,14 +179,14 @@ class mxRubberband { // not selecting anything while we're rubberbanding. me.consume(false); } - }; + } /** * Function: start * * Sets the start point for the rubberband selection. */ - start = (x, y) => { + start(x, y) { this.first = new mxPoint(x, y); const { container } = this.graph; @@ -218,14 +218,14 @@ class mxRubberband { this.dropHandler ); } - }; + } /** * Function: mouseMove * * Handles the event by updating therubberband selection. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (!me.isConsumed() && this.first != null) { const origin = mxUtils.getScrollOrigin(this.graph.container); const offset = mxUtils.getOffset(this.graph.container); @@ -250,14 +250,14 @@ class mxRubberband { me.consume(); } } - }; + } /** * Function: createShape * * Creates the rubberband selection shape. */ - createShape = () => { + createShape() { if (this.sharedDiv == null) { this.sharedDiv = document.createElement('div'); this.sharedDiv.className = 'mxRubberband'; @@ -272,16 +272,16 @@ class mxRubberband { } return result; - }; + } /** * Function: isActive * * Returns true if this handler is active. */ - isActive = (sender, me) => { + isActive(sender, me) { return this.div != null && this.div.style.display !== 'none'; - }; + } /** * Function: mouseUp @@ -289,7 +289,7 @@ class mxRubberband { * Handles the event by selecting the region of the rubberband using * . */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { const active = this.isActive(); this.reset(); @@ -297,7 +297,7 @@ class mxRubberband { this.execute(me.getEvent()); me.consume(); } - }; + } /** * Function: execute @@ -305,17 +305,17 @@ class mxRubberband { * Resets the state of this handler and selects the current region * for the given event. */ - execute = evt => { + execute(evt) { const rect = new mxRectangle(this.x, this.y, this.width, this.height); this.graph.selectRegion(rect, evt); - }; + } /** * Function: reset * * Resets the state of the rubberband selection. */ - reset = () => { + reset() { if (this.div != null) { if (mxClient.IS_SVG && this.fadeOut) { const temp = this.div; @@ -344,26 +344,26 @@ class mxRubberband { this.currentY = 0; this.first = null; this.div = null; - }; + } /** * Function: update * * Sets and and calls . */ - update = (x, y) => { + update(x, y) { this.currentX = x; this.currentY = y; this.repaint(); - }; + } /** * Function: repaint * * Computes the bounding box and updates the style of the
. */ - repaint = () => { + repaint() { if (this.div != null) { const x = this.currentX - this.graph.panDx; const y = this.currentY - this.graph.panDy; @@ -381,7 +381,7 @@ class mxRubberband { this.div.style.width = `${Math.max(1, this.width)}px`; this.div.style.height = `${Math.max(1, this.height)}px`; } - }; + } /** * Function: destroy @@ -390,7 +390,7 @@ class mxRubberband { * normally not need to be called, it is called automatically when the * window unloads. */ - destroy = () => { + destroy() { if (!this.destroyed) { this.destroyed = true; this.graph.removeMouseListener(this); @@ -402,7 +402,7 @@ class mxRubberband { this.sharedDiv = null; } } - }; + } } export default mxRubberband; diff --git a/src/mxgraph/handler/mxSelectionCellsHandler.js b/src/mxgraph/handler/mxSelectionCellsHandler.js index b81002643..ce498ff6b 100644 --- a/src/mxgraph/handler/mxSelectionCellsHandler.js +++ b/src/mxgraph/handler/mxSelectionCellsHandler.js @@ -98,63 +98,63 @@ class mxSelectionCellsHandler extends mxEventSource { * * Returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled * * Sets . */ - setEnabled = value => { + setEnabled(value) { this.enabled = value; - }; + } /** * Function: getHandler * * Returns the handler for the given cell. */ - getHandler = cell => { + getHandler(cell) { return this.handlers.get(cell); - }; + } /** * Function: isHandled * * Returns true if the given cell has a handler. */ - isHandled = cell => { + isHandled(cell) { return this.getHandler(cell) != null; - }; + } /** * Function: reset * * Resets all handlers. */ - reset = () => { + reset() { this.handlers.visit((key, handler) => { handler.reset.apply(handler); }); - }; + } /** * Function: getHandledSelectionCells * * Reloads or updates all handlers. */ - getHandledSelectionCells = () => { + getHandledSelectionCells() { return this.graph.getSelectionCells(); - }; + } /** * Function: refresh * * Reloads or updates all handlers. */ - refresh = () => { + refresh() { // Removes all existing handlers const oldHandlers = this.handlers; this.handlers = new mxDictionary(); @@ -214,23 +214,23 @@ class mxSelectionCellsHandler extends mxEventSource { } } } - }; + } /** * Function: isHandlerActive * * Returns true if the given handler is active and should not be redrawn. */ - isHandlerActive = handler => { + isHandlerActive(handler) { return handler.index != null; - }; + } /** * Function: updateHandler * * Updates the handler for the given shape if one exists. */ - updateHandler = state => { + updateHandler(state) { let handler = this.handlers.remove(state.cell); if (handler != null) { @@ -250,14 +250,14 @@ class mxSelectionCellsHandler extends mxEventSource { } } } - }; + } /** * Function: mouseDown * * Redirects the given event to the handlers. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { if (this.graph.isEnabled() && this.isEnabled()) { const args = [sender, me]; @@ -265,14 +265,14 @@ class mxSelectionCellsHandler extends mxEventSource { handler.mouseDown.apply(handler, args); }); } - }; + } /** * Function: mouseMove * * Redirects the given event to the handlers. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (this.graph.isEnabled() && this.isEnabled()) { const args = [sender, me]; @@ -280,14 +280,14 @@ class mxSelectionCellsHandler extends mxEventSource { handler.mouseMove.apply(handler, args); }); } - }; + } /** * Function: mouseUp * * Redirects the given event to the handlers. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if (this.graph.isEnabled() && this.isEnabled()) { const args = [sender, me]; @@ -295,14 +295,14 @@ class mxSelectionCellsHandler extends mxEventSource { handler.mouseUp.apply(handler, args); }); } - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { this.graph.removeMouseListener(this); if (this.refreshHandler != null) { @@ -311,7 +311,7 @@ class mxSelectionCellsHandler extends mxEventSource { this.graph.getView().removeListener(this.refreshHandler); this.refreshHandler = null; } - }; + } } export default mxSelectionCellsHandler; diff --git a/src/mxgraph/handler/mxTooltipHandler.js b/src/mxgraph/handler/mxTooltipHandler.js index 1b59da37d..f57709282 100644 --- a/src/mxgraph/handler/mxTooltipHandler.js +++ b/src/mxgraph/handler/mxTooltipHandler.js @@ -4,8 +4,8 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxEvent from '../util/mxEvent'; -import mxUtils from "../util/mxUtils"; -import mxConstants from "../util/mxConstants"; +import mxUtils from '../util/mxUtils'; +import mxConstants from '../util/mxConstants'; class mxTooltipHandler { /** @@ -96,9 +96,9 @@ class mxTooltipHandler { * Returns true if events are handled. This implementation * returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -106,34 +106,34 @@ class mxTooltipHandler { * Enables or disables event handling. This implementation * updates . */ - setEnabled = enabled => { + setEnabled(enabled) { this.enabled = enabled; - }; + } /** * Function: isHideOnHover * * Returns . */ - isHideOnHover = () => { + isHideOnHover() { return this.hideOnHover; - }; + } /** * Function: setHideOnHover * * Sets . */ - setHideOnHover = value => { + setHideOnHover(value) { this.hideOnHover = value; - }; + } /** * Function: init * * Initializes the DOM nodes required for this tooltip handler. */ - init = () => { + init() { if (document.body != null) { this.div = document.createElement('div'); this.div.className = 'mxTooltip'; @@ -149,16 +149,16 @@ class mxTooltipHandler { } }); } - }; + } /** * Function: getStateForEvent * * Returns the to be used for showing a tooltip for this event. */ - getStateForEvent = me => { + getStateForEvent(me) { return me.getState(); - }; + } /** * Function: mouseDown @@ -167,17 +167,17 @@ class mxTooltipHandler { * event all subsequent events of the gesture are redirected to this * handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { this.reset(me, false); this.hideTooltip(); - }; + } /** * Function: mouseMove * * Handles the event by updating the rubberband selection. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (me.getX() !== this.lastX || me.getY() !== this.lastY) { this.reset(me, true); const state = this.getStateForEvent(me); @@ -197,7 +197,7 @@ class mxTooltipHandler { this.lastX = me.getX(); this.lastY = me.getY(); - }; + } /** * Function: mouseUp @@ -205,29 +205,29 @@ class mxTooltipHandler { * Handles the event by resetting the tooltip timer or hiding the existing * tooltip. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { this.reset(me, true); this.hideTooltip(); - }; + } /** * Function: resetTimer * * Resets the timer. */ - resetTimer = () => { + resetTimer() { if (this.thread != null) { window.clearTimeout(this.thread); this.thread = null; } - }; + } /** * Function: reset * * Resets and/or restarts the timer to trigger the display of the tooltip. */ - reset = (me, restart, state) => { + reset(me, restart, state) { if (!this.ignoreTouchEvents || mxEvent.isMouseEvent(me.getEvent())) { this.resetTimer(); state = state != null ? state : this.getStateForEvent(me); @@ -261,29 +261,29 @@ class mxTooltipHandler { }, this.delay); } } - }; + } /** * Function: hide * * Hides the tooltip and resets the timer. */ - hide = () => { + hide() { this.resetTimer(); this.hideTooltip(); - }; + } /** * Function: hideTooltip * * Hides the tooltip. */ - hideTooltip = () => { + hideTooltip() { if (this.div != null) { this.div.style.visibility = 'hidden'; this.div.innerHTML = ''; } - }; + } /** * Function: show @@ -291,7 +291,7 @@ class mxTooltipHandler { * Shows the tooltip for the specified cell and optional index at the * specified location (with a vertical offset of 10 pixels). */ - show = (tip, x, y) => { + show(tip, x, y) { if (!this.destroyed && tip != null && tip.length > 0) { // Initializes the DOM nodes if required if (this.div == null) { @@ -316,14 +316,14 @@ class mxTooltipHandler { this.div.style.visibility = ''; mxUtils.fit(this.div); } - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { if (!this.destroyed) { this.graph.removeMouseListener(this); mxEvent.release(this.div); @@ -335,7 +335,7 @@ class mxTooltipHandler { this.destroyed = true; this.div = null; } - }; + } } export default mxTooltipHandler; diff --git a/src/mxgraph/handler/mxVertexHandler.js b/src/mxgraph/handler/mxVertexHandler.js index f0c51b091..2d5b0b38d 100644 --- a/src/mxgraph/handler/mxVertexHandler.js +++ b/src/mxgraph/handler/mxVertexHandler.js @@ -10,9 +10,9 @@ import mxRectangleShape from '../shape/mxRectangleShape'; import mxImageShape from '../shape/mxImageShape'; import mxEllipse from '../shape/mxEllipse'; import mxPoint from '../util/mxPoint'; -import mxUtils from "../util/mxUtils"; -import mxClient from "../mxClient"; -import mxGraphHandler from "./mxGraphHandler"; +import mxUtils from '../util/mxUtils'; +import mxClient from '../mxClient'; +import mxGraphHandler from './mxGraphHandler'; class mxVertexHandler { /** @@ -201,7 +201,7 @@ class mxVertexHandler { * * Initializes the shapes required for this vertex handler. */ - init = () => { + init() { this.graph = this.state.view.graph; this.selectionBounds = this.getSelectionBounds(this.state); this.bounds = new mxRectangle( @@ -229,7 +229,10 @@ class mxVertexHandler { } // Adds the sizer handles - if (this.graph.graphHandler.maxCells <= 0 || this.graph.getSelectionCount() < this.graph.graphHandler.maxCells) { + if ( + this.graph.graphHandler.maxCells <= 0 || + this.graph.getSelectionCount() < this.graph.graphHandler.maxCells + ) { const resizable = this.graph.isCellResizable(this.state.cell); this.sizers = []; @@ -305,58 +308,59 @@ class mxVertexHandler { if (this.constrainGroupByChildren) { this.updateMinBounds(); } - }; + } /** * Function: isRotationHandleVisible * * Returns true if the rotation handle should be showing. */ - isRotationHandleVisible = () => { + isRotationHandleVisible() { return ( this.graph.isEnabled() && this.rotationEnabled && this.graph.isCellRotatable(this.state.cell) && - (this.graph.graphHandler.maxCells <= 0 || this.graph.getSelectionCount() < this.graph.graphHandler.maxCells) + (this.graph.graphHandler.maxCells <= 0 || + this.graph.getSelectionCount() < this.graph.graphHandler.maxCells) ); - }; + } /** * Function: isConstrainedEvent * * Returns true if the aspect ratio if the cell should be maintained. */ - isConstrainedEvent = me => { + isConstrainedEvent(me) { return ( mxEvent.isShiftDown(me.getEvent()) || this.state.style[mxConstants.STYLE_ASPECT] === 'fixed' ); - }; + } /** * Function: isCenteredEvent * * Returns true if the center of the vertex should be maintained during the resize. */ - isCenteredEvent = (state, me) => { + isCenteredEvent(state, me) { return false; - }; + } /** * Function: createCustomHandles * * Returns an array of custom handles. This implementation returns null. */ - createCustomHandles = () => { + createCustomHandles() { return null; - }; + } /** * Function: updateMinBounds * * Initializes the shapes required for this vertex handler. */ - updateMinBounds = () => { + updateMinBounds() { const children = this.graph.getChildCells(this.state.cell); if (children.length > 0) { @@ -376,7 +380,7 @@ class mxVertexHandler { this.y0 = this.state.y / s - t.y; } } - }; + } /** * Function: getSelectionBounds @@ -384,30 +388,30 @@ class mxVertexHandler { * Returns the mxRectangle that defines the bounds of the selection * border. */ - getSelectionBounds = state => { + getSelectionBounds(state) { return new mxRectangle( Math.round(state.x), Math.round(state.y), Math.round(state.width), Math.round(state.height) ); - }; + } /** * Function: createParentHighlightShape * * Creates the shape used to draw the selection border. */ - createParentHighlightShape = bounds => { + createParentHighlightShape(bounds) { return this.createSelectionShape(bounds); - }; + } /** * Function: createSelectionShape * * Creates the shape used to draw the selection border. */ - createSelectionShape = bounds => { + createSelectionShape(bounds) { const shape = new mxRectangleShape( mxRectangle.fromRectangle(bounds), null, @@ -417,34 +421,34 @@ class mxVertexHandler { shape.isDashed = this.isSelectionDashed(); return shape; - }; + } /** * Function: getSelectionColor * * Returns . */ - getSelectionColor = () => { + getSelectionColor() { return mxConstants.VERTEX_SELECTION_COLOR; - }; + } /** * Function: getSelectionStrokeWidth * * Returns . */ - getSelectionStrokeWidth = () => { + getSelectionStrokeWidth() { return mxConstants.VERTEX_SELECTION_STROKEWIDTH; - }; + } /** * Function: isSelectionDashed * * Returns . */ - isSelectionDashed = () => { + isSelectionDashed() { return mxConstants.VERTEX_SELECTION_DASHED; - }; + } /** * Function: createSizer @@ -452,7 +456,7 @@ class mxVertexHandler { * Creates a sizer handle for the specified cursor and index and returns * the new that represents the handle. */ - createSizer = (cursor, index, size, fillColor) => { + createSizer(cursor, index, size, fillColor) { size = size || mxConstants.HANDLE_SIZE; const bounds = new mxRectangle(0, 0, size, size); @@ -486,7 +490,7 @@ class mxVertexHandler { } return sizer; - }; + } /** * Function: isSizerVisible @@ -494,9 +498,9 @@ class mxVertexHandler { * Returns true if the sizer for the given index is visible. * This returns true for all given indices. */ - isSizerVisible = index => { + isSizerVisible(index) { return true; - }; + } /** * Function: createSizerShape @@ -505,7 +509,7 @@ class mxVertexHandler { * index. Only images and rectangles should be returned if support for HTML * labels with not foreign objects is required. */ - createSizerShape = (bounds, index, fillColor) => { + createSizerShape(bounds, index, fillColor) { if (this.handleImage != null) { bounds = new mxRectangle( bounds.x, @@ -532,7 +536,7 @@ class mxVertexHandler { fillColor || mxConstants.HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR ); - }; + } /** * Function: createBounds @@ -540,7 +544,7 @@ class mxVertexHandler { * Helper method to create an around the given centerpoint * with a width and height of 2*s or 6, if no s is given. */ - moveSizerTo = (shape, x, y) => { + moveSizerTo(shape, x, y) { if (shape != null) { shape.bounds.x = Math.floor(x - shape.bounds.width / 2); shape.bounds.y = Math.floor(y - shape.bounds.height / 2); @@ -550,7 +554,7 @@ class mxVertexHandler { shape.redraw(); } } - }; + } /** * Function: getHandleForEvent @@ -558,7 +562,7 @@ class mxVertexHandler { * Returns the index of the handle for the given event. This returns the index * of the sizer from where the event originated or . */ - getHandleForEvent = me => { + getHandleForEvent(me) { // Connection highlight may consume events before they reach sizer handle const tol = !mxEvent.isMouseEvent(me.getEvent()) ? this.tolerance : 1; const hit = @@ -624,7 +628,7 @@ class mxVertexHandler { } return null; - }; + } /** * Function: isCustomHandleEvent @@ -632,9 +636,9 @@ class mxVertexHandler { * Returns true if the given event allows custom handles to be changed. This * implementation returns true. */ - isCustomHandleEvent = me => { + isCustomHandleEvent(me) { return true; - }; + } /** * Function: mouseDown @@ -643,7 +647,7 @@ class mxVertexHandler { * event all subsequent events of the gesture are redirected to this * handler. */ - mouseDown = (sender, me) => { + mouseDown(sender, me) { if (!me.isConsumed() && this.graph.isEnabled()) { const handle = this.getHandleForEvent(me); @@ -652,7 +656,7 @@ class mxVertexHandler { me.consume(); } } - }; + } /** * Function: isLivePreviewBorder @@ -660,20 +664,20 @@ class mxVertexHandler { * Called if is enabled to check if a border should be painted. * This implementation returns true if the shape is transparent. */ - isLivePreviewBorder = () => { + isLivePreviewBorder() { return ( this.state.shape != null && this.state.shape.fill == null && this.state.shape.stroke == null ); - }; + } /** * Function: start * * Starts the handling of the mouse gesture. */ - start = (x, y, index) => { + start(x, y, index) { if (this.selectionBorder != null) { this.livePreviewActive = this.livePreview && @@ -768,14 +772,14 @@ class mxVertexHandler { } } } - }; + } /** * Function: createGhostPreview * * Starts the handling of the mouse gesture. */ - createGhostPreview = () => { + createGhostPreview() { const shape = this.graph.cellRenderer.createShape(this.state); shape.init(this.graph.view.getOverlayPane()); shape.scale = this.state.view.scale; @@ -783,14 +787,14 @@ class mxVertexHandler { shape.outline = true; return shape; - }; + } /** * Function: hideHandles * * Shortcut to . */ - setHandlesVisible = visible => { + setHandlesVisible(visible) { this.handlesVisible = visible; if (this.sizers != null) { @@ -804,7 +808,7 @@ class mxVertexHandler { this.customHandles[i].setVisible(visible); } } - }; + } /** * Function: hideSizers @@ -813,9 +817,9 @@ class mxVertexHandler { * * Starts the handling of the mouse gesture. */ - hideSizers = () => { + hideSizers() { this.setHandlesVisible(false); - }; + } /** * Function: checkTolerance @@ -824,7 +828,7 @@ class mxVertexHandler { * . If the event is a mouse event then the tolerance is * ignored. */ - checkTolerance = me => { + checkTolerance(me) { if (this.inTolerance && this.startX != null && this.startY != null) { if ( mxEvent.isMouseEvent(me.getEvent()) || @@ -834,46 +838,46 @@ class mxVertexHandler { this.inTolerance = false; } } - }; + } /** * Function: updateHint * * Hook for subclassers do show details while the handler is active. */ - updateHint = me => {}; + updateHint(me) {} /** * Function: removeHint * * Hooks for subclassers to hide details when the handler gets inactive. */ - removeHint = () => {}; + removeHint() {} /** * Function: roundAngle * * Hook for rounding the angle. This uses Math.round. */ - roundAngle = angle => { + roundAngle(angle) { return Math.round(angle * 10) / 10; - }; + } /** * Function: roundLength * * Hook for rounding the unscaled width or height. This uses Math.round. */ - roundLength = length => { + roundLength(length) { return Math.round(length * 100) / 100; - }; + } /** * Function: mouseMove * * Handles the event by updating the preview. */ - mouseMove = (sender, me) => { + mouseMove(sender, me) { if (!me.isConsumed() && this.index != null) { // Checks tolerance for ignoring single clicks this.checkTolerance(me); @@ -930,23 +934,23 @@ class mxVertexHandler { else if (!this.graph.isMouseDown && this.getHandleForEvent(me) != null) { me.consume(false); } - }; + } /** * Function: isGhostPreview * * Returns true if a ghost preview should be used for custom handles. */ - isGhostPreview = () => { + isGhostPreview() { return this.state.view.graph.model.getChildCount(this.state.cell) > 0; - }; + } /** * Function: moveLabel * * Moves the label. */ - moveLabel = me => { + moveLabel(me) { const point = new mxPoint(me.getGraphX(), me.getGraphY()); const tr = this.graph.view.translate; const { scale } = this.graph.view; @@ -961,14 +965,14 @@ class mxVertexHandler { ? this.sizers.length - 2 : this.sizers.length - 1; this.moveSizerTo(this.sizers[index], point.x, point.y); - }; + } /** * Function: rotateVertex * * Rotates the vertex. */ - rotateVertex = me => { + rotateVertex(me) { const point = new mxPoint(me.getGraphX(), me.getGraphY()); let dx = this.state.x + this.state.width / 2 - point.x; let dy = this.state.y + this.state.height / 2 - point.y; @@ -1007,14 +1011,14 @@ class mxVertexHandler { if (this.livePreviewActive) { this.redrawHandles(); } - }; + } /** * Function: resizeVertex * * Risizes the vertex. */ - resizeVertex = me => { + resizeVertex(me) { const ct = new mxPoint(this.state.getCenterX(), this.state.getCenterY()); const alpha = mxUtils.toRadians( this.state.style[mxConstants.STYLE_ROTATION] || '0' @@ -1190,14 +1194,14 @@ class mxVertexHandler { this.updateParentHighlight(); } } - }; + } /** * Function: updateLivePreview * * Repaints the live preview. */ - updateLivePreview = me => { + updateLivePreview(me) { // TODO: Apply child offset to children in live preview const { scale } = this.graph.view; const tr = this.graph.view.translate; @@ -1256,14 +1260,14 @@ class mxVertexHandler { // Restores current state this.state.setState(tempState); - }; + } /** * Function: moveToFront * * Handles the event by applying the changes to the geometry. */ - moveToFront = () => { + moveToFront() { if ( (this.state.text != null && this.state.text.node != null && @@ -1282,14 +1286,14 @@ class mxVertexHandler { this.state.text.node.parentNode.appendChild(this.state.text.node); } } - }; + } /** * Function: mouseUp * * Handles the event by applying the changes to the geometry. */ - mouseUp = (sender, me) => { + mouseUp(sender, me) { if (this.index != null && this.state != null) { const point = new mxPoint(me.getGraphX(), me.getGraphY()); const { index } = this; @@ -1373,7 +1377,7 @@ class mxVertexHandler { this.reset(); this.redrawHandles(); } - }; + } /** * Function: isRecursiveResize @@ -1386,9 +1390,9 @@ class mxVertexHandler { * the value of this state. * me - the mouse event. */ - isRecursiveResize = (state, me) => { + isRecursiveResize(state, me) { return this.graph.isRecursiveResize(this.state); - }; + } /** * Function: rotateClick @@ -1397,7 +1401,7 @@ class mxVertexHandler { * This code is executed as part of the model transaction. This implementation * is empty. */ - rotateClick = () => {}; + rotateClick() {} /** * Function: rotateCell @@ -1409,7 +1413,7 @@ class mxVertexHandler { * cell - to be rotated. * angle - Angle in degrees. */ - rotateCell = (cell, angle, parent) => { + rotateCell(cell, angle, parent) { if (angle !== 0) { const model = this.graph.getModel(); @@ -1442,14 +1446,14 @@ class mxVertexHandler { } } } - }; + } /** * Function: reset * * Resets the state of this handler. */ - reset = () => { + reset() { if ( this.sizers != null && this.index != null && @@ -1517,7 +1521,7 @@ class mxVertexHandler { this.handlesVisible = true; this.unscaledBounds = null; this.livePreviewActive = null; - }; + } /** * Function: resizeCell @@ -1525,7 +1529,7 @@ class mxVertexHandler { * Uses the given vector to change the bounds of the given cell * in the graph using . */ - resizeCell = (cell, dx, dy, index, gridEnabled, constrained, recurse) => { + resizeCell(cell, dx, dy, index, gridEnabled, constrained, recurse) { let geo = this.graph.model.getGeometry(cell); if (geo != null) { @@ -1573,14 +1577,14 @@ class mxVertexHandler { this.graph.resizeCell(cell, this.unscaledBounds, recurse); } } - }; + } /** * Function: moveChildren * * Moves the children of the given cell by the given vector. */ - moveChildren = (cell, dx, dy) => { + moveChildren(cell, dx, dy) { const model = this.graph.getModel(); const childCount = model.getChildCount(cell); @@ -1594,7 +1598,7 @@ class mxVertexHandler { model.setGeometry(child, geo); } } - }; + } /** * Function: union @@ -1648,17 +1652,7 @@ class mxVertexHandler { * }; * (end) */ - union = ( - bounds, - dx, - dy, - index, - gridEnabled, - scale, - tr, - constrained, - centered - ) => { + union(bounds, dx, dy, index, gridEnabled, scale, tr, constrained, centered) { gridEnabled = gridEnabled != null ? gridEnabled && this.graph.gridEnabled @@ -1794,14 +1788,14 @@ class mxVertexHandler { } return result; - }; + } /** * Function: redraw * * Redraws the handles and the preview. */ - redraw = ignoreHandles => { + redraw(ignoreHandles) { this.selectionBounds = this.getSelectionBounds(this.state); this.bounds = new mxRectangle( this.selectionBounds.x, @@ -1814,12 +1808,12 @@ class mxVertexHandler { if (!ignoreHandles) { this.redrawHandles(); } - }; + } /** * Returns the padding to be used for drawing handles for the current . */ - getHandlePadding = () => { + getHandlePadding() { // KNOWN: Tolerance depends on event type (eg. 0 for mouse events) const result = new mxPoint(0, 0); let tol = this.tolerance; @@ -1838,16 +1832,16 @@ class mxVertexHandler { } return result; - }; + } /** * Function: getSizerBounds * * Returns the bounds used to paint the resize handles. */ - getSizerBounds = () => { + getSizerBounds() { return this.bounds; - }; + } /** * Function: redrawHandles @@ -1867,7 +1861,7 @@ class mxVertexHandler { * }; * (end) */ - redrawHandles = () => { + redrawHandles() { let s = this.getSizerBounds(); const tol = this.tolerance; this.horizontalOffset = 0; @@ -2056,30 +2050,30 @@ class mxVertexHandler { this.edgeHandlers[i].redraw(); } } - }; + } /** * Function: isCustomHandleVisible * * Returns true if the given custom handle is visible. */ - isCustomHandleVisible = handle => { + isCustomHandleVisible(handle) { return ( !this.graph.isEditing() && this.state.view.graph.getSelectionCount() === 1 ); - }; + } /** * Function: getRotationHandlePosition * * Returns an that defines the rotation handle position. */ - getRotationHandlePosition = () => { + getRotationHandlePosition() { return new mxPoint( this.bounds.x + this.bounds.width / 2, this.bounds.y + this.rotationHandleVSpacing ); - }; + } /** * Function: isParentHighlightVisible @@ -2087,18 +2081,18 @@ class mxVertexHandler { * Returns true if the parent highlight should be visible. This implementation * always returns true. */ - isParentHighlightVisible = () => { + isParentHighlightVisible() { return !this.graph.isCellSelected( this.graph.model.getParent(this.state.cell) ); - }; + } /** * Function: updateParentHighlight * * Updates the highlight of the parent if is true. */ - updateParentHighlight = () => { + updateParentHighlight() { if (!this.isDestroyed()) { const visible = this.isParentHighlightVisible(); const parent = this.graph.model.getParent(this.state.cell); @@ -2150,14 +2144,14 @@ class mxVertexHandler { } } } - }; + } /** * Function: drawPreview * * Redraws the preview. */ - drawPreview = () => { + drawPreview() { if (this.preview != null) { this.preview.bounds = this.bounds; @@ -2178,32 +2172,32 @@ class mxVertexHandler { this.selectionBorder.bounds = this.getSelectionBorderBounds(); this.selectionBorder.redraw(); this.updateParentHighlight(); - }; + } /** * Function: getSelectionBorderBounds * * Returns the bounds for the selection border. */ - getSelectionBorderBounds = () => { + getSelectionBorderBounds() { return this.bounds; - }; + } /** * Function: isDestroyed * * Returns true if this handler was destroyed or not initialized. */ - isDestroyed = () => { + isDestroyed() { return this.selectionBorder == null; - }; + } /** * Function: destroy * * Destroys the handler and all its resources and DOM nodes. */ - destroy = () => { + destroy() { if (this.escapeHandler != null) { this.state.view.graph.removeListener(this.escapeHandler); this.escapeHandler = null; @@ -2254,7 +2248,7 @@ class mxVertexHandler { this.customHandles = null; } - }; + } } export default mxVertexHandler; diff --git a/src/mxgraph/index.txt b/src/mxgraph/index.txt index 428c4b98e..27d600371 100644 --- a/src/mxgraph/index.txt +++ b/src/mxgraph/index.txt @@ -247,8 +247,7 @@ Functions: follows. (code) - isCellSelectable = (cell)=> - { + isCellSelectable(cell) { let selectable = isSelectable.apply(this, arguments); let geo = this.model.getGeometry(cell); @@ -263,8 +262,7 @@ Functions: superclass as follows, which is another way of �subclassing� in JavaScript. (code) - isCellSelectable = (cell)=> - { + isCellSelectable(cell) { let geo = this.model.getGeometry(cell); return selectable && (geo == null || @@ -280,8 +278,7 @@ Functions: representation of the graph model: (code) - getXml = ()=> - { + getXml() { let enc = new mxCodec(); return enc.encode(this.getModel()); } diff --git a/src/mxgraph/io/mxCellCodec.js b/src/mxgraph/io/mxCellCodec.js index 1badc811c..841efca1d 100644 --- a/src/mxgraph/io/mxCellCodec.js +++ b/src/mxgraph/io/mxCellCodec.js @@ -61,32 +61,32 @@ class mxCellCodec extends mxObjectCodec { * * Returns true since this is a cell codec. */ - isCellCodec = () => { + isCellCodec() { return true; - }; + } /** * Overidden to disable conversion of value to number. */ - isNumericAttribute = (dec, attr, obj) => { + isNumericAttribute(dec, attr, obj) { return ( attr.nodeName !== 'value' && super.isNumericAttribute(dec, attr, obj) ); - }; + } /** * Function: isExcluded * * Excludes user objects that are XML nodes. */ - isExcluded = (obj, attr, value, isWrite) => { + isExcluded(obj, attr, value, isWrite) { return ( super.isExcluded(obj, attr, value, isWrite) || (isWrite && attr === 'value' && value.nodeType === mxConstants.NODETYPE_ELEMENT) ); - }; + } /** * Function: afterEncode @@ -94,7 +94,7 @@ class mxCellCodec extends mxObjectCodec { * Encodes an and wraps the XML up inside the * XML of the user object (inversion). */ - afterEncode = (enc, obj, node) => { + afterEncode(enc, obj, node) { if ( obj.value != null && obj.value.nodeType === mxConstants.NODETYPE_ELEMENT @@ -114,7 +114,7 @@ class mxCellCodec extends mxObjectCodec { } return node; - }; + } /** * Function: beforeDecode @@ -122,7 +122,7 @@ class mxCellCodec extends mxObjectCodec { * Decodes an and uses the enclosing XML node as * the user object for the cell (inversion). */ - beforeDecode = (dec, node, obj) => { + beforeDecode(dec, node, obj) { let inner = node.cloneNode(true); const classname = this.getName(); @@ -180,7 +180,7 @@ class mxCellCodec extends mxObjectCodec { } return inner; - }; + } } mxCodecRegistry.register(new mxCellCodec()); diff --git a/src/mxgraph/io/mxChildChangeCodec.js b/src/mxgraph/io/mxChildChangeCodec.js index 38d9b8a17..9d4f9e275 100644 --- a/src/mxgraph/io/mxChildChangeCodec.js +++ b/src/mxgraph/io/mxChildChangeCodec.js @@ -43,20 +43,20 @@ class mxChildChangeCodec extends mxObjectCodec { * child as an attribute rather than a child node, in * which case it's always a reference. */ - isReference = (obj, attr, value, isWrite) => { + isReference(obj, attr, value, isWrite) { if (attr === 'child' && (!isWrite || obj.model.contains(obj.previous))) { return true; } return mxUtils.indexOf(this.idrefs, attr) >= 0; - }; + } /** * Function: isExcluded * * Excludes references to parent or previous if not in the model. */ - isExcluded = (obj, attr, value, write) => { + isExcluded(obj, attr, value, write) { return ( super.isExcluded(obj, attr, value, write) || (write && @@ -64,7 +64,7 @@ class mxChildChangeCodec extends mxObjectCodec { (attr === 'previous' || attr === 'parent') && !obj.model.contains(value)) ); - }; + } /** * Function: afterEncode @@ -72,7 +72,7 @@ class mxChildChangeCodec extends mxObjectCodec { * Encodes the child recusively and adds the result * to the given node. */ - afterEncode = (enc, obj, node) => { + afterEncode(enc, obj, node) { if (this.isReference(obj, 'child', obj.child, true)) { // Encodes as reference (id) node.setAttribute('child', enc.getId(obj.child)); @@ -86,7 +86,7 @@ class mxChildChangeCodec extends mxObjectCodec { } return node; - }; + } /** * Function: beforeDecode @@ -94,7 +94,7 @@ class mxChildChangeCodec extends mxObjectCodec { * Decodes the any child nodes as using the respective * codec from the registry. */ - beforeDecode = (dec, node, obj) => { + beforeDecode(dec, node, obj) { if ( node.firstChild != null && node.firstChild.nodeType === mxConstants.NODETYPE_ELEMENT @@ -134,14 +134,14 @@ class mxChildChangeCodec extends mxObjectCodec { } return node; - }; + } /** * Function: afterDecode * * Restores object state in the child change. */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { // Cells are decoded here after a complete transaction so the previous // parent must be restored on the cell for the case where the cell was // added. This is needed for the local model to identify the cell as a @@ -161,7 +161,7 @@ class mxChildChangeCodec extends mxObjectCodec { } return obj; - }; + } } mxCodecRegistry.register(new mxChildChangeCodec()); diff --git a/src/mxgraph/io/mxCodec.js b/src/mxgraph/io/mxCodec.js index 928fdf33b..aa59901f5 100644 --- a/src/mxgraph/io/mxCodec.js +++ b/src/mxgraph/io/mxCodec.js @@ -160,11 +160,11 @@ class mxCodec { * id - ID for the object to be associated with. * obj - Object to be associated with the ID. */ - putObject = (id, obj) => { + putObject(id, obj) { this.objects[id] = obj; return obj; - }; + } /** * Function: getObject @@ -174,7 +174,7 @@ class mxCodec { * object. If no object is found, then the element with the respective ID * from the document is parsed using . */ - getObject = id => { + getObject(id) { let obj = null; if (id != null) { @@ -194,7 +194,7 @@ class mxCodec { } return obj; - }; + } /** * Function: lookup @@ -216,9 +216,9 @@ class mxCodec { * * id - ID of the object to be returned. */ - lookup = id => { + lookup(id) { return null; - }; + } /** * Function: getElementById @@ -229,11 +229,11 @@ class mxCodec { * * id - String that contains the ID. */ - getElementById = id => { + getElementById(id) { this.updateElements(); return this.elements[id]; - }; + } /** * Function: updateElements @@ -244,7 +244,7 @@ class mxCodec { * * id - String that contains the ID. */ - updateElements = () => { + updateElements() { if (this.elements == null) { this.elements = {}; @@ -252,14 +252,14 @@ class mxCodec { this.addElement(this.document.documentElement); } } - }; + } /** * Function: addElement * * Adds the given element to if it has an ID. */ - addElement = node => { + addElement(node) { if (node.nodeType === mxConstants.NODETYPE_ELEMENT) { const id = node.getAttribute('id'); @@ -278,7 +278,7 @@ class mxCodec { this.addElement(node); node = node.nextSibling; } - }; + } /** * Function: getId @@ -293,7 +293,7 @@ class mxCodec { * * obj - Object to return the ID for. */ - getId = obj => { + getId(obj) { let id = null; if (obj != null) { @@ -314,7 +314,7 @@ class mxCodec { } return id; - }; + } /** * Function: reference @@ -337,9 +337,9 @@ class mxCodec { * * obj - Object whose ID should be returned. */ - reference = obj => { + reference(obj) { return null; - }; + } /** * Function: encode @@ -351,7 +351,7 @@ class mxCodec { * * obj - Object to be encoded. */ - encode = obj => { + encode(obj) { let node = null; if (obj != null && obj.constructor != null) { @@ -371,7 +371,7 @@ class mxCodec { } return node; - }; + } /** * Function: decode @@ -389,7 +389,7 @@ class mxCodec { * node - XML node to be decoded. * into - Optional object to be decodec into. */ - decode = (node, into) => { + decode(node, into) { this.updateElements(); let obj = null; @@ -413,7 +413,7 @@ class mxCodec { } return obj; - }; + } /** * Function: encodeCell @@ -435,7 +435,7 @@ class mxCodec { * includeChildren - Optional boolean indicating if the * function should include all descendents. Default is true. */ - encodeCell = (cell, node, includeChildren) => { + encodeCell(cell, node, includeChildren) { node.appendChild(this.encode(cell)); if (includeChildren == null || includeChildren) { @@ -445,7 +445,7 @@ class mxCodec { this.encodeCell(cell.getChildAt(i), node); } } - }; + } /** * Function: isCellCodec @@ -454,13 +454,13 @@ class mxCodec { * to check if the codec is of the * given type. */ - isCellCodec = codec => { + isCellCodec(codec) { if (codec != null && typeof codec.isCellCodec === 'function') { return codec.isCellCodec(); } return false; - }; + } /** * Function: decodeCell @@ -479,7 +479,7 @@ class mxCodec { * and insertEdge on the parent and terminals, respectively. * Default is true. */ - decodeCell = (node, restoreStructures) => { + decodeCell(node, restoreStructures) { restoreStructures = restoreStructures != null ? restoreStructures : true; let cell = null; @@ -513,14 +513,14 @@ class mxCodec { } return cell; - }; + } /** * Function: insertIntoGraph * * Inserts the given cell into its parent and terminal cells. */ - insertIntoGraph = cell => { + insertIntoGraph(cell) { const { parent } = cell; const source = cell.getTerminal(true); const target = cell.getTerminal(false); @@ -545,7 +545,7 @@ class mxCodec { if (target != null) { target.insertEdge(cell, false); } - }; + } /** * Function: setAttribute @@ -560,11 +560,11 @@ class mxCodec { * attributes - Attributename to be set. * value - New value of the attribute. */ - setAttribute = (node, attribute, value) => { + setAttribute(node, attribute, value) { if (attribute != null && value != null) { node.setAttribute(attribute, value); } - }; + } } export default mxCodec; diff --git a/src/mxgraph/io/mxDefaultKeyHandlerCodec.js b/src/mxgraph/io/mxDefaultKeyHandlerCodec.js index a4ac34ce8..2678a2731 100644 --- a/src/mxgraph/io/mxDefaultKeyHandlerCodec.js +++ b/src/mxgraph/io/mxDefaultKeyHandlerCodec.js @@ -26,9 +26,9 @@ class mxDefaultKeyHandlerCodec extends mxObjectCodec { * * Returns null. */ - encode = (enc, obj) => { + encode(enc, obj) { return null; - }; + } /** * Function: decode @@ -62,7 +62,7 @@ class mxDefaultKeyHandlerCodec extends mxObjectCodec { * See also: , * http://www.js-examples.com/page/tutorials__key_codes.html */ - decode = (dec, node, into) => { + decode(dec, node, into) { if (into != null) { const { editor } = into; node = node.firstChild; @@ -81,7 +81,7 @@ class mxDefaultKeyHandlerCodec extends mxObjectCodec { } return into; - }; + } } mxCodecRegistry.register(new mxDefaultKeyHandlerCodec()); diff --git a/src/mxgraph/io/mxDefaultPopupMenuCodec.js b/src/mxgraph/io/mxDefaultPopupMenuCodec.js index 95ff33661..aa2f7cbc2 100644 --- a/src/mxgraph/io/mxDefaultPopupMenuCodec.js +++ b/src/mxgraph/io/mxDefaultPopupMenuCodec.js @@ -28,16 +28,16 @@ class mxDefaultPopupMenuCodec extends mxObjectCodec { * * Returns null. */ - encode = (enc, obj) => { + encode(enc, obj) { return null; - }; + } /** * Function: decode * * Uses the given node as the config for . */ - decode = (dec, node, into) => { + decode(dec, node, into) { const inc = node.getElementsByTagName('include')[0]; if (inc != null) { @@ -47,7 +47,7 @@ class mxDefaultPopupMenuCodec extends mxObjectCodec { } return into; - }; + } } mxCodecRegistry.register(new mxDefaultPopupMenuCodec()); diff --git a/src/mxgraph/io/mxDefaultToolbarCodec.js b/src/mxgraph/io/mxDefaultToolbarCodec.js index cc690b8ba..e16443377 100644 --- a/src/mxgraph/io/mxDefaultToolbarCodec.js +++ b/src/mxgraph/io/mxDefaultToolbarCodec.js @@ -26,9 +26,9 @@ class mxDefaultToolbarCodec extends mxObjectCodec { * * Returns null. */ - encode = (enc, obj) => { + encode(enc, obj) { return null; - }; + } /** * Function: decode @@ -122,7 +122,7 @@ class mxDefaultToolbarCodec extends mxObjectCodec { * * (end) */ - decode = (dec, node, into) => { + decode(dec, node, into) { if (into != null) { const { editor } = into; node = node.firstChild; @@ -288,7 +288,7 @@ class mxDefaultToolbarCodec extends mxObjectCodec { } return into; - }; + } } mxCodecRegistry.register(new mxDefaultToolbarCodec()); diff --git a/src/mxgraph/io/mxEditorCodec.js b/src/mxgraph/io/mxEditorCodec.js index 8e1aa9497..e9bdadd7f 100644 --- a/src/mxgraph/io/mxEditorCodec.js +++ b/src/mxgraph/io/mxEditorCodec.js @@ -91,7 +91,7 @@ class mxEditorCodec extends mxObjectCodec { * * (end) */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { // Assigns the specified templates for edges const defaultEdge = node.getAttribute('defaultEdge'); @@ -109,14 +109,14 @@ class mxEditorCodec extends mxObjectCodec { } return obj; - }; + } /** * Function: decodeChild * * Overrides decode child to handle special child nodes. */ - decodeChild = (dec, child, obj) => { + decodeChild(dec, child, obj) { if (child.nodeName === 'Array') { const role = child.getAttribute('as'); @@ -130,14 +130,14 @@ class mxEditorCodec extends mxObjectCodec { } super.decodeChild.apply(this, [dec, child, obj]); - }; + } /** * Function: decodeUi * * Decodes the ui elements from the given node. */ - decodeUi = (dec, node, editor) => { + decodeUi(dec, node, editor) { let tmp = node.firstChild; while (tmp != null) { if (tmp.nodeName === 'add') { @@ -195,14 +195,14 @@ class mxEditorCodec extends mxObjectCodec { tmp = tmp.nextSibling; } - }; + } /** * Function: decodeTemplates * * Decodes the cells from the given node as templates. */ - decodeTemplates = (dec, node, editor) => { + decodeTemplates(dec, node, editor) { if (editor.templates == null) { editor.templates = []; } @@ -225,7 +225,7 @@ class mxEditorCodec extends mxObjectCodec { editor.templates[name] = dec.decodeCell(child); } } - }; + } } mxCodecRegistry.register(new mxEditorCodec()); diff --git a/src/mxgraph/io/mxGenericChangeCodec.js b/src/mxgraph/io/mxGenericChangeCodec.js index b6f2be6b0..c3fa81616 100644 --- a/src/mxgraph/io/mxGenericChangeCodec.js +++ b/src/mxgraph/io/mxGenericChangeCodec.js @@ -51,7 +51,7 @@ class mxGenericChangeCodec extends mxObjectCodec { * * Restores the state by assigning the previous value. */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { // Allows forward references in sessions. This is a workaround // for the sequence of edits in mxGraph.moveCells and cellsAdded. if (mxUtils.isNode(obj.cell)) { @@ -60,7 +60,7 @@ class mxGenericChangeCodec extends mxObjectCodec { obj.previous = obj[this.variable]; return obj; - }; + } } // Registers the codecs diff --git a/src/mxgraph/io/mxGraphViewCodec.js b/src/mxgraph/io/mxGraphViewCodec.js index fc8d43c77..5d14a0efb 100644 --- a/src/mxgraph/io/mxGraphViewCodec.js +++ b/src/mxgraph/io/mxGraphViewCodec.js @@ -30,9 +30,9 @@ class mxGraphViewCodec extends mxObjectCodec { * starting at the model's root. This returns the * top-level graph node of the recursive encoding. */ - encode = (enc, view) => { + encode(enc, view) { return this.encodeCell(enc, view, view.graph.getModel().getRoot()); - }; + } /** * Function: encodeCell @@ -54,7 +54,7 @@ class mxGraphViewCodec extends mxObjectCodec { * values from the cell style are added as attribute * values to the node. */ - encodeCell = (enc, view, cell) => { + encodeCell(enc, view, cell) { const model = view.graph.getModel(); const state = view.getState(cell); const parent = model.getParent(cell); @@ -167,7 +167,7 @@ class mxGraphViewCodec extends mxObjectCodec { } } return node; - }; + } } mxCodecRegistry.register(new mxGraphViewCodec()); diff --git a/src/mxgraph/io/mxModelCodec.js b/src/mxgraph/io/mxModelCodec.js index b805c1280..cd742f2cf 100644 --- a/src/mxgraph/io/mxModelCodec.js +++ b/src/mxgraph/io/mxModelCodec.js @@ -27,24 +27,24 @@ class mxModelCodec extends mxObjectCodec { * cell nodes as produced by the . The sequence is * wrapped-up in a node with the name root. */ - encodeObject = (enc, obj, node) => { + encodeObject(enc, obj, node) { const rootNode = enc.document.createElement('root'); enc.encodeCell(obj.getRoot(), rootNode); node.appendChild(rootNode); - }; + } /** * Function: decodeChild * * Overrides decode child to handle special child nodes. */ - decodeChild = (dec, child, obj) => { + decodeChild(dec, child, obj) { if (child.nodeName === 'root') { this.decodeRoot(dec, child, obj); } else { decodeChild.apply(this, [dec, child, obj]); } - }; + } /** * Function: decodeRoot @@ -52,7 +52,7 @@ class mxModelCodec extends mxObjectCodec { * Reads the cells into the graph model. All cells * are children of the root element in the node. */ - decodeRoot = (dec, root, model) => { + decodeRoot(dec, root, model) { let rootCell = null; let tmp = root.firstChild; @@ -70,7 +70,7 @@ class mxModelCodec extends mxObjectCodec { if (rootCell != null) { model.setRoot(rootCell); } - }; + } } mxCodecRegistry.register(new mxModelCodec()); diff --git a/src/mxgraph/io/mxObjectCodec.js b/src/mxgraph/io/mxObjectCodec.js index 98faff85c..0c2fcb1fb 100644 --- a/src/mxgraph/io/mxObjectCodec.js +++ b/src/mxgraph/io/mxObjectCodec.js @@ -269,18 +269,18 @@ class mxObjectCodec { * if that is different than what this returns. The default implementation * returns the classname of the template class. */ - getName = () => { + getName() { return mxUtils.getFunctionName(this.template.constructor); - }; + } /** * Function: cloneTemplate * * Returns a new instance of the template for this codec. */ - cloneTemplate = () => { + cloneTemplate() { return new this.template.constructor(); - }; + } /** * Function: getFieldName @@ -290,7 +290,7 @@ class mxObjectCodec { * the input if there is no reverse mapping for the * given name. */ - getFieldName = attributename => { + getFieldName(attributename) { if (attributename != null) { const mapped = this.reverse[attributename]; @@ -300,7 +300,7 @@ class mxObjectCodec { } return attributename; - }; + } /** * Function: getAttributeName @@ -310,7 +310,7 @@ class mxObjectCodec { * the input if there is no mapping for the * given name. */ - getAttributeName = fieldname => { + getAttributeName(fieldname) { if (fieldname != null) { const mapped = this.mapping[fieldname]; @@ -320,7 +320,7 @@ class mxObjectCodec { } return fieldname; - }; + } /** * Function: isExcluded @@ -337,12 +337,12 @@ class mxObjectCodec { * write - Boolean indicating if the field is being encoded or decoded. * Write is true if the field is being encoded, else it is being decoded. */ - isExcluded = (obj, attr, value, write) => { + isExcluded(obj, attr, value, write) { return ( attr == mxObjectIdentity.FIELD_NAME || mxUtils.indexOf(this.exclude, attr) >= 0 ); - }; + } /** * Function: isReference @@ -359,9 +359,9 @@ class mxObjectCodec { * write - Boolean indicating if the field is being encoded or decoded. * Write is true if the field is being encoded, else it is being decoded. */ - isReference = (obj, attr, value, write) => { + isReference(obj, attr, value, write) { return mxUtils.indexOf(this.idrefs, attr) >= 0; - }; + } /** * Function: encode @@ -405,14 +405,14 @@ class mxObjectCodec { * enc - that controls the encoding process. * obj - Object to be encoded. */ - encode = (enc, obj) => { + encode(enc, obj) { const node = enc.document.createElement(this.getName()); obj = this.beforeEncode(enc, obj, node); this.encodeObject(enc, obj, node); return this.afterEncode(enc, obj, node); - }; + } /** * Function: encodeObject @@ -426,7 +426,7 @@ class mxObjectCodec { * obj - Object to be encoded. * node - XML node that contains the encoded object. */ - encodeObject = (enc, obj, node) => { + encodeObject(enc, obj, node) { enc.setAttribute(node, 'id', enc.getId(obj)); for (const i in obj) { @@ -441,7 +441,7 @@ class mxObjectCodec { this.encodeValue(enc, obj, name, value, node); } } - }; + } /** * Function: encodeValue @@ -458,7 +458,7 @@ class mxObjectCodec { * value - Value of the property to be encoded. * node - XML node that contains the encoded object. */ - encodeValue = (enc, obj, name, value, node) => { + encodeValue(enc, obj, name, value, node) { if (value != null) { if (this.isReference(obj, name, value, true)) { const tmp = enc.getId(value); @@ -482,7 +482,7 @@ class mxObjectCodec { this.writeAttribute(enc, obj, name, value, node); } } - }; + } /** * Function: writeAttribute @@ -490,20 +490,20 @@ class mxObjectCodec { * Writes the given value into node using * or depending on the type of the value. */ - writeAttribute = (enc, obj, name, value, node) => { + writeAttribute(enc, obj, name, value, node) { if (typeof value !== 'object' /* primitive type */) { this.writePrimitiveAttribute(enc, obj, name, value, node); } /* complex type */ else { this.writeComplexAttribute(enc, obj, name, value, node); } - }; + } /** * Function: writePrimitiveAttribute * * Writes the given value as an attribute of the given node. */ - writePrimitiveAttribute = (enc, obj, name, value, node) => { + writePrimitiveAttribute(enc, obj, name, value, node) { value = this.convertAttributeToXml(enc, obj, name, value, node); if (name == null) { @@ -519,14 +519,14 @@ class mxObjectCodec { } else if (typeof value !== 'function') { enc.setAttribute(node, name, value); } - }; + } /** * Function: writeComplexAttribute * * Writes the given value as a child node of the given node. */ - writeComplexAttribute = (enc, obj, name, value, node) => { + writeComplexAttribute(enc, obj, name, value, node) { const child = enc.encode(value); if (child != null) { @@ -540,7 +540,7 @@ class mxObjectCodec { `mxObjectCodec.encode: No node for ${this.getName()}.${name}: ${value}` ); } - }; + } /** * Function: convertAttributeToXml @@ -555,7 +555,7 @@ class mxObjectCodec { * name - Name of the attribute to be converted. * value - Value to be converted. */ - convertAttributeToXml = (enc, obj, name, value) => { + convertAttributeToXml(enc, obj, name, value) { // Makes sure to encode boolean values as numeric values if (this.isBooleanAttribute(enc, obj, name, value)) { // Checks if the value is true (do not use the value as is, because @@ -564,7 +564,7 @@ class mxObjectCodec { } return value; - }; + } /** * Function: isBooleanAttribute @@ -578,11 +578,11 @@ class mxObjectCodec { * name - Name of the attribute to be converted. * value - Value of the attribute to be converted. */ - isBooleanAttribute = (enc, obj, name, value) => { + isBooleanAttribute(enc, obj, name, value) { return ( typeof value.length === 'undefined' && (value == true || value == false) ); - }; + } /** * Function: convertAttributeFromXml @@ -596,7 +596,7 @@ class mxObjectCodec { * attr - XML attribute to be converted. * obj - Objec to convert the attribute for. */ - convertAttributeFromXml = (dec, attr, obj) => { + convertAttributeFromXml(dec, attr, obj) { let { value } = attr; if (this.isNumericAttribute(dec, attr, obj)) { @@ -608,7 +608,7 @@ class mxObjectCodec { } return value; - }; + } /** * Function: isNumericAttribute @@ -621,7 +621,7 @@ class mxObjectCodec { * attr - XML attribute to be converted. * obj - Objec to convert the attribute for. */ - isNumericAttribute = (dec, attr, obj) => { + isNumericAttribute(dec, attr, obj) { // Handles known numeric attributes for generic objects const result = (obj.constructor === mxGeometry && @@ -634,7 +634,7 @@ class mxObjectCodec { mxUtils.isNumeric(attr.value); return result; - }; + } /** * Function: beforeEncode @@ -650,9 +650,9 @@ class mxObjectCodec { * obj - Object to be encoded. * node - XML node to encode the object into. */ - beforeEncode = (enc, obj, node) => { + beforeEncode(enc, obj, node) { return obj; - }; + } /** * Function: afterEncode @@ -669,9 +669,9 @@ class mxObjectCodec { * obj - Object to be encoded. * node - XML node that represents the default encoding. */ - afterEncode = (enc, obj, node) => { + afterEncode(enc, obj, node) { return node; - }; + } /** * Function: decode @@ -727,7 +727,7 @@ class mxObjectCodec { * node - XML node to be decoded. * into - Optional objec to encode the node into. */ - decode = (dec, node, into) => { + decode(dec, node, into) { const id = node.getAttribute('id'); let obj = dec.objects[id]; @@ -743,7 +743,7 @@ class mxObjectCodec { this.decodeNode(dec, node, obj); return this.afterDecode(dec, node, obj); - }; + } /** * Function: decodeNode @@ -756,12 +756,12 @@ class mxObjectCodec { * node - XML node to be decoded. * obj - Objec to encode the node into. */ - decodeNode = (dec, node, obj) => { + decodeNode(dec, node, obj) { if (node != null) { this.decodeAttributes(dec, node, obj); this.decodeChildren(dec, node, obj); } - }; + } /** * Function: decodeAttributes @@ -774,7 +774,7 @@ class mxObjectCodec { * node - XML node to be decoded. * obj - Objec to encode the node into. */ - decodeAttributes = (dec, node, obj) => { + decodeAttributes(dec, node, obj) { const attrs = node.attributes; if (attrs != null) { @@ -782,7 +782,7 @@ class mxObjectCodec { this.decodeAttribute(dec, attrs[i], obj); } } - }; + } /** * Function: isIgnoredAttribute @@ -796,9 +796,9 @@ class mxObjectCodec { * attr - XML attribute to be decoded. * obj - Objec to encode the attribute into. */ - isIgnoredAttribute = (dec, attr, obj) => { + isIgnoredAttribute(dec, attr, obj) { return attr.nodeName === 'as' || attr.nodeName === 'id'; - }; + } /** * Function: decodeAttribute @@ -811,7 +811,7 @@ class mxObjectCodec { * attr - XML attribute to be decoded. * obj - Objec to encode the attribute into. */ - decodeAttribute = (dec, attr, obj) => { + decodeAttribute(dec, attr, obj) { if (!this.isIgnoredAttribute(dec, attr, obj)) { const name = attr.nodeName; @@ -840,7 +840,7 @@ class mxObjectCodec { obj[name] = value; } } - }; + } /** * Function: decodeChildren @@ -853,7 +853,7 @@ class mxObjectCodec { * node - XML node to be decoded. * obj - Objec to encode the node into. */ - decodeChildren = (dec, node, obj) => { + decodeChildren(dec, node, obj) { let child = node.firstChild; while (child != null) { @@ -868,7 +868,7 @@ class mxObjectCodec { child = tmp; } - }; + } /** * Function: decodeChild @@ -881,7 +881,7 @@ class mxObjectCodec { * child - XML child element to be decoded. * obj - Objec to encode the node into. */ - decodeChild = (dec, child, obj) => { + decodeChild(dec, child, obj) { const fieldname = this.getFieldName(child.getAttribute('as')); if (fieldname == null || !this.isExcluded(obj, fieldname, child, false)) { @@ -904,7 +904,7 @@ class mxObjectCodec { throw new Error(`${e.message} for ${child.nodeName}`); } } - }; + } /** * Function: getFieldTemplate @@ -916,7 +916,7 @@ class mxObjectCodec { * required to override this to return the correct collection instance * based on the encoded child. */ - getFieldTemplate = (obj, fieldname, child) => { + getFieldTemplate(obj, fieldname, child) { let template = obj[fieldname]; // Non-empty arrays are replaced completely @@ -925,7 +925,7 @@ class mxObjectCodec { } return template; - }; + } /** * Function: addObjectValue @@ -937,7 +937,7 @@ class mxObjectCodec { * collection. For strongly typed languages it may be required to * override this with the correct code to add an entry to an object. */ - addObjectValue = (obj, fieldname, value, template) => { + addObjectValue(obj, fieldname, value, template) { if (value != null && value !== template) { if (fieldname != null && fieldname.length > 0) { obj[fieldname] = value; @@ -946,7 +946,7 @@ class mxObjectCodec { } // mxLog.debug('Decoded '+mxUtils.getFunctionName(obj.constructor)+'.'+fieldname+': '+value); } - }; + } /** * Function: processInclude @@ -961,7 +961,7 @@ class mxObjectCodec { * node - XML node to be checked. * into - Optional object to pass-thru to the codec. */ - processInclude = (dec, node, into) => { + processInclude(dec, node, into) { if (node.nodeName === 'include') { const name = node.getAttribute('name'); @@ -981,7 +981,7 @@ class mxObjectCodec { } return false; - }; + } /** * Function: beforeDecode @@ -1001,9 +1001,9 @@ class mxObjectCodec { * node - XML node to be decoded. * obj - Object to encode the node into. */ - beforeDecode = (dec, node, obj) => { + beforeDecode(dec, node, obj) { return node; - }; + } /** * Function: afterDecode @@ -1019,9 +1019,9 @@ class mxObjectCodec { * node - XML node to be decoded. * obj - Object that represents the default decoding. */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { return obj; - }; + } } export default mxObjectCodec; diff --git a/src/mxgraph/io/mxRootChangeCodec.js b/src/mxgraph/io/mxRootChangeCodec.js index b620b706e..7c902e222 100644 --- a/src/mxgraph/io/mxRootChangeCodec.js +++ b/src/mxgraph/io/mxRootChangeCodec.js @@ -4,7 +4,7 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxRootChange from 'FIXME'; +import mxRootChange from '../model/atomic_changes/mxRootChange'; import mxCodecRegistry from './mxCodecRegistry'; class mxRootChangeCodec extends mxObjectCodec { @@ -30,11 +30,11 @@ class mxRootChangeCodec extends mxObjectCodec { * * Encodes the child recursively. */ - afterEncode = (enc, obj, node) => { + afterEncode(enc, obj, node) { enc.encodeCell(obj.root, node); return node; - }; + } /** * Function: beforeDecode @@ -42,7 +42,7 @@ class mxRootChangeCodec extends mxObjectCodec { * Decodes the optional children as cells * using the respective decoder. */ - beforeDecode = (dec, node, obj) => { + beforeDecode(dec, node, obj) { if ( node.firstChild != null && node.firstChild.nodeType === mxConstants.NODETYPE_ELEMENT @@ -66,18 +66,18 @@ class mxRootChangeCodec extends mxObjectCodec { } return node; - }; + } /** * Function: afterDecode * * Restores the state by assigning the previous value. */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { obj.previous = obj.root; return obj; - }; + } } mxCodecRegistry.register(new mxRootChangeCodec()); diff --git a/src/mxgraph/io/mxStylesheetCodec.js b/src/mxgraph/io/mxStylesheetCodec.js index 5089fed67..84afa944e 100644 --- a/src/mxgraph/io/mxStylesheetCodec.js +++ b/src/mxgraph/io/mxStylesheetCodec.js @@ -35,7 +35,7 @@ class mxStylesheetCodec extends mxObjectCodec { * Encodes a stylesheet. See for a description of the * format. */ - encode = (enc, obj) => { + encode(enc, obj) { const node = enc.document.createElement(this.getName()); for (const i in obj.styles) { @@ -63,14 +63,14 @@ class mxStylesheetCodec extends mxObjectCodec { } return node; - }; + } /** * Function: getStringValue * * Returns the string for encoding the given value. */ - getStringValue = (key, value) => { + getStringValue(key, value) { const type = typeof value; if (type === 'function') { @@ -80,7 +80,7 @@ class mxStylesheetCodec extends mxObjectCodec { } return value; - }; + } /** * Function: decode @@ -123,7 +123,7 @@ class mxStylesheetCodec extends mxObjectCodec { * * (end) */ - decode = (dec, node, into) => { + decode(dec, node, into) { const obj = into || new this.template.constructor(); const id = node.getAttribute('id'); @@ -194,7 +194,7 @@ class mxStylesheetCodec extends mxObjectCodec { } return obj; - }; + } } mxCodecRegistry.register(new mxStylesheetCodec()); diff --git a/src/mxgraph/io/mxTerminalChangeCodec.js b/src/mxgraph/io/mxTerminalChangeCodec.js index 9956e7a1e..2759ce49b 100644 --- a/src/mxgraph/io/mxTerminalChangeCodec.js +++ b/src/mxgraph/io/mxTerminalChangeCodec.js @@ -34,11 +34,11 @@ class mxTerminalChangeCodec extends mxObjectCodec { * * Restores the state by assigning the previous value. */ - afterDecode = (dec, node, obj) => { + afterDecode(dec, node, obj) { obj.previous = obj.terminal; return obj; - }; + } } mxCodecRegistry.register(new mxTerminalChangeCodec()); diff --git a/src/mxgraph/layout/WeightedCellSorter.js b/src/mxgraph/layout/WeightedCellSorter.js index 859149913..42a900de9 100644 --- a/src/mxgraph/layout/WeightedCellSorter.js +++ b/src/mxgraph/layout/WeightedCellSorter.js @@ -55,7 +55,7 @@ class WeightedCellSorter { * * Compares two WeightedCellSorters. */ - compare = (a, b) => { + compare(a, b) { if (a != null && b != null) { if (b.weightedValue > a.weightedValue) { return -1; @@ -69,7 +69,7 @@ class WeightedCellSorter { return 1; } return 0; - }; + } } export default WeightedCellSorter; diff --git a/src/mxgraph/layout/hierarchical/model/mxGraphAbstractHierarchyCell.js b/src/mxgraph/layout/hierarchical/model/mxGraphAbstractHierarchyCell.js index 998b91cf4..cb86eb9c6 100644 --- a/src/mxgraph/layout/hierarchical/model/mxGraphAbstractHierarchyCell.js +++ b/src/mxgraph/layout/hierarchical/model/mxGraphAbstractHierarchyCell.js @@ -93,74 +93,74 @@ class mxGraphAbstractHierarchyCell { * * Returns the cells this cell connects to on the next layer up */ - getNextLayerConnectedCells = layer => { + getNextLayerConnectedCells(layer) { return null; - }; + } /** * Function: getPreviousLayerConnectedCells * * Returns the cells this cell connects to on the next layer down */ - getPreviousLayerConnectedCells = layer => { + getPreviousLayerConnectedCells(layer) { return null; - }; + } /** * Function: isEdge * * Returns whether or not this cell is an edge */ - isEdge = () => { + isEdge() { return false; - }; + } /** * Function: isVertex * * Returns whether or not this cell is a node */ - isVertex = () => { + isVertex() { return false; - }; + } /** * Function: getGeneralPurposeVariable * * Gets the value of temp for the specified layer */ - getGeneralPurposeVariable = layer => { + getGeneralPurposeVariable(layer) { return null; - }; + } /** * Function: setGeneralPurposeVariable * * Set the value of temp for the specified layer */ - setGeneralPurposeVariable = (layer, value) => { + setGeneralPurposeVariable(layer, value) { return null; - }; + } /** * Function: setX * * Set the value of x for the specified layer */ - setX = (layer, value) => { + setX(layer, value) { if (this.isVertex()) { this.x[0] = value; } else if (this.isEdge()) { this.x[layer - this.minRank - 1] = value; } - }; + } /** * Function: getX * * Gets the value of x on the specified layer */ - getX = layer => { + getX(layer) { if (this.isVertex()) { return this.x[0]; } @@ -169,20 +169,20 @@ class mxGraphAbstractHierarchyCell { } return 0.0; - }; + } /** * Function: setY * * Set the value of y for the specified layer */ - setY = (layer, value) => { + setY(layer, value) { if (this.isVertex()) { this.y[0] = value; } else if (this.isEdge()) { this.y[layer - this.minRank - 1] = value; } - }; + } } export default mxGraphAbstractHierarchyCell; diff --git a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyEdge.js b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyEdge.js index 072d9f542..b4522f647 100644 --- a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyEdge.js +++ b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyEdge.js @@ -3,8 +3,8 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphAbstractHierarchyCell from "./mxGraphAbstractHierarchyCell"; -import mxObjectIdentity from "../../../util/mxObjectIdentity"; +import mxGraphAbstractHierarchyCell from './mxGraphAbstractHierarchyCell'; +import mxObjectIdentity from '../../../util/mxObjectIdentity'; class mxGraphHierarchyEdge extends mxGraphAbstractHierarchyCell { /** @@ -72,19 +72,19 @@ class mxGraphHierarchyEdge extends mxGraphAbstractHierarchyCell { * * Inverts the direction of this internal edge(s) */ - invert = layer => { + invert(layer) { const temp = this.source; this.source = this.target; this.target = temp; this.isReversed = !this.isReversed; - }; + } /** * Function: getNextLayerConnectedCells * * Returns the cells this cell connects to on the next layer up */ - getNextLayerConnectedCells = layer => { + getNextLayerConnectedCells(layer) { if (this.nextLayerConnectedCells == null) { this.nextLayerConnectedCells = []; @@ -100,14 +100,14 @@ class mxGraphHierarchyEdge extends mxGraphAbstractHierarchyCell { } return this.nextLayerConnectedCells[layer - this.minRank - 1]; - }; + } /** * Function: getPreviousLayerConnectedCells * * Returns the cells this cell connects to on the next layer down */ - getPreviousLayerConnectedCells = layer => { + getPreviousLayerConnectedCells(layer) { if (this.previousLayerConnectedCells == null) { this.previousLayerConnectedCells = []; @@ -123,47 +123,47 @@ class mxGraphHierarchyEdge extends mxGraphAbstractHierarchyCell { } return this.previousLayerConnectedCells[layer - this.minRank - 1]; - }; + } /** * Function: isEdge * * Returns true. */ - isEdge = () => { + isEdge() { return true; - }; + } /** * Function: getGeneralPurposeVariable * * Gets the value of temp for the specified layer */ - getGeneralPurposeVariable = layer => { + getGeneralPurposeVariable(layer) { return this.temp[layer - this.minRank - 1]; - }; + } /** * Function: setGeneralPurposeVariable * * Set the value of temp for the specified layer */ - setGeneralPurposeVariable = (layer, value) => { + setGeneralPurposeVariable(layer, value) { this.temp[layer - this.minRank - 1] = value; - }; + } /** * Function: getCoreCell * * Gets the first core edge associated with this wrapper */ - getCoreCell = () => { + getCoreCell() { if (this.edges != null && this.edges.length > 0) { return this.edges[0]; } return null; - }; + } } export default mxGraphHierarchyEdge; diff --git a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyModel.js b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyModel.js index c445fc148..6c968e0e5 100644 --- a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyModel.js +++ b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyModel.js @@ -4,7 +4,7 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxDictionary from "../../../util/mxDictionary"; +import mxDictionary from '../../../util/mxDictionary'; class mxGraphHierarchyModel { /** @@ -186,7 +186,7 @@ class mxGraphHierarchyModel { * internalVertices - The array of to have their * information filled in using the real vertices. */ - createInternalCells = (layout, vertices, internalVertices) => { + createInternalCells(layout, vertices, internalVertices) { const graph = layout.getGraph(); // Create internal edges @@ -270,7 +270,7 @@ class mxGraphHierarchyModel { // Ensure temp variable is cleared from any previous use internalVertices[i].temp[0] = 0; } - }; + } /** * Function: initialRank @@ -279,7 +279,7 @@ class mxGraphHierarchyModel { * or sinks and working through each node in the relevant edge direction. * Starting at the sinks is basically a longest path layering algorithm. */ - initialRank = () => { + initialRank() { const startNodes = []; if (this.roots != null) { @@ -404,7 +404,7 @@ class mxGraphHierarchyModel { // Reset the maxRank to that which would be expected for a from-sink // scan this.maxRank = this.SOURCESCANSTARTRANK - this.maxRank; - }; + } /** * Function: fixRanks @@ -412,7 +412,7 @@ class mxGraphHierarchyModel { * Fixes the layer assignments to the values stored in the nodes. Also needs * to create dummy nodes for edges that cross layers. */ - fixRanks = () => { + fixRanks() { const rankList = []; this.ranks = []; @@ -472,7 +472,7 @@ class mxGraphHierarchyModel { false, null ); - }; + } /** * Function: visit @@ -485,7 +485,7 @@ class mxGraphHierarchyModel { * trackAncestors - Whether or not the search is to keep track all nodes * directly above this one in the search path. */ - visit = (visitor, dfsRoots, trackAncestors, seenNodes) => { + visit(visitor, dfsRoots, trackAncestors, seenNodes) { // Run dfs through on all roots if (dfsRoots != null) { for (let i = 0; i < dfsRoots.length; i += 1) { @@ -519,7 +519,7 @@ class mxGraphHierarchyModel { this.dfsCount++; } - }; + } /** * Function: dfs @@ -537,7 +537,7 @@ class mxGraphHierarchyModel { * ancestor node of the current node * layer - the layer on the dfs tree ( not the same as the model ranks ) */ - dfs = (parent, root, connectingEdge, visitor, seen, layer) => { + dfs(parent, root, connectingEdge, visitor, seen, layer) { if (root != null) { const rootId = root.id; @@ -561,7 +561,7 @@ class mxGraphHierarchyModel { visitor(parent, root, connectingEdge, layer, 1); } } - }; + } /** * Function: extendedDfs @@ -583,7 +583,7 @@ class mxGraphHierarchyModel { * childHash - the new hash code for this node * layer - the layer on the dfs tree ( not the same as the model ranks ) */ - extendedDfs = ( + extendedDfs( parent, root, connectingEdge, @@ -592,7 +592,7 @@ class mxGraphHierarchyModel { ancestors, childHash, layer - ) => { + ) { // Explanation of custom hash set. Previously, the ancestors variable // was passed through the dfs as a HashSet. The ancestors were copied // into a new HashSet and when the new child was processed it was also @@ -658,7 +658,7 @@ class mxGraphHierarchyModel { visitor(parent, root, connectingEdge, layer, 1); } } - }; + } } export default mxGraphHierarchyModel; diff --git a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyNode.js b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyNode.js index 569ae725e..13fc28f85 100644 --- a/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyNode.js +++ b/src/mxgraph/layout/hierarchical/model/mxGraphHierarchyNode.js @@ -3,8 +3,8 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphAbstractHierarchyCell from "./mxGraphAbstractHierarchyCell"; -import mxObjectIdentity from "../../../util/mxObjectIdentity"; +import mxGraphAbstractHierarchyCell from './mxGraphAbstractHierarchyCell'; +import mxObjectIdentity from '../../../util/mxObjectIdentity'; class mxGraphHierarchyNode extends mxGraphAbstractHierarchyCell { /** @@ -69,16 +69,16 @@ class mxGraphHierarchyNode extends mxGraphAbstractHierarchyCell { * * Returns the integer value of the layer that this node resides in */ - getRankValue = layer => { + getRankValue(layer) { return this.maxRank; - }; + } /** * Function: getNextLayerConnectedCells * * Returns the cells this cell connects to on the next layer up */ - getNextLayerConnectedCells = layer => { + getNextLayerConnectedCells(layer) { if (this.nextLayerConnectedCells == null) { this.nextLayerConnectedCells = []; this.nextLayerConnectedCells[0] = []; @@ -98,14 +98,14 @@ class mxGraphHierarchyNode extends mxGraphAbstractHierarchyCell { } return this.nextLayerConnectedCells[0]; - }; + } /** * Function: getPreviousLayerConnectedCells * * Returns the cells this cell connects to on the next layer down */ - getPreviousLayerConnectedCells = layer => { + getPreviousLayerConnectedCells(layer) { if (this.previousLayerConnectedCells == null) { this.previousLayerConnectedCells = []; this.previousLayerConnectedCells[0] = []; @@ -124,39 +124,39 @@ class mxGraphHierarchyNode extends mxGraphAbstractHierarchyCell { } return this.previousLayerConnectedCells[0]; - }; + } /** * Function: isVertex * * Returns true. */ - isVertex = () => { + isVertex() { return true; - }; + } /** * Function: getGeneralPurposeVariable * * Gets the value of temp for the specified layer */ - getGeneralPurposeVariable = layer => { + getGeneralPurposeVariable(layer) { return this.temp[0]; - }; + } /** * Function: setGeneralPurposeVariable * * Set the value of temp for the specified layer */ - setGeneralPurposeVariable = (layer, value) => { + setGeneralPurposeVariable(layer, value) { this.temp[0] = value; - }; + } /** * Function: isAncestor */ - isAncestor = otherNode => { + isAncestor(otherNode) { // Firstly, the hash code of this node needs to be shorter than the // other node if ( @@ -187,16 +187,16 @@ class mxGraphHierarchyNode extends mxGraphAbstractHierarchyCell { } return false; - }; + } /** * Function: getCoreCell * * Gets the core vertex associated with this wrapper */ - getCoreCell = () => { + getCoreCell() { return this.cell; - }; + } } export default mxGraphHierarchyNode; diff --git a/src/mxgraph/layout/hierarchical/model/mxSwimlaneModel.js b/src/mxgraph/layout/hierarchical/model/mxSwimlaneModel.js index 1b267ec44..28b17e242 100644 --- a/src/mxgraph/layout/hierarchical/model/mxSwimlaneModel.js +++ b/src/mxgraph/layout/hierarchical/model/mxSwimlaneModel.js @@ -3,10 +3,10 @@ * Copyright (c) 2006-2018, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxUtils from "../../../util/mxUtils"; -import mxGraphHierarchyNode from "./mxGraphHierarchyNode"; -import mxGraphHierarchyEdge from "./mxGraphHierarchyEdge"; -import mxCellPath from "../../../model/mxCellPath"; +import mxUtils from '../../../util/mxUtils'; +import mxGraphHierarchyNode from './mxGraphHierarchyNode'; +import mxGraphHierarchyEdge from './mxGraphHierarchyEdge'; +import mxCellPath from '../../../model/mxCellPath'; class mxSwimlaneModel { /** @@ -195,7 +195,7 @@ class mxSwimlaneModel { * internalVertices - The array of to have their * information filled in using the real vertices. */ - createInternalCells = (layout, vertices, internalVertices) => { + createInternalCells(layout, vertices, internalVertices) { const graph = layout.getGraph(); const { swimlanes } = layout; @@ -288,7 +288,7 @@ class mxSwimlaneModel { // Ensure temp variable is cleared from any previous use internalVertices[i].temp[0] = 0; } - }; + } /** * Function: initialRank @@ -297,7 +297,7 @@ class mxSwimlaneModel { * or sinks and working through each node in the relevant edge direction. * Starting at the sinks is basically a longest path layering algorithm. */ - initialRank = () => { + initialRank() { this.ranksPerGroup = []; const startNodes = []; @@ -446,7 +446,7 @@ class mxSwimlaneModel { // currentMaxLayer = internalNode.temp[0]; // } // } - }; + } /** * Function: maxChainDfs @@ -466,7 +466,7 @@ class mxSwimlaneModel { * chainCount - the number of edges in the chain of vertices going through * the current swimlane */ - maxChainDfs = (parent, root, connectingEdge, seen, chainCount) => { + maxChainDfs(parent, root, connectingEdge, seen, chainCount) { if (root != null) { const rootId = mxCellPath.create(root.cell); @@ -511,7 +511,7 @@ class mxSwimlaneModel { } } } - }; + } /** * Function: fixRanks @@ -519,7 +519,7 @@ class mxSwimlaneModel { * Fixes the layer assignments to the values stored in the nodes. Also needs * to create dummy nodes for edges that cross layers. */ - fixRanks = () => { + fixRanks() { const rankList = []; this.ranks = []; @@ -579,7 +579,7 @@ class mxSwimlaneModel { false, null ); - }; + } /** * Function: visit @@ -592,7 +592,7 @@ class mxSwimlaneModel { * trackAncestors - Whether or not the search is to keep track all nodes * directly above this one in the search path. */ - visit = (visitor, dfsRoots, trackAncestors, seenNodes) => { + visit(visitor, dfsRoots, trackAncestors, seenNodes) { // Run dfs through on all roots if (dfsRoots != null) { for (let i = 0; i < dfsRoots.length; i += 1) { @@ -626,7 +626,7 @@ class mxSwimlaneModel { this.dfsCount += 1; } - }; + } /** * Function: dfs @@ -644,7 +644,7 @@ class mxSwimlaneModel { * ancestor node of the current node * layer - the layer on the dfs tree ( not the same as the model ranks ) */ - dfs = (parent, root, connectingEdge, visitor, seen, layer) => { + dfs(parent, root, connectingEdge, visitor, seen, layer) { if (root != null) { const rootId = root.id; @@ -668,7 +668,7 @@ class mxSwimlaneModel { visitor(parent, root, connectingEdge, layer, 1); } } - }; + } /** * Function: extendedDfs @@ -690,7 +690,7 @@ class mxSwimlaneModel { * childHash - the new hash code for this node * layer - the layer on the dfs tree ( not the same as the model ranks ) */ - extendedDfs = ( + extendedDfs( parent, root, connectingEdge, @@ -699,7 +699,7 @@ class mxSwimlaneModel { ancestors, childHash, layer - ) => { + ) { // Explanation of custom hash set. Previously, the ancestors variable // was passed through the dfs as a HashSet. The ancestors were copied // into a new HashSet and when the new child was processed it was also @@ -789,7 +789,7 @@ class mxSwimlaneModel { visitor(parent, root, connectingEdge, layer, 1); } } - }; + } } export default mxSwimlaneModel; diff --git a/src/mxgraph/layout/hierarchical/mxHierarchicalLayout.js b/src/mxgraph/layout/hierarchical/mxHierarchicalLayout.js index 483ec136d..d1ca853c2 100644 --- a/src/mxgraph/layout/hierarchical/mxHierarchicalLayout.js +++ b/src/mxgraph/layout/hierarchical/mxHierarchicalLayout.js @@ -3,15 +3,15 @@ * Copyright (c) 2006-2018, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphLayout from "../mxGraphLayout"; -import mxConstants from "../../util/mxConstants"; -import mxHierarchicalEdgeStyle from "./mxHierarchicalEdgeStyle"; -import mxDictionary from "../../util/mxDictionary"; -import mxGraphHierarchyModel from "./model/mxGraphHierarchyModel"; -import mxObjectIdentity from "../../util/mxObjectIdentity"; -import mxMinimumCycleRemover from "./stage/mxMinimumCycleRemover"; -import mxMedianHybridCrossingReduction from "./stage/mxMedianHybridCrossingReduction"; -import mxCoordinateAssignment from "./stage/mxCoordinateAssignment"; +import mxGraphLayout from '../mxGraphLayout'; +import mxConstants from '../../util/mxConstants'; +import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; +import mxDictionary from '../../util/mxDictionary'; +import mxGraphHierarchyModel from './model/mxGraphHierarchyModel'; +import mxObjectIdentity from '../../util/mxObjectIdentity'; +import mxMinimumCycleRemover from './stage/mxMinimumCycleRemover'; +import mxMedianHybridCrossingReduction from './stage/mxMedianHybridCrossingReduction'; +import mxCoordinateAssignment from './stage/mxCoordinateAssignment'; class mxHierarchicalLayout extends mxGraphLayout { /** @@ -191,9 +191,9 @@ class mxHierarchicalLayout extends mxGraphLayout { * * Returns the internal for this layout algorithm. */ - getModel = () => { + getModel() { return this.model; - }; + } /** * Function: execute @@ -205,7 +205,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * parent - Parent that contains the children to be laid out. * roots - Optional starting roots of the layout. */ - execute = (parent, roots) => { + execute(parent, roots) { this.parent = parent; const { model } = this.graph; this.edgesCache = new mxDictionary(); @@ -286,7 +286,7 @@ class mxHierarchicalLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } /** * Function: findRoots @@ -302,7 +302,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * parent - whose children should be checked. * vertices - array of vertices to limit search to */ - findRoots = (parent, vertices) => { + findRoots(parent, vertices) { const roots = []; if (parent != null && vertices != null) { @@ -347,7 +347,7 @@ class mxHierarchicalLayout extends mxGraphLayout { } return roots; - }; + } /** * Function: getEdges @@ -358,7 +358,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * * cell - whose edges should be returned. */ - getEdges = cell => { + getEdges(cell) { const cachedEdges = this.edgesCache.get(cell); if (cachedEdges != null) { @@ -404,7 +404,7 @@ class mxHierarchicalLayout extends mxGraphLayout { this.edgesCache.put(cell, result); return result; - }; + } /** * Function: getVisibleTerminal @@ -416,7 +416,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * edge - whose edges should be returned. * source - Boolean that specifies whether the source or target terminal is to be returned */ - getVisibleTerminal = (edge, source) => { + getVisibleTerminal(edge, source) { let terminalCache = this.edgesTargetTermCache; if (source) { @@ -452,7 +452,7 @@ class mxHierarchicalLayout extends mxGraphLayout { } return terminal; - }; + } /** * Function: run @@ -462,7 +462,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * routing changes made. It runs each stage of the layout that has been * created. */ - run = parent => { + run(parent) { // Separate out unconnected hierarchies const hierarchyVertices = []; const allVertexSet = []; @@ -565,14 +565,14 @@ class mxHierarchicalLayout extends mxGraphLayout { this.crossingStage(parent); initialX = this.placementStage(initialX, parent); } - }; + } /** * Function: filterDescendants * * Creates an array of descendant cells */ - filterDescendants = (cell, result) => { + filterDescendants(cell, result) { const { model } = this.graph; if ( @@ -599,7 +599,7 @@ class mxHierarchicalLayout extends mxGraphLayout { } } } - }; + } /** * Function: isPort @@ -611,12 +611,12 @@ class mxHierarchicalLayout extends mxGraphLayout { * * cell - that represents the port. */ - isPort = cell => { + isPort(cell) { if (cell != null && cell.geometry != null) { return cell.geometry.relative; } return false; - }; + } /** * Function: getEdgesBetween @@ -630,7 +630,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * target - * directed - */ - getEdgesBetween = (source, target, directed) => { + getEdgesBetween(source, target, directed) { directed = directed != null ? directed : false; const edges = this.getEdges(source); const result = []; @@ -650,7 +650,7 @@ class mxHierarchicalLayout extends mxGraphLayout { } return result; - }; + } /** * Traverses the (directed) graph invoking the given function for each @@ -668,7 +668,7 @@ class mxHierarchicalLayout extends mxGraphLayout { * null for the first step of the traversal. * allVertices - Array of cell paths for the visited cells. */ - traverse = ( + traverse( vertex, directed, edge, @@ -676,7 +676,7 @@ class mxHierarchicalLayout extends mxGraphLayout { currentComp, hierarchyVertices, filledVertexSet - ) => { + ) { if (vertex != null && allVertices != null) { // Has this vertex been seen before in any traversal // And if the filled vertex set is populated, only @@ -766,44 +766,44 @@ class mxHierarchicalLayout extends mxGraphLayout { } return currentComp; - }; + } /** * Function: cycleStage * * Executes the cycle stage using mxMinimumCycleRemover. */ - cycleStage = parent => { + cycleStage(parent) { const cycleStage = new mxMinimumCycleRemover(this); cycleStage.execute(parent); - }; + } /** * Function: layeringStage * * Implements first stage of a Sugiyama layout. */ - layeringStage = () => { + layeringStage() { this.model.initialRank(); this.model.fixRanks(); - }; + } /** * Function: crossingStage * * Executes the crossing stage using mxMedianHybridCrossingReduction. */ - crossingStage = parent => { + crossingStage(parent) { const crossingStage = new mxMedianHybridCrossingReduction(this); crossingStage.execute(parent); - }; + } /** * Function: placementStage * * Executes the placement stage using mxCoordinateAssignment. */ - placementStage = (initialX, parent) => { + placementStage(initialX, parent) { const placementStage = new mxCoordinateAssignment( this, this.intraCellSpacing, @@ -816,7 +816,7 @@ class mxHierarchicalLayout extends mxGraphLayout { placementStage.execute(parent); return placementStage.limitX + this.interHierarchySpacing; - }; + } } export default mxHierarchicalLayout; diff --git a/src/mxgraph/layout/hierarchical/mxSwimlaneLayout.js b/src/mxgraph/layout/hierarchical/mxSwimlaneLayout.js index 241f1fb3e..184feb7e3 100644 --- a/src/mxgraph/layout/hierarchical/mxSwimlaneLayout.js +++ b/src/mxgraph/layout/hierarchical/mxSwimlaneLayout.js @@ -4,16 +4,16 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphLayout from "../mxGraphLayout"; -import mxConstants from "../../util/mxConstants"; -import mxHierarchicalEdgeStyle from "./mxHierarchicalEdgeStyle"; -import mxDictionary from "../../util/mxDictionary"; -import mxRectangle from "../../util/mxRectangle"; -import mxSwimlaneModel from "./model/mxSwimlaneModel"; -import mxObjectIdentity from "../../util/mxObjectIdentity"; -import mxSwimlaneOrdering from "./stage/mxSwimlaneOrdering"; -import mxMedianHybridCrossingReduction from "./stage/mxMedianHybridCrossingReduction"; -import mxCoordinateAssignment from "./stage/mxCoordinateAssignment"; +import mxGraphLayout from '../mxGraphLayout'; +import mxConstants from '../../util/mxConstants'; +import mxHierarchicalEdgeStyle from './mxHierarchicalEdgeStyle'; +import mxDictionary from '../../util/mxDictionary'; +import mxRectangle from '../../util/mxRectangle'; +import mxSwimlaneModel from './model/mxSwimlaneModel'; +import mxObjectIdentity from '../../util/mxObjectIdentity'; +import mxSwimlaneOrdering from './stage/mxSwimlaneOrdering'; +import mxMedianHybridCrossingReduction from './stage/mxMedianHybridCrossingReduction'; +import mxCoordinateAssignment from './stage/mxCoordinateAssignment'; class mxSwimlaneLayout extends mxGraphLayout { /** @@ -206,9 +206,9 @@ class mxSwimlaneLayout extends mxGraphLayout { * * Returns the internal for this layout algorithm. */ - getModel = () => { + getModel() { return this.model; - }; + } /** * Function: execute @@ -220,7 +220,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * parent - Parent that contains the children to be laid out. * swimlanes - Ordered array of swimlanes to be laid out */ - execute = (parent, swimlanes) => { + execute(parent, swimlanes) { this.parent = parent; const { model } = this.graph; this.edgesCache = new mxDictionary(); @@ -309,7 +309,7 @@ class mxSwimlaneLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } /** * Function: updateGroupBounds @@ -318,7 +318,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * all child vertices. * */ - updateGroupBounds = () => { + updateGroupBounds() { // Get all vertices and edge in the layout const cells = []; const { model } = this; @@ -398,7 +398,7 @@ class mxSwimlaneLayout extends mxGraphLayout { this.graph.moveCells(children, -x, geo.y - y); } } - }; + } /** * Function: findRoots @@ -414,7 +414,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * parent - whose children should be checked. * vertices - array of vertices to limit search to */ - findRoots = (parent, vertices) => { + findRoots(parent, vertices) { const roots = []; if (parent != null && vertices != null) { @@ -469,7 +469,7 @@ class mxSwimlaneLayout extends mxGraphLayout { } return roots; - }; + } /** * Function: getEdges @@ -480,7 +480,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * * cell - whose edges should be returned. */ - getEdges = cell => { + getEdges(cell) { const cachedEdges = this.edgesCache.get(cell); if (cachedEdges != null) { @@ -534,7 +534,7 @@ class mxSwimlaneLayout extends mxGraphLayout { this.edgesCache.put(cell, result); return result; - }; + } /** * Function: getVisibleTerminal @@ -546,7 +546,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * edge - whose edges should be returned. * source - Boolean that specifies whether the source or target terminal is to be returned */ - getVisibleTerminal = (edge, source) => { + getVisibleTerminal(edge, source) { let terminalCache = this.edgesTargetTermCache; if (source) { @@ -582,7 +582,7 @@ class mxSwimlaneLayout extends mxGraphLayout { } return terminal; - }; + } /** * Function: run @@ -592,7 +592,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * routing changes made. It runs each stage of the layout that has been * created. */ - run = parent => { + run(parent) { // Separate out unconnected hierarchies const hierarchyVertices = []; const allVertexSet = Object(); @@ -700,14 +700,14 @@ class mxSwimlaneLayout extends mxGraphLayout { this.crossingStage(parent); this.placementStage(0, parent); - }; + } /** * Function: filterDescendants * * Creates an array of descendant cells */ - filterDescendants = (cell, result) => { + filterDescendants(cell, result) { const { model } = this.graph; if ( @@ -735,7 +735,7 @@ class mxSwimlaneLayout extends mxGraphLayout { } } } - }; + } /** * Function: isPort @@ -747,13 +747,13 @@ class mxSwimlaneLayout extends mxGraphLayout { * * cell - that represents the port. */ - isPort = cell => { + isPort(cell) { if (cell.geometry.relative) { return true; } return false; - }; + } /** * Function: getEdgesBetween @@ -767,7 +767,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * target - * directed - */ - getEdgesBetween = (source, target, directed) => { + getEdgesBetween(source, target, directed) { directed = directed != null ? directed : false; const edges = this.getEdges(source); const result = []; @@ -787,7 +787,7 @@ class mxSwimlaneLayout extends mxGraphLayout { } return result; - }; + } /** * Traverses the (directed) graph invoking the given function for each @@ -806,7 +806,7 @@ class mxSwimlaneLayout extends mxGraphLayout { * allVertices - Array of cell paths for the visited cells. * swimlaneIndex - the laid out order index of the swimlane vertex is contained in */ - traverse = ( + traverse( vertex, directed, edge, @@ -815,7 +815,7 @@ class mxSwimlaneLayout extends mxGraphLayout { hierarchyVertices, filledVertexSet, swimlaneIndex - ) => { + ) { if (vertex != null && allVertices != null) { // Has this vertex been seen before in any traversal // And if the filled vertex set is populated, only @@ -903,44 +903,44 @@ class mxSwimlaneLayout extends mxGraphLayout { } return currentComp; - }; + } /** * Function: cycleStage * * Executes the cycle stage using mxMinimumCycleRemover. */ - cycleStage = parent => { + cycleStage(parent) { const cycleStage = new mxSwimlaneOrdering(this); cycleStage.execute(parent); - }; + } /** * Function: layeringStage * * Implements first stage of a Sugiyama layout. */ - layeringStage = () => { + layeringStage() { this.model.initialRank(); this.model.fixRanks(); - }; + } /** * Function: crossingStage * * Executes the crossing stage using mxMedianHybridCrossingReduction. */ - crossingStage = parent => { + crossingStage(parent) { const crossingStage = new mxMedianHybridCrossingReduction(this); crossingStage.execute(parent); - }; + } /** * Function: placementStage * * Executes the placement stage using mxCoordinateAssignment. */ - placementStage = (initialX, parent) => { + placementStage(initialX, parent) { const placementStage = new mxCoordinateAssignment( this, this.intraCellSpacing, @@ -953,7 +953,7 @@ class mxSwimlaneLayout extends mxGraphLayout { placementStage.execute(parent); return placementStage.limitX + this.interHierarchySpacing; - }; + } } export default mxSwimlaneLayout; diff --git a/src/mxgraph/layout/hierarchical/stage/MedianCellSorter.js b/src/mxgraph/layout/hierarchical/stage/MedianCellSorter.js index c280b5d61..576bc715d 100644 --- a/src/mxgraph/layout/hierarchical/stage/MedianCellSorter.js +++ b/src/mxgraph/layout/hierarchical/stage/MedianCellSorter.js @@ -8,7 +8,7 @@ class MedianCellSorter { * * Compares two MedianCellSorters. */ - compare = (a, b) => { + compare(a, b) { if (a != null && b != null) { if (b.medianValue > a.medianValue) { return -1; @@ -19,7 +19,7 @@ class MedianCellSorter { return 0; } return 0; - }; + } } export default MedianCellSorter; diff --git a/src/mxgraph/layout/hierarchical/stage/mxCoordinateAssignment.js b/src/mxgraph/layout/hierarchical/stage/mxCoordinateAssignment.js index bc0fbae14..e3ba99f0d 100644 --- a/src/mxgraph/layout/hierarchical/stage/mxCoordinateAssignment.js +++ b/src/mxgraph/layout/hierarchical/stage/mxCoordinateAssignment.js @@ -4,12 +4,12 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxHierarchicalLayoutStage from './mxHierarchicalLayoutStage'; -import mxConstants from "../../../util/mxConstants"; -import mxLog from "../../../util/mxLog"; -import WeightedCellSorter from "../../WeightedCellSorter"; -import mxDictionary from "../../../util/mxDictionary"; -import mxPoint from "../../../util/mxPoint"; -import mxHierarchicalEdgeStyle from "../mxHierarchicalEdgeStyle"; +import mxConstants from '../../../util/mxConstants'; +import mxLog from '../../../util/mxLog'; +import WeightedCellSorter from '../../WeightedCellSorter'; +import mxDictionary from '../../../util/mxDictionary'; +import mxPoint from '../../../util/mxPoint'; +import mxHierarchicalEdgeStyle from '../mxHierarchicalEdgeStyle'; class mxCoordinateAssignment extends mxHierarchicalLayoutStage { /** @@ -229,7 +229,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { /** * Utility method to display current positions */ - printStatus = () => { + printStatus() { const model = this.layout.getModel(); mxLog.show(); @@ -248,14 +248,14 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } mxLog.writeln('===================================='); - }; + } /** * Function: execute * * A basic horizontal coordinate assignment algorithm */ - execute = parent => { + execute(parent) { this.jettyPositions = Object(); const model = this.layout.getModel(); this.currentXDelta = 0.0; @@ -313,14 +313,14 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } this.setCellLocations(this.layout.getGraph(), model); - }; + } /** * Function: minNode * * Performs one median positioning sweep in both directions */ - minNode = model => { + minNode(model) { // Queue all nodes const nodeList = []; @@ -476,7 +476,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { cellWrapper.visited = false; count += 1; } - }; + } /** * Function: medianPos @@ -488,7 +488,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * i - the iteration of the whole process * model - an internal model of the hierarchical layout */ - medianPos = (i, model) => { + medianPos(i, model) { // Reverse sweep direction each time through this method const downwardSweep = i % 2 === 0; @@ -501,7 +501,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { this.rankMedianPosition(j + 1, model, j); } } - }; + } /** * Function: rankMedianPosition @@ -515,7 +515,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * nextRankValue - the layer number whose connected cels are to be laid out * relative to */ - rankMedianPosition = (rankValue, model, nextRankValue) => { + rankMedianPosition(rankValue, model, nextRankValue) { const rank = model.ranks[rankValue]; // Form an array of the order in which the cell are to be processed @@ -661,7 +661,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { weightedValues[i].visited = true; } - }; + } /** * Function: calculatedWeightedValue @@ -674,7 +674,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * currentCell - the cell whose weight is to be calculated * collection - the cells the specified cell is connected to */ - calculatedWeightedValue = (currentCell, collection) => { + calculatedWeightedValue(currentCell, collection) { let totalWeight = 0; for (let i = 0; i < collection.length; i += 1) { @@ -690,7 +690,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } return totalWeight; - }; + } /** * Function: medianXValue @@ -703,7 +703,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * connectedCells - the cells the candidate connects to on this level * rankValue - the layer number of this rank */ - medianXValue = (connectedCells, rankValue) => { + medianXValue(connectedCells, rankValue) { if (connectedCells.length === 0) { return 0; } @@ -727,7 +727,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { const rightMedian = medianValues[medianPoint]; return (leftMedian + rightMedian) / 2; - }; + } /** * Function: initialCoords @@ -741,7 +741,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * facade - the facade describing the input graph * model - an internal model of the hierarchical layout */ - initialCoords = (facade, model) => { + initialCoords(facade, model) { this.calculateWidestRank(facade, model); // Sweep up and down from the widest rank @@ -756,7 +756,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { this.rankCoordinates(i, facade, model); } } - }; + } /** * Function: rankCoordinates @@ -772,7 +772,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * graph - the facade describing the input graph * model - an internal model of the hierarchical layout */ - rankCoordinates = (rankValue, graph, model) => { + rankCoordinates(rankValue, graph, model) { const rank = model.ranks[rankValue]; let maxY = 0.0; let localX = @@ -829,7 +829,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { if (boundsWarning == true) { mxLog.warn('At least one cell has no bounds'); } - }; + } /** * Function: calculateWidestRank @@ -842,7 +842,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * graph - the facade describing the input graph * model - an internal model of the hierarchical layout */ - calculateWidestRank = (graph, model) => { + calculateWidestRank(graph, model) { // Starting y co-ordinate let y = -this.interRankCellSpacing; @@ -938,7 +938,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { cell.setY(rankValue, y); } } - }; + } /** * Function: minPath @@ -951,7 +951,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * graph - the facade describing the input graph * model - an internal model of the hierarchical layout */ - minPath = (graph, model) => { + minPath(graph, model) { // Work down and up each edge with at least 2 control points // trying to straighten each one out. If the same number of // straight segments are formed in both directions, the @@ -1050,7 +1050,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } } } - }; + } /** * Function: repositionValid @@ -1065,7 +1065,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * rank - the layer of the cell * position - the x position being sought */ - repositionValid = (model, cell, rank, position) => { + repositionValid(model, cell, rank, position) { const rankArray = model.ranks[rank]; let rankIndex = -1; @@ -1114,7 +1114,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { return rightLimit >= position; } return true; - }; + } /** * Function: setCellLocations @@ -1127,7 +1127,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * graph - the input graph * model - the layout model */ - setCellLocations = (graph, model) => { + setCellLocations(graph, model) { this.rankTopY = []; this.rankBottomY = []; @@ -1161,7 +1161,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { for (let i = 0; i < edges.length; i += 1) { this.setEdgePosition(edges[i]); } - }; + } /** * Function: localEdgeProcessing @@ -1172,7 +1172,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * * model - the layout model */ - localEdgeProcessing = model => { + localEdgeProcessing(model) { // Iterate through each vertex, look at the edges connected in // both directions. for (let rankIndex = 0; rankIndex < model.ranks.length; rankIndex += 1) { @@ -1299,14 +1299,14 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } } } - }; + } /** * Function: setEdgePosition * * Fixes the control points */ - setEdgePosition = cell => { + setEdgePosition(cell) { // For parallel edges we need to seperate out the points a // little let offsetX = 0; @@ -1533,7 +1533,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { cell.temp[0] = 101207; } - }; + } /** * Function: setVertexLocation @@ -1544,7 +1544,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * * cell - the vertex to position */ - setVertexLocation = cell => { + setVertexLocation(cell) { const realCell = cell.cell; const positionX = cell.x[0] - cell.width / 2; const positionY = cell.y[0] - cell.height / 2; @@ -1568,7 +1568,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { } this.limitX = Math.max(this.limitX, positionX + cell.width); - }; + } /** * Function: processReversedEdge @@ -1580,9 +1580,9 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage { * edge - the hierarchical model edge * realEdge - the real edge in the graph */ - processReversedEdge = (graph, model) => { + processReversedEdge(graph, model) { // hook for subclassers - }; + } } export default mxCoordinateAssignment; diff --git a/src/mxgraph/layout/hierarchical/stage/mxHierarchicalLayoutStage.js b/src/mxgraph/layout/hierarchical/stage/mxHierarchicalLayoutStage.js index 9483fc298..f65b16c1f 100644 --- a/src/mxgraph/layout/hierarchical/stage/mxHierarchicalLayoutStage.js +++ b/src/mxgraph/layout/hierarchical/stage/mxHierarchicalLayoutStage.js @@ -25,7 +25,7 @@ class mxHierarchicalLayoutStage { * and creates the resulting laid out graph within that facade for further * use. */ - execute = parent => {}; + execute(parent) {} } export default mxHierarchicalLayoutStage; diff --git a/src/mxgraph/layout/hierarchical/stage/mxMedianHybridCrossingReduction.js b/src/mxgraph/layout/hierarchical/stage/mxMedianHybridCrossingReduction.js index c342727ea..bc15cac4d 100644 --- a/src/mxgraph/layout/hierarchical/stage/mxMedianHybridCrossingReduction.js +++ b/src/mxgraph/layout/hierarchical/stage/mxMedianHybridCrossingReduction.js @@ -4,7 +4,7 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxHierarchicalLayoutStage from './mxHierarchicalLayoutStage'; -import MedianCellSorter from "./MedianCellSorter"; +import MedianCellSorter from './MedianCellSorter'; class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { /** @@ -107,7 +107,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * Performs a vertex ordering within ranks as described by Gansner et al * 1993 */ - execute = parent => { + execute(parent) { const model = this.layout.getModel(); // Stores initial ordering as being the best one found so far @@ -181,7 +181,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { } model.ranks = ranks; - }; + } /** * Function: calculateCrossings @@ -194,7 +194,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * * model - the internal model describing the hierarchy */ - calculateCrossings = model => { + calculateCrossings(model) { const numRanks = model.ranks.length; let totalCrossings = 0; @@ -203,7 +203,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { } return totalCrossings; - }; + } /** * Function: calculateRankCrossing @@ -217,7 +217,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * i - the topmost rank of the pair ( higher rank value ) * model - the internal model describing the hierarchy */ - calculateRankCrossing = (i, model) => { + calculateRankCrossing(i, model) { let totalCrossings = 0; const rank = model.ranks[i]; const previousRank = model.ranks[i - 1]; @@ -282,7 +282,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { } return totalCrossings; - }; + } /** * Function: transpose @@ -295,7 +295,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * mainLoopIteration - the iteration number of the main loop * model - the internal model describing the hierarchy */ - transpose = (mainLoopIteration, model) => { + transpose(mainLoopIteration, model) { let improved = true; // Track the number of iterations in case of looping @@ -450,7 +450,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { } } } - }; + } /** * Function: weightedMedian @@ -463,7 +463,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * iteration - the iteration number of the main loop * model - the internal model describing the hierarchy */ - weightedMedian = (iteration, model) => { + weightedMedian(iteration, model) { // Reverse sweep direction each time through this method const downwardSweep = iteration % 2 === 0; if (downwardSweep) { @@ -475,7 +475,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { this.medianRank(j, downwardSweep); } } - }; + } /** * Function: medianRank @@ -488,7 +488,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * rankValue - the layer number of this rank * downwardSweep - whether or not this is a downward sweep through the graph */ - medianRank = (rankValue, downwardSweep) => { + medianRank(rankValue, downwardSweep) { const numCellsForRank = this.nestedBestRanks[rankValue].length; const medianValues = []; const reservedPositions = []; @@ -546,7 +546,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { cell.setGeneralPurposeVariable(rankValue, i); } } - }; + } /** * Function: medianValue @@ -561,7 +561,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { * specified cell * rankValue - the rank that the connected cell lie upon */ - medianValue = (connectedCells, rankValue) => { + medianValue(connectedCells, rankValue) { const medianValues = []; let arrayCount = 0; @@ -593,7 +593,7 @@ class mxMedianHybridCrossingReduction extends mxHierarchicalLayoutStage { medianValues[medianPoint] * leftMedian) / (leftMedian + rightMedian) ); - }; + } } export default mxMedianHybridCrossingReduction; diff --git a/src/mxgraph/layout/hierarchical/stage/mxMinimumCycleRemover.js b/src/mxgraph/layout/hierarchical/stage/mxMinimumCycleRemover.js index cc1e7003d..d94761b43 100644 --- a/src/mxgraph/layout/hierarchical/stage/mxMinimumCycleRemover.js +++ b/src/mxgraph/layout/hierarchical/stage/mxMinimumCycleRemover.js @@ -4,7 +4,7 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxHierarchicalLayoutStage from './mxHierarchicalLayoutStage'; -import mxUtils from "../../../util/mxUtils"; +import mxUtils from '../../../util/mxUtils'; class mxMinimumCycleRemover extends mxHierarchicalLayoutStage { /** @@ -37,7 +37,7 @@ class mxMinimumCycleRemover extends mxHierarchicalLayoutStage { * and creates the resulting laid out graph within that facade for further * use. */ - execute = parent => { + execute(parent) { const model = this.layout.getModel(); const seenNodes = {}; const unseenNodesArray = model.vertexMapper.getValues(); @@ -107,7 +107,7 @@ class mxMinimumCycleRemover extends mxHierarchicalLayoutStage { true, seenNodesCopy ); - }; + } } export default mxMinimumCycleRemover; diff --git a/src/mxgraph/layout/hierarchical/stage/mxSwimlaneOrdering.js b/src/mxgraph/layout/hierarchical/stage/mxSwimlaneOrdering.js index 9a63ca1a8..a2b2cd3f0 100644 --- a/src/mxgraph/layout/hierarchical/stage/mxSwimlaneOrdering.js +++ b/src/mxgraph/layout/hierarchical/stage/mxSwimlaneOrdering.js @@ -4,8 +4,8 @@ * Updated to ES9 syntax by David Morrissey 2021 */ import mxHierarchicalLayoutStage from './mxHierarchicalLayoutStage'; -import mxUtils from "../../../util/mxUtils"; -import mxCellPath from "../../../model/mxCellPath"; +import mxUtils from '../../../util/mxUtils'; +import mxCellPath from '../../../model/mxCellPath'; class mxSwimlaneOrdering extends mxHierarchicalLayoutStage { /** @@ -38,7 +38,7 @@ class mxSwimlaneOrdering extends mxHierarchicalLayoutStage { * and creates the resulting laid out graph within that facade for further * use. */ - execute = parent => { + execute(parent) { const model = this.layout.getModel(); const seenNodes = {}; const unseenNodes = mxUtils.clone(model.vertexMapper, null, true); @@ -97,7 +97,7 @@ class mxSwimlaneOrdering extends mxHierarchicalLayoutStage { true, null ); - }; + } } export default mxSwimlaneOrdering; diff --git a/src/mxgraph/layout/mxCircleLayout.js b/src/mxgraph/layout/mxCircleLayout.js index 679147dde..abd6707f1 100644 --- a/src/mxgraph/layout/mxCircleLayout.js +++ b/src/mxgraph/layout/mxCircleLayout.js @@ -3,7 +3,7 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphLayout from "./mxGraphLayout"; +import mxGraphLayout from './mxGraphLayout'; class mxCircleLayout extends mxGraphLayout { /** @@ -87,7 +87,7 @@ class mxCircleLayout extends mxGraphLayout { * * Implements . */ - execute = parent => { + execute(parent) { const model = this.graph.getModel(); // Moves the vertices to build a circle. Makes sure the @@ -146,7 +146,7 @@ class mxCircleLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } /** * Function: getRadius @@ -154,9 +154,9 @@ class mxCircleLayout extends mxGraphLayout { * Returns the radius to be used for the given vertex count. Max is the maximum * width or height of all vertices in the layout. */ - getRadius = (count, max) => { + getRadius(count, max) { return Math.max((count * max) / Math.PI, this.radius); - }; + } /** * Function: circle @@ -165,7 +165,7 @@ class mxCircleLayout extends mxGraphLayout { * of vertices and the given radius. This is called from * . */ - circle = (vertices, r, left, top) => { + circle(vertices, r, left, top) { const vertexCount = vertices.length; const phi = (2 * Math.PI) / vertexCount; @@ -178,7 +178,7 @@ class mxCircleLayout extends mxGraphLayout { ); } } - }; + } } export default mxCircleLayout; diff --git a/src/mxgraph/layout/mxCompactTreeLayout.js b/src/mxgraph/layout/mxCompactTreeLayout.js index 5c7f4f152..1f4b1f132 100644 --- a/src/mxgraph/layout/mxCompactTreeLayout.js +++ b/src/mxgraph/layout/mxCompactTreeLayout.js @@ -4,9 +4,9 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxDictionary from "../util/mxDictionary"; -import mxPoint from "../util/mxPoint"; -import mxGraphLayout from "./mxGraphLayout"; +import mxDictionary from '../util/mxDictionary'; +import mxPoint from '../util/mxPoint'; +import mxGraphLayout from './mxGraphLayout'; class mxCompactTreeLayout extends mxGraphLayout { /** @@ -231,21 +231,21 @@ class mxCompactTreeLayout extends mxGraphLayout { * * vertex - whose ignored state should be returned. */ - isVertexIgnored = vertex => { + isVertexIgnored(vertex) { return ( super.isVertexIgnored(vertex) || this.graph.getConnections(vertex).length == 0 ); - }; + } /** * Function: isHorizontal * * Returns . */ - isHorizontal = () => { + isHorizontal() { return this.horizontal; - }; + } /** * Function: execute @@ -262,7 +262,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * root - Optional that will be used as the root of the tree. * Overrides if specified. */ - execute = (parent, root) => { + execute(parent, root) { this.parent = parent; const model = this.graph.getModel(); @@ -407,14 +407,14 @@ class mxCompactTreeLayout extends mxGraphLayout { model.endUpdate(); } } - }; + } /** * Function: moveNode * * Moves the specified node and all of its children by the given amount. */ - moveNode = (node, dx, dy) => { + moveNode(node, dx, dy) { node.x += dx; node.y += dy; this.apply(node); @@ -425,14 +425,14 @@ class mxCompactTreeLayout extends mxGraphLayout { this.moveNode(child, dx, dy); child = child.next; } - }; + } /** * Function: sortOutgoingEdges * * Called if is true to sort the array of outgoing edges in place. */ - sortOutgoingEdges = (source, edges) => { + sortOutgoingEdges(source, edges) { const lookup = new mxDictionary(); edges.sort((e1, e2) => { @@ -454,7 +454,7 @@ class mxCompactTreeLayout extends mxGraphLayout { return mxCellPath.compare(p1, p2); }); - }; + } /** * Function: findRankHeights @@ -462,7 +462,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * Stores the maximum height (relative to the layout * direction) of cells in each rank */ - findRankHeights = (node, rank) => { + findRankHeights(node, rank) { if ( this.maxRankHeight[rank] == null || this.maxRankHeight[rank] < node.height @@ -476,7 +476,7 @@ class mxCompactTreeLayout extends mxGraphLayout { this.findRankHeights(child, rank + 1); child = child.next; } - }; + } /** * Function: setCellHeights @@ -484,7 +484,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * Set the cells heights (relative to the layout * direction) when the tops of each rank are to be aligned */ - setCellHeights = (node, rank) => { + setCellHeights(node, rank) { if ( this.maxRankHeight[rank] != null && this.maxRankHeight[rank] > node.height @@ -498,7 +498,7 @@ class mxCompactTreeLayout extends mxGraphLayout { this.setCellHeights(child, rank + 1); child = child.next; } - }; + } /** * Function: dfs @@ -507,7 +507,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * Makes sure the specified parent is never left by the * algorithm. */ - dfs = (cell, parent) => { + dfs(cell, parent) { const id = mxCellPath.create(cell); let node = null; @@ -571,7 +571,7 @@ class mxCompactTreeLayout extends mxGraphLayout { } return node; - }; + } /** * Function: layout @@ -579,7 +579,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * Starts the actual compact tree layout algorithm * at the given node. */ - layout = node => { + layout(node) { if (node != null) { let { child } = node; @@ -594,12 +594,12 @@ class mxCompactTreeLayout extends mxGraphLayout { this.layoutLeaf(node); } } - }; + } /** * Function: horizontalLayout */ - horizontalLayout = (node, x0, y0, bounds) => { + horizontalLayout(node, x0, y0, bounds) { node.x += x0 + node.offsetX; node.y += y0 + node.offsetY; bounds = this.apply(node, bounds); @@ -623,12 +623,12 @@ class mxCompactTreeLayout extends mxGraphLayout { } return bounds; - }; + } /** * Function: verticalLayout */ - verticalLayout = (node, parent, x0, y0, bounds) => { + verticalLayout(node, parent, x0, y0, bounds) { node.x += x0 + node.offsetY; node.y += y0 + node.offsetX; bounds = this.apply(node, bounds); @@ -653,12 +653,12 @@ class mxCompactTreeLayout extends mxGraphLayout { } return bounds; - }; + } /** * Function: attachParent */ - attachParent = (node, height) => { + attachParent(node, height) { const x = this.nodeDistance + this.levelDistance; const y2 = (height - node.width) / 2 - this.nodeDistance; const y1 = y2 + node.width + 2 * this.nodeDistance - height; @@ -676,12 +676,12 @@ class mxCompactTreeLayout extends mxGraphLayout { 0, this.createLine(x, y2, node.contour.lowerHead) ); - }; + } /** * Function: layoutLeaf */ - layoutLeaf = node => { + layoutLeaf(node) { const dist = 2 * this.nodeDistance; node.contour.upperTail = this.createLine(node.height + dist, 0); @@ -692,12 +692,12 @@ class mxCompactTreeLayout extends mxGraphLayout { 0, node.contour.lowerTail ); - }; + } /** * Function: join */ - join = node => { + join(node) { const dist = 2 * this.nodeDistance; let { child } = node; @@ -716,12 +716,12 @@ class mxCompactTreeLayout extends mxGraphLayout { } return sum; - }; + } /** * Function: merge */ - merge = (p1, p2) => { + merge(p1, p2) { let x = 0; let y = 0; let total = 0; @@ -760,12 +760,12 @@ class mxCompactTreeLayout extends mxGraphLayout { p1.lowerHead = p2.lowerHead; return total; - }; + } /** * Function: offset */ - offset = (p1, p2, a1, a2, b1, b2) => { + offset(p1, p2, a1, a2, b1, b2) { let d = 0; if (b1 <= p1 || p1 + a1 <= 0) { @@ -798,12 +798,12 @@ class mxCompactTreeLayout extends mxGraphLayout { return d; } return 0; - }; + } /** * Function: bridge */ - bridge = (line1, x1, y1, line2, x2, y2) => { + bridge(line1, x1, y1, line2, x2, y2) { const dx = x2 + line2.dx - x1; let dy = 0; let s = 0; @@ -819,12 +819,12 @@ class mxCompactTreeLayout extends mxGraphLayout { line1.next = this.createLine(0, y2 + line2.dy - dy - y1, r); return r; - }; + } /** * Function: createNode */ - createNode = cell => { + createNode(cell) { const node = {}; node.cell = cell; node.x = 0; @@ -849,12 +849,12 @@ class mxCompactTreeLayout extends mxGraphLayout { node.contour = {}; return node; - }; + } /** * Function: apply */ - apply = (node, bounds) => { + apply(node, bounds) { const model = this.graph.getModel(); const { cell } = node; let g = model.getGeometry(cell); @@ -887,19 +887,19 @@ class mxCompactTreeLayout extends mxGraphLayout { } return bounds; - }; + } /** * Function: createLine */ - createLine = (dx, dy, next) => { + createLine(dx, dy, next) { const line = {}; line.dx = dx; line.dy = dy; line.next = next; return line; - }; + } /** * Function: adjustParents @@ -908,7 +908,7 @@ class mxCompactTreeLayout extends mxGraphLayout { * implementation adjusts the group to just fit around the children with * a padding. */ - adjustParents = () => { + adjustParents() { const tmp = []; for (const id in this.parentsChanged) { @@ -923,14 +923,14 @@ class mxCompactTreeLayout extends mxGraphLayout { this.groupPaddingBottom, this.groupPaddingLeft ); - }; + } /** * Function: localEdgeProcessing * * Moves the specified node and all of its children by the given amount. */ - localEdgeProcessing = node => { + localEdgeProcessing(node) { this.processNodeOutgoing(node); let { child } = node; @@ -938,14 +938,14 @@ class mxCompactTreeLayout extends mxGraphLayout { this.localEdgeProcessing(child); child = child.next; } - }; + } /** * Function: processNodeOutgoing * * Separates the x position of edges as they connect to vertices */ - processNodeOutgoing = node => { + processNodeOutgoing(node) { let { child } = node; const parentCell = node.cell; @@ -1038,7 +1038,7 @@ class mxCompactTreeLayout extends mxGraphLayout { maxYOffset = Math.max(maxYOffset, currentYOffset); } - }; + } } export default mxCompactTreeLayout; diff --git a/src/mxgraph/layout/mxCompositeLayout.js b/src/mxgraph/layout/mxCompositeLayout.js index fca42d841..620b5f766 100644 --- a/src/mxgraph/layout/mxCompositeLayout.js +++ b/src/mxgraph/layout/mxCompositeLayout.js @@ -3,7 +3,7 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphLayout from "./mxGraphLayout"; +import mxGraphLayout from './mxGraphLayout'; class mxCompositeLayout extends mxGraphLayout { /** @@ -61,13 +61,13 @@ class mxCompositeLayout extends mxGraphLayout { * Implements by calling move on or the first * layout in . */ - moveCell = (cell, x, y) => { + moveCell(cell, x, y) { if (this.master != null) { this.master.moveCell.apply(this.master, [cell, x, y]); } else { this.layouts[0].moveCell.apply(this.layouts[0], [cell, x, y]); } - }; + } /** * Function: execute @@ -75,7 +75,7 @@ class mxCompositeLayout extends mxGraphLayout { * Implements by executing all in a * single transaction. */ - execute = parent => { + execute(parent) { const model = this.graph.getModel(); model.beginUpdate(); @@ -86,7 +86,7 @@ class mxCompositeLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } } export default mxCompositeLayout; diff --git a/src/mxgraph/layout/mxEdgeLabelLayout.js b/src/mxgraph/layout/mxEdgeLabelLayout.js index e6e7a9e8a..3b092df06 100644 --- a/src/mxgraph/layout/mxEdgeLabelLayout.js +++ b/src/mxgraph/layout/mxEdgeLabelLayout.js @@ -4,9 +4,9 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxPoint from "../util/mxPoint"; -import mxGraphLayout from "./mxGraphLayout"; -import mxUtils from "../util/mxUtils"; +import mxPoint from '../util/mxPoint'; +import mxGraphLayout from './mxGraphLayout'; +import mxUtils from '../util/mxUtils'; class mxEdgeLabelLayout extends mxGraphLayout { /** @@ -41,7 +41,7 @@ class mxEdgeLabelLayout extends mxGraphLayout { * * Implements . */ - execute = parent => { + execute(parent) { const { view } = this.graph; const model = this.graph.getModel(); @@ -64,14 +64,14 @@ class mxEdgeLabelLayout extends mxGraphLayout { } this.placeLabels(vertices, edges); - }; + } /** * Function: placeLabels * * Places the labels of the given edges. */ - placeLabels = (v, e) => { + placeLabels(v, e) { const model = this.graph.getModel(); // Moves the vertices to build a circle. Makes sure the @@ -99,14 +99,14 @@ class mxEdgeLabelLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } /** * Function: avoid * * Places the labels of the given edges. */ - avoid = (edge, vertex) => { + avoid(edge, vertex) { const model = this.graph.getModel(); const labRect = edge.text.boundingBox; @@ -142,7 +142,7 @@ class mxEdgeLabelLayout extends mxGraphLayout { model.setGeometry(edge.cell, g); } } - }; + } } export default mxEdgeLabelLayout; diff --git a/src/mxgraph/layout/mxFastOrganicLayout.js b/src/mxgraph/layout/mxFastOrganicLayout.js index 09f5de7ee..ebe1274c2 100644 --- a/src/mxgraph/layout/mxFastOrganicLayout.js +++ b/src/mxgraph/layout/mxFastOrganicLayout.js @@ -3,7 +3,7 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxObjectIdentity from "../util/mxObjectIdentity"; +import mxObjectIdentity from '../util/mxObjectIdentity'; import mxGraphLayout from './mxGraphLayout'; class mxFastOrganicLayout extends mxGraphLayout { @@ -201,12 +201,12 @@ class mxFastOrganicLayout extends mxGraphLayout { * * vertex - whose ignored state should be returned. */ - isVertexIgnored = vertex => { + isVertexIgnored(vertex) { return ( super.isVertexIgnored(vertex) || this.graph.getConnections(vertex).length === 0 ); - }; + } /** * Function: execute @@ -214,7 +214,7 @@ class mxFastOrganicLayout extends mxGraphLayout { * Implements . This operates on all children of the * given parent where returns false. */ - execute = parent => { + execute(parent) { const model = this.graph.getModel(); this.vertexArray = []; let cells = this.graph.getChildVertices(parent); @@ -393,7 +393,7 @@ class mxFastOrganicLayout extends mxGraphLayout { } finally { model.endUpdate(); } - }; + } /** * Function: calcPositions @@ -402,7 +402,7 @@ class mxFastOrganicLayout extends mxGraphLayout { * local cache of cell positions. Limits the displacement to the current * temperature. */ - calcPositions = () => { + calcPositions() { for (let index = 0; index < this.vertexArray.length; index += 1) { if (this.isMoveable[index]) { // Get the distance of displacement for this node for this @@ -435,7 +435,7 @@ class mxFastOrganicLayout extends mxGraphLayout { this.cellLocation[index][1] += newYDisp; } } - }; + } /** * Function: calcAttraction @@ -443,7 +443,7 @@ class mxFastOrganicLayout extends mxGraphLayout { * Calculates the attractive forces between all laid out nodes linked by * edges */ - calcAttraction = () => { + calcAttraction() { // Check the neighbours of each vertex and calculate the attractive // force of the edge connecting them for (let i = 0; i < this.vertexArray.length; i += 1) { @@ -481,14 +481,14 @@ class mxFastOrganicLayout extends mxGraphLayout { } } } - }; + } /** * Function: calcRepulsion * * Calculates the repulsive forces between all laid out nodes */ - calcRepulsion = () => { + calcRepulsion() { const vertexCount = this.vertexArray.length; for (let i = 0; i < vertexCount; i += 1) { @@ -537,7 +537,7 @@ class mxFastOrganicLayout extends mxGraphLayout { } } } - }; + } /** * Function: reduceTemperature @@ -545,10 +545,10 @@ class mxFastOrganicLayout extends mxGraphLayout { * Reduces the temperature of the layout from an initial setting in a linear * fashion to zero. */ - reduceTemperature = () => { + reduceTemperature() { this.temperature = this.initialTemp * (1.0 - this.iteration / this.maxIterations); - }; + } } export default mxFastOrganicLayout; diff --git a/src/mxgraph/layout/mxGraphLayout.js b/src/mxgraph/layout/mxGraphLayout.js index 9904d9186..f6aa9cf80 100644 --- a/src/mxgraph/layout/mxGraphLayout.js +++ b/src/mxgraph/layout/mxGraphLayout.js @@ -4,11 +4,11 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxDictionary from "../util/mxDictionary"; +import mxDictionary from '../util/mxDictionary'; import mxRectangle from '../util/mxRectangle'; -import mxGeometry from "../model/mxGeometry"; -import mxPoint from "../util/mxPoint"; -import mxConstants from "../util/mxConstants"; +import mxGeometry from '../model/mxGeometry'; +import mxPoint from '../util/mxPoint'; +import mxConstants from '../util/mxConstants'; class mxGraphLayout { /** @@ -74,7 +74,7 @@ class mxGraphLayout { * x - X-coordinate of the new cell location. * y - Y-coordinate of the new cell location. */ - moveCell = (cell, x, y) => {}; + moveCell(cell, x, y) {} /** * Function: resizeCell @@ -89,7 +89,7 @@ class mxGraphLayout { * cell - which has been moved. * bounds - that represents the new cell bounds. */ - resizeCell = (cell, bounds) => {}; + resizeCell(cell, bounds) {} /** * Function: execute @@ -100,16 +100,16 @@ class mxGraphLayout { * * parent - whose children should be layed out. */ - execute = parent => {}; + execute(parent) {} /** * Function: getGraph * * Returns the graph that this layout operates on. */ - getGraph = () => { + getGraph() { return this.graph; - }; + } /** * Function: getConstraint @@ -128,9 +128,9 @@ class mxGraphLayout { * source - Optional boolean that specifies if the connection is incoming * or outgoing. Default is null. */ - getConstraint = (key, cell, edge, source) => { + getConstraint(key, cell, edge, source) { return this.graph.getCurrentCellStyle(cell)[key]; - }; + } /** * Function: traverse @@ -163,7 +163,7 @@ class mxGraphLayout { * null for the first step of the traversal. * visited - Optional of cell paths for the visited cells. */ - traverse = (vertex, directed, func, edge, visited) => { + traverse(vertex, directed, func, edge, visited) { if (func != null && vertex != null) { directed = directed != null ? directed : true; visited = visited || new mxDictionary(); @@ -189,7 +189,7 @@ class mxGraphLayout { } } } - }; + } /** * Function: isAncestor @@ -202,7 +202,7 @@ class mxGraphLayout { * child - that specifies the child. * traverseAncestors - boolean whether to */ - isAncestor = (parent, child, traverseAncestors) => { + isAncestor(parent, child, traverseAncestors) { if (!traverseAncestors) { return this.graph.model.getParent(child) === parent; } @@ -216,7 +216,7 @@ class mxGraphLayout { } return child === parent; - }; + } /** * Function: isVertexMovable @@ -229,9 +229,9 @@ class mxGraphLayout { * * cell - whose movable state should be returned. */ - isVertexMovable = cell => { + isVertexMovable(cell) { return this.graph.isCellMovable(cell); - }; + } /** * Function: isVertexIgnored @@ -243,12 +243,12 @@ class mxGraphLayout { * * vertex - whose ignored state should be returned. */ - isVertexIgnored = vertex => { + isVertexIgnored(vertex) { return ( !this.graph.getModel().isVertex(vertex) || !this.graph.isCellVisible(vertex) ); - }; + } /** * Function: isEdgeIgnored @@ -260,7 +260,7 @@ class mxGraphLayout { * * cell - whose ignored state should be returned. */ - isEdgeIgnored = edge => { + isEdgeIgnored(edge) { const model = this.graph.getModel(); return ( @@ -269,29 +269,29 @@ class mxGraphLayout { model.getTerminal(edge, true) == null || model.getTerminal(edge, false) == null ); - }; + } /** * Function: setEdgeStyleEnabled * * Disables or enables the edge style of the given edge. */ - setEdgeStyleEnabled = (edge, value) => { + setEdgeStyleEnabled(edge, value) { this.graph.setCellStyles(mxConstants.STYLE_NOEDGESTYLE, value ? '0' : '1', [ edge, ]); - }; + } /** * Function: setOrthogonalEdge * * Disables or enables orthogonal end segments of the given edge. */ - setOrthogonalEdge = (edge, value) => { + setOrthogonalEdge(edge, value) { this.graph.setCellStyles(mxConstants.STYLE_ORTHOGONAL, value ? '1' : '0', [ edge, ]); - }; + } /** * Function: getParentOffset @@ -299,7 +299,7 @@ class mxGraphLayout { * Determines the offset of the given parent to the parent * of the layout */ - getParentOffset = parent => { + getParentOffset(parent) { const result = new mxPoint(); if (parent != null && parent !== this.parent) { @@ -320,7 +320,7 @@ class mxGraphLayout { } return result; - }; + } /** * Function: setEdgePoints @@ -328,7 +328,7 @@ class mxGraphLayout { * Replaces the array of mxPoints in the geometry of the given edge * with the given array of mxPoints. */ - setEdgePoints = (edge, points) => { + setEdgePoints(edge, points) { if (edge != null) { const { model } = this.graph; let geometry = model.getGeometry(edge); @@ -354,7 +354,7 @@ class mxGraphLayout { geometry.points = points; model.setGeometry(edge, geometry); } - }; + } /** * Function: setVertexLocation @@ -371,7 +371,7 @@ class mxGraphLayout { * x - Integer that defines the x-coordinate of the new location. * y - Integer that defines the y-coordinate of the new location. */ - setVertexLocation = (cell, x, y) => { + setVertexLocation(cell, x, y) { const model = this.graph.getModel(); let geometry = model.getGeometry(cell); let result = null; @@ -425,7 +425,7 @@ class mxGraphLayout { } return result; - }; + } /** * Function: getVertexBounds @@ -433,7 +433,7 @@ class mxGraphLayout { * Returns an that defines the bounds of the given cell or * the bounding box if is true. */ - getVertexBounds = cell => { + getVertexBounds(cell) { let geo = this.graph.getModel().getGeometry(cell); // Checks for oversize label bounding box and corrects @@ -478,21 +478,21 @@ class mxGraphLayout { } return new mxRectangle(geo.x, geo.y, geo.width, geo.height); - }; + } /** * Function: arrangeGroups * * Shortcut to with moveGroup set to true. */ - arrangeGroups = ( + arrangeGroups( cells, border, topBorder, rightBorder, bottomBorder, leftBorder - ) => { + ) { return this.graph.updateGroupBounds( cells, border, @@ -502,7 +502,7 @@ class mxGraphLayout { bottomBorder, leftBorder ); - }; + } } export default mxGraphLayout; diff --git a/src/mxgraph/layout/mxParallelEdgeLayout.js b/src/mxgraph/layout/mxParallelEdgeLayout.js index cf5959829..17534778e 100644 --- a/src/mxgraph/layout/mxParallelEdgeLayout.js +++ b/src/mxgraph/layout/mxParallelEdgeLayout.js @@ -4,9 +4,9 @@ * Updated to ES9 syntax by David Morrissey 2021 */ -import mxPoint from "../util/mxPoint"; -import mxGraphLayout from "./mxGraphLayout"; -import mxObjectIdentity from "../util/mxObjectIdentity"; +import mxPoint from '../util/mxPoint'; +import mxGraphLayout from './mxGraphLayout'; +import mxObjectIdentity from '../util/mxObjectIdentity'; class mxParallelEdgeLayout extends mxGraphLayout { /** @@ -76,7 +76,7 @@ class mxParallelEdgeLayout extends mxGraphLayout { * * Implements . */ - execute = (parent, cells) => { + execute(parent, cells) { const lookup = this.findParallels(parent, cells); this.graph.model.beginUpdate(); @@ -91,14 +91,14 @@ class mxParallelEdgeLayout extends mxGraphLayout { } finally { this.graph.model.endUpdate(); } - }; + } /** * Function: findParallels * * Finds the parallel edges in the given parent. */ - findParallels = (parent, cells) => { + findParallels(parent, cells) { const lookup = []; const addCell = cell => { @@ -129,7 +129,7 @@ class mxParallelEdgeLayout extends mxGraphLayout { } return lookup; - }; + } /** * Function: getEdgeId @@ -138,7 +138,7 @@ class mxParallelEdgeLayout extends mxGraphLayout { * edge direction and is built using the visible terminal of the given * edge. */ - getEdgeId = edge => { + getEdgeId(edge) { const view = this.graph.getView(); // Cannot used cached visible terminal because this could be triggered in BEFORE_UNDO @@ -172,14 +172,14 @@ class mxParallelEdgeLayout extends mxGraphLayout { } return null; - }; + } /** * Function: layout * * Lays out the parallel edges in the given array. */ - layout = parallels => { + layout(parallels) { const edge = parallels[0]; const view = this.graph.getView(); const model = this.graph.getModel(); @@ -228,18 +228,18 @@ class mxParallelEdgeLayout extends mxGraphLayout { } } } - }; + } /** * Function: route * * Routes the given edge via the given point. */ - route = (edge, x, y) => { + route(edge, x, y) { if (this.graph.isCellMovable(edge)) { this.setEdgePoints(edge, [new mxPoint(x, y)]); } - }; + } } export default mxParallelEdgeLayout; diff --git a/src/mxgraph/layout/mxPartitionLayout.js b/src/mxgraph/layout/mxPartitionLayout.js index f3612c6fd..df2541b22 100644 --- a/src/mxgraph/layout/mxPartitionLayout.js +++ b/src/mxgraph/layout/mxPartitionLayout.js @@ -73,16 +73,16 @@ class mxPartitionLayout extends mxGraphLayout { * * Returns . */ - isHorizontal = () => { + isHorizontal() { return this.horizontal; - }; + } /** * Function: moveCell * * Implements . */ - moveCell = (cell, x, y) => { + moveCell(cell, x, y) { const model = this.graph.getModel(); const parent = model.getParent(cell); @@ -114,7 +114,7 @@ class mxPartitionLayout extends mxGraphLayout { model.add(parent, cell, idx); } - }; + } /** * Function: execute @@ -122,7 +122,7 @@ class mxPartitionLayout extends mxGraphLayout { * Implements . All children where * returns false and returns true are modified. */ - execute = parent => { + execute(parent) { const horizontal = this.isHorizontal(); const model = this.graph.getModel(); let pgeo = model.getGeometry(parent); @@ -212,7 +212,7 @@ class mxPartitionLayout extends mxGraphLayout { } } } - }; + } } export default mxPartitionLayout; diff --git a/src/mxgraph/layout/mxRadialTreeLayout.js b/src/mxgraph/layout/mxRadialTreeLayout.js index 4ebeb8ec3..a363e415b 100644 --- a/src/mxgraph/layout/mxRadialTreeLayout.js +++ b/src/mxgraph/layout/mxRadialTreeLayout.js @@ -130,12 +130,12 @@ class mxRadialTreeLayout extends mxCompactTreeLayout { * * vertex - whose ignored state should be returned. */ - isVertexIgnored = vertex => { + isVertexIgnored(vertex) { return ( super.isVertexIgnored(vertex) || this.graph.getConnections(vertex).length === 0 ); - }; + } /** * Function: execute @@ -151,7 +151,7 @@ class mxRadialTreeLayout extends mxCompactTreeLayout { * parent - whose children should be laid out. * root - Optional that will be used as the root of the tree. */ - execute = (parent, root) => { + execute(parent, root) { this.parent = parent; this.useBoundingBox = false; @@ -254,7 +254,7 @@ class mxRadialTreeLayout extends mxCompactTreeLayout { ); } } - }; + } /** * Function: calcRowDims @@ -266,7 +266,7 @@ class mxRadialTreeLayout extends mxCompactTreeLayout { * row - Array of internal nodes, the children of which are to be processed. * rowNum - Integer indicating which row is being processed. */ - calcRowDims = (row, rowNum) => { + calcRowDims(row, rowNum) { if (row == null || row.length === 0) { return; } @@ -315,7 +315,7 @@ class mxRadialTreeLayout extends mxCompactTreeLayout { if (rowHasChildren) { this.calcRowDims(this.row[rowNum], rowNum + 1); } - }; + } } export default mxRadialTreeLayout; diff --git a/src/mxgraph/layout/mxStackLayout.js b/src/mxgraph/layout/mxStackLayout.js index 37772c08a..18e095398 100644 --- a/src/mxgraph/layout/mxStackLayout.js +++ b/src/mxgraph/layout/mxStackLayout.js @@ -3,10 +3,10 @@ * Copyright (c) 2006-2015, Gaudenz Alder * Updated to ES9 syntax by David Morrissey 2021 */ -import mxGraphLayout from "./mxGraphLayout"; -import mxRectangle from "../util/mxRectangle"; -import mxUtils from "../util/mxUtils"; -import mxConstants from "../util/mxConstants"; +import mxGraphLayout from './mxGraphLayout'; +import mxRectangle from '../util/mxRectangle'; +import mxUtils from '../util/mxUtils'; +import mxConstants from '../util/mxConstants'; class mxStackLayout extends mxGraphLayout { /** @@ -173,16 +173,16 @@ class mxStackLayout extends mxGraphLayout { * * Returns . */ - isHorizontal = () => { + isHorizontal() { return this.horizontal; - }; + } /** * Function: moveCell * * Implements . */ - moveCell = (cell, x, y) => { + moveCell(cell, x, y) { const model = this.graph.getModel(); const parent = model.getParent(cell); const horizontal = this.isHorizontal(); @@ -226,7 +226,7 @@ class mxStackLayout extends mxGraphLayout { model.add(parent, cell, idx); } - }; + } /** * Function: getParentSize @@ -234,7 +234,7 @@ class mxStackLayout extends mxGraphLayout { * Returns the size for the parent container or the size of the graph * container if the parent is a layer or the root of the model. */ - getParentSize = parent => { + getParentSize(parent) { const model = this.graph.getModel(); let pgeo = model.getGeometry(parent); @@ -252,14 +252,14 @@ class mxStackLayout extends mxGraphLayout { } return pgeo; - }; + } /** * Function: getLayoutCells * * Returns the cells to be layouted. */ - getLayoutCells = parent => { + getLayoutCells(parent) { const model = this.graph.getModel(); const childCount = model.getChildCount(parent); const cells = []; @@ -292,14 +292,14 @@ class mxStackLayout extends mxGraphLayout { } return cells; - }; + } /** * Function: snap * * Snaps the given value to the grid size. */ - snap = value => { + snap(value) { if (this.gridSize != null && this.gridSize > 0) { value = Math.max(value, this.gridSize); @@ -310,7 +310,7 @@ class mxStackLayout extends mxGraphLayout { } return value; - }; + } /** * Function: execute @@ -320,7 +320,7 @@ class mxStackLayout extends mxGraphLayout { * Only children where returns false are taken into * account. */ - execute = parent => { + execute(parent) { if (parent != null) { const pgeo = this.getParentSize(parent); const horizontal = this.isHorizontal(); @@ -515,7 +515,7 @@ class mxStackLayout extends mxGraphLayout { model.endUpdate(); } } - }; + } /** * Function: setChildGeometry @@ -527,7 +527,7 @@ class mxStackLayout extends mxGraphLayout { * child - The given child of . * geo - The specific geometry of . */ - setChildGeometry = (child, geo) => { + setChildGeometry(child, geo) { const geo2 = this.graph.getCellGeometry(child); if ( @@ -539,7 +539,7 @@ class mxStackLayout extends mxGraphLayout { ) { this.graph.getModel().setGeometry(child, geo); } - }; + } /** * Function: updateParentGeometry @@ -552,7 +552,7 @@ class mxStackLayout extends mxGraphLayout { * pgeo - The new for parent. * last - The last . */ - updateParentGeometry = (parent, pgeo, last) => { + updateParentGeometry(parent, pgeo, last) { const horizontal = this.isHorizontal(); const model = this.graph.getModel(); @@ -584,7 +584,7 @@ class mxStackLayout extends mxGraphLayout { ) { model.setGeometry(parent, pgeo2); } - }; + } } export default mxStackLayout; diff --git a/src/mxgraph/model/atomic_changes/mxCellAttributeChange.js b/src/mxgraph/model/atomic_changes/mxCellAttributeChange.js index 4fbc2e108..342ff3241 100644 --- a/src/mxgraph/model/atomic_changes/mxCellAttributeChange.js +++ b/src/mxgraph/model/atomic_changes/mxCellAttributeChange.js @@ -44,7 +44,7 @@ class mxCellAttributeChange { * Changes the attribute of the cell's user object by * using . */ - execute = () => { + execute() { if (this.cell != null) { const tmp = this.cell.getAttribute(this.attribute); @@ -56,7 +56,7 @@ class mxCellAttributeChange { this.previous = tmp; } - }; + } } export default mxCellAttributeChange; diff --git a/src/mxgraph/model/atomic_changes/mxChildChange.js b/src/mxgraph/model/atomic_changes/mxChildChange.js index 589848a17..d9e3622ed 100644 --- a/src/mxgraph/model/atomic_changes/mxChildChange.js +++ b/src/mxgraph/model/atomic_changes/mxChildChange.js @@ -26,7 +26,7 @@ class mxChildChange { * removes or restores the cell's * connections. */ - execute = () => { + execute() { if (this.child != null) { let tmp = this.model.getParent(this.child); const tmp2 = tmp != null ? tmp.getIndex(this.child) : 0; @@ -50,7 +50,7 @@ class mxChildChange { this.index = this.previousIndex; this.previousIndex = tmp2; } - }; + } /** * Function: disconnect @@ -59,7 +59,7 @@ class mxChildChange { * terminals and stores the previous terminal in the * cell's terminals. */ - connect = (cell, isConnect) => { + connect(cell, isConnect) { isConnect = isConnect != null ? isConnect : true; const source = cell.getTerminal(true); @@ -89,7 +89,7 @@ class mxChildChange { for (let i = 0; i < childCount; i += 1) { this.connect(this.model.getChildAt(cell, i), isConnect); } - }; + } } export default mxChildChange; diff --git a/src/mxgraph/model/atomic_changes/mxCollapseChange.js b/src/mxgraph/model/atomic_changes/mxCollapseChange.js index b7a80d9ff..2fe2329fc 100644 --- a/src/mxgraph/model/atomic_changes/mxCollapseChange.js +++ b/src/mxgraph/model/atomic_changes/mxCollapseChange.js @@ -22,7 +22,7 @@ class mxCollapseChange { * Changes the collapsed state of to using * . */ - execute = () => { + execute() { if (this.cell != null) { this.collapsed = this.previous; this.previous = this.model.collapsedStateForCellChanged( @@ -30,7 +30,7 @@ class mxCollapseChange { this.previous ); } - }; + } } export default mxCollapseChange; diff --git a/src/mxgraph/model/atomic_changes/mxGeometryChange.js b/src/mxgraph/model/atomic_changes/mxGeometryChange.js index 4d60095b4..0d692f03c 100644 --- a/src/mxgraph/model/atomic_changes/mxGeometryChange.js +++ b/src/mxgraph/model/atomic_changes/mxGeometryChange.js @@ -22,7 +22,7 @@ class mxGeometryChange { * Changes the geometry of ro using * . */ - execute = () => { + execute() { if (this.cell != null) { this.geometry = this.previous; this.previous = this.model.geometryForCellChanged( @@ -30,7 +30,7 @@ class mxGeometryChange { this.previous ); } - }; + } } export default mxGeometryChange; diff --git a/src/mxgraph/model/atomic_changes/mxRootChange.js b/src/mxgraph/model/atomic_changes/mxRootChange.js index 0a5f952f5..7fde990b8 100644 --- a/src/mxgraph/model/atomic_changes/mxRootChange.js +++ b/src/mxgraph/model/atomic_changes/mxRootChange.js @@ -21,10 +21,10 @@ class mxRootChange { * Carries out a change of the root using * . */ - execute = () => { + execute() { this.root = this.previous; this.previous = this.model.rootChanged(this.previous); - }; + } } export default mxRootChange; diff --git a/src/mxgraph/model/atomic_changes/mxStyleChange.js b/src/mxgraph/model/atomic_changes/mxStyleChange.js index c6e3bbed0..78d31d7d1 100644 --- a/src/mxgraph/model/atomic_changes/mxStyleChange.js +++ b/src/mxgraph/model/atomic_changes/mxStyleChange.js @@ -22,12 +22,12 @@ class mxStyleChange { * Changes the style of to using * . */ - execute = () => { + execute() { if (this.cell != null) { this.style = this.previous; this.previous = this.model.styleForCellChanged(this.cell, this.previous); } - }; + } } export default mxStyleChange; diff --git a/src/mxgraph/model/atomic_changes/mxTerminalChange.js b/src/mxgraph/model/atomic_changes/mxTerminalChange.js index 671e225a5..fc0b89727 100644 --- a/src/mxgraph/model/atomic_changes/mxTerminalChange.js +++ b/src/mxgraph/model/atomic_changes/mxTerminalChange.js @@ -23,7 +23,7 @@ class mxTerminalChange { * Changes the terminal of to using * . */ - execute = () => { + execute() { if (this.cell != null) { this.terminal = this.previous; this.previous = this.model.terminalForCellChanged( @@ -32,7 +32,7 @@ class mxTerminalChange { this.source ); } - }; + } } export default mxTerminalChange; diff --git a/src/mxgraph/model/atomic_changes/mxValueChange.js b/src/mxgraph/model/atomic_changes/mxValueChange.js index 618e8d1b6..212ec6783 100644 --- a/src/mxgraph/model/atomic_changes/mxValueChange.js +++ b/src/mxgraph/model/atomic_changes/mxValueChange.js @@ -22,11 +22,11 @@ class mxValueChange { * Changes the value of to using * . */ - execute = () => { + execute() { if (this.cell != null) { this.value = this.previous; this.previous = this.model.valueForCellChanged(this.cell, this.previous); } - }; + } } export default mxValueChange; diff --git a/src/mxgraph/model/atomic_changes/mxVisibleChange.js b/src/mxgraph/model/atomic_changes/mxVisibleChange.js index ccda4e353..e8094553f 100644 --- a/src/mxgraph/model/atomic_changes/mxVisibleChange.js +++ b/src/mxgraph/model/atomic_changes/mxVisibleChange.js @@ -22,7 +22,7 @@ class mxVisibleChange { * Changes the visible state of to using * . */ - execute = () => { + execute() { if (this.cell != null) { this.visible = this.previous; this.previous = this.model.visibleStateForCellChanged( @@ -30,7 +30,7 @@ class mxVisibleChange { this.previous ); } - }; + } } export default mxVisibleChange; diff --git a/src/mxgraph/model/mxCell.js b/src/mxgraph/model/mxCell.js index 0912a579b..5237c64e3 100644 --- a/src/mxgraph/model/mxCell.js +++ b/src/mxgraph/model/mxCell.js @@ -203,18 +203,18 @@ class mxCell { * * Returns the Id of the cell as a string. */ - getId = () => { + getId() { return this.id; - }; + } /** * Function: setId * * Sets the Id of the cell to the given string. */ - setId = id => { + setId(id) { this.id = id; - }; + } /** * Function: getValue @@ -222,9 +222,9 @@ class mxCell { * Returns the user object of the cell. The user * object is stored in . */ - getValue = () => { + getValue() { return this.value; - }; + } /** * Function: setValue @@ -232,9 +232,9 @@ class mxCell { * Sets the user object of the cell. The user object * is stored in . */ - setValue = value => { + setValue(value) { this.value = value; - }; + } /** * Function: valueChanged @@ -244,57 +244,57 @@ class mxCell { * replaces the user object with the given value and * returns the old user object. */ - valueChanged = newValue => { + valueChanged(newValue) { const previous = this.getValue(); this.setValue(newValue); return previous; - }; + } /** * Function: getGeometry * * Returns the that describes the . */ - getGeometry = () => { + getGeometry() { return this.geometry; - }; + } /** * Function: setGeometry * * Sets the to be used as the . */ - setGeometry = geometry => { + setGeometry(geometry) { this.geometry = geometry; - }; + } /** * Function: getStyle * * Returns a string that describes the '); - }; + } /** * Function: writePostfix * * Called before closing the body of the page. This implementation is empty. */ - writePostfix = doc => { + writePostfix(doc) { // empty - }; + } /** * Function: createPageSelector * * Creates the page selector table. */ - createPageSelector = (vpages, hpages) => { + createPageSelector(vpages, hpages) { const doc = this.wnd.document; const table = doc.createElement('table'); table.className = 'mxPageSelector'; @@ -756,7 +756,7 @@ class mxPrintPreview { table.appendChild(tbody); return table; - }; + } /** * Function: renderPage @@ -775,7 +775,7 @@ class mxPrintPreview { * Takes the inner div as the argument. * pageNumber - Integer representing the page number. */ - renderPage = (w, h, dx, dy, content, pageNumber) => { + renderPage(w, h, dx, dy, content, pageNumber) { const doc = this.wnd.document; let div = document.createElement('div'); let arg = null; @@ -836,14 +836,14 @@ class mxPrintPreview { content(arg); return div; - }; + } /** * Function: getRoot * * Returns the root cell for painting the graph. */ - getRoot = () => { + getRoot() { let root = this.graph.view.currentRoot; if (root == null) { @@ -851,7 +851,7 @@ class mxPrintPreview { } return root; - }; + } /** * Function: useCssTransforms @@ -860,9 +860,9 @@ class mxPrintPreview { * This returns true if foreignObject is supported and we're not in Safari * as it has clipping bugs for transformed CSS content with foreignObjects. */ - useCssTransforms = () => { + useCssTransforms() { return !mxClient.NO_FO && !mxClient.IS_SF; - }; + } /** * Function: addGraphFragment @@ -878,7 +878,7 @@ class mxPrintPreview { * div - Div that contains the output. * clip - Contains the clipping rectangle as an . */ - addGraphFragment = (dx, dy, scale, pageNumber, div, clip) => { + addGraphFragment(dx, dy, scale, pageNumber, div, clip) { const view = this.graph.getView(); const previousContainer = this.graph.container; this.graph.container = div; @@ -1022,23 +1022,23 @@ class mxPrintPreview { temp.destroy(); view.setEventsEnabled(eventsEnabled); } - }; + } /** * Function: getLinkForCellState * * Returns the link for the given cell state. This returns null. */ - getLinkForCellState = state => { + getLinkForCellState(state) { return this.graph.getLinkForCell(state.cell); - }; + } /** * Function: insertBackgroundImage * * Inserts the background image into the given div. */ - insertBackgroundImage = (div, dx, dy) => { + insertBackgroundImage(div, dx, dy) { const bg = this.graph.backgroundImage; if (bg != null) { @@ -1052,25 +1052,25 @@ class mxPrintPreview { div.insertBefore(img, div.firstChild); } - }; + } /** * Function: getCoverPages * * Returns the pages to be added before the print output. This returns null. */ - getCoverPages = () => { + getCoverPages() { return null; - }; + } /** * Function: getAppendices * * Returns the pages to be added after the print output. This returns null. */ - getAppendices = () => { + getAppendices() { return null; - }; + } /** * Function: print @@ -1081,25 +1081,25 @@ class mxPrintPreview { * * css - Optional CSS string to be used in the head section. */ - print = css => { + print(css) { const wnd = this.open(css); if (wnd != null) { wnd.print(); } - }; + } /** * Function: close * * Closes the print preview window. */ - close = () => { + close() { if (this.wnd != null) { this.wnd.close(); this.wnd = null; } - }; + } } export default mxPrintPreview; diff --git a/src/mxgraph/view/mxSelectionChange.js b/src/mxgraph/view/mxSelectionChange.js index aa90a11e3..321756961 100644 --- a/src/mxgraph/view/mxSelectionChange.js +++ b/src/mxgraph/view/mxSelectionChange.js @@ -24,7 +24,7 @@ class mxSelectionChange { * * Changes the current root of the view. */ - execute = () => { + execute() { const t0 = mxLog.enter('mxSelectionChange.execute'); window.status = mxResources.get(this.selectionModel.updatingSelectionResource) || @@ -60,7 +60,7 @@ class mxSelectionChange { this.removed ) ); - }; + } } export default mxSelectionChange; diff --git a/src/mxgraph/view/mxStylesheet.js b/src/mxgraph/view/mxStylesheet.js index 4e61fc7aa..b1d8b2052 100644 --- a/src/mxgraph/view/mxStylesheet.js +++ b/src/mxgraph/view/mxStylesheet.js @@ -76,7 +76,7 @@ class mxStylesheet { * * Creates and returns the default vertex style. */ - createDefaultVertexStyle = () => { + createDefaultVertexStyle() { const style = {}; style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE; style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter; @@ -86,14 +86,14 @@ class mxStylesheet { style[mxConstants.STYLE_STROKECOLOR] = '#6482B9'; style[mxConstants.STYLE_FONTCOLOR] = '#774400'; return style; - }; + } /** * Function: createDefaultEdgeStyle * * Creates and returns the default edge style. */ - createDefaultEdgeStyle = () => { + createDefaultEdgeStyle() { const style = {}; style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_CONNECTOR; style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_CLASSIC; @@ -102,7 +102,7 @@ class mxStylesheet { style[mxConstants.STYLE_STROKECOLOR] = '#6482B9'; style[mxConstants.STYLE_FONTCOLOR] = '#446299'; return style; - }; + } /** * Function: putDefaultVertexStyle @@ -113,36 +113,36 @@ class mxStylesheet { * Parameters: * style - Key, value pairs that define the style. */ - putDefaultVertexStyle = style => { + putDefaultVertexStyle(style) { this.putCellStyle('defaultVertex', style); - }; + } /** * Function: putDefaultEdgeStyle * * Sets the default style for edges using defaultEdge as the stylename. */ - putDefaultEdgeStyle = style => { + putDefaultEdgeStyle(style) { this.putCellStyle('defaultEdge', style); - }; + } /** * Function: getDefaultVertexStyle * * Returns the default style for vertices. */ - getDefaultVertexStyle = () => { + getDefaultVertexStyle() { return this.styles.defaultVertex; - }; + } /** * Function: getDefaultEdgeStyle * * Sets the default style for edges. */ - getDefaultEdgeStyle = () => { + getDefaultEdgeStyle() { return this.styles.defaultEdge; - }; + } /** * Function: putCellStyle @@ -181,9 +181,9 @@ class mxStylesheet { * name - Name for the style to be stored. * style - Key, value pairs that define the style. */ - putCellStyle = (name, style) => { + putCellStyle(name, style) { this.styles[name] = style; - }; + } /** * Function: getCellStyle @@ -197,7 +197,7 @@ class mxStylesheet { * style. * defaultStyle - Default style to be returned if no style can be found. */ - getCellStyle = (name, defaultStyle) => { + getCellStyle(name, defaultStyle) { let style = defaultStyle; if (name != null && name.length > 0) { @@ -238,7 +238,7 @@ class mxStylesheet { } } return style; - }; + } } export default mxStylesheet; diff --git a/src/mxgraph/view/mxSwimlaneManager.js b/src/mxgraph/view/mxSwimlaneManager.js index c12c49411..975ea2311 100644 --- a/src/mxgraph/view/mxSwimlaneManager.js +++ b/src/mxgraph/view/mxSwimlaneManager.js @@ -99,9 +99,9 @@ class mxSwimlaneManager extends mxEventSource { * Returns true if events are handled. This implementation * returns . */ - isEnabled = () => { + isEnabled() { return this.enabled; - }; + } /** * Function: setEnabled @@ -113,79 +113,79 @@ class mxSwimlaneManager extends mxEventSource { * * enabled - Boolean that specifies the new enabled state. */ - setEnabled = value => { + setEnabled(value) { this.enabled = value; - }; + } /** * Function: isHorizontal * * Returns . */ - isHorizontal = () => { + isHorizontal() { return this.horizontal; - }; + } /** * Function: setHorizontal * * Sets . */ - setHorizontal = value => { + setHorizontal(value) { this.horizontal = value; - }; + } /** * Function: isAddEnabled * * Returns . */ - isAddEnabled = () => { + isAddEnabled() { return this.addEnabled; - }; + } /** * Function: setAddEnabled * * Sets . */ - setAddEnabled = value => { + setAddEnabled(value) { this.addEnabled = value; - }; + } /** * Function: isResizeEnabled * * Returns . */ - isResizeEnabled = () => { + isResizeEnabled() { return this.resizeEnabled; - }; + } /** * Function: setResizeEnabled * * Sets . */ - setResizeEnabled = value => { + setResizeEnabled(value) { this.resizeEnabled = value; - }; + } /** * Function: getGraph * * Returns the graph that this manager operates on. */ - getGraph = () => { + getGraph() { return this.graph; - }; + } /** * Function: setGraph * * Sets the graph that the manager operates on. */ - setGraph = graph => { + setGraph(graph) { if (this.graph != null) { this.graph.removeListener(this.addHandler); this.graph.removeListener(this.resizeHandler); @@ -197,16 +197,16 @@ class mxSwimlaneManager extends mxEventSource { this.graph.addListener(mxEvent.ADD_CELLS, this.addHandler); this.graph.addListener(mxEvent.CELLS_RESIZED, this.resizeHandler); } - }; + } /** * Function: isSwimlaneIgnored * * Returns true if the given swimlane should be ignored. */ - isSwimlaneIgnored = swimlane => { + isSwimlaneIgnored(swimlane) { return !this.getGraph().isSwimlane(swimlane); - }; + } /** * Function: isCellHorizontal @@ -214,7 +214,7 @@ class mxSwimlaneManager extends mxEventSource { * Returns true if the given cell is horizontal. If the given cell is not a * swimlane, then the global orientation is returned. */ - isCellHorizontal = cell => { + isCellHorizontal(cell) { if (this.graph.isSwimlane(cell)) { const style = this.graph.getCellStyle(cell); @@ -222,7 +222,7 @@ class mxSwimlaneManager extends mxEventSource { } return !this.isHorizontal(); - }; + } /** * Function: cellsAdded @@ -233,7 +233,7 @@ class mxSwimlaneManager extends mxEventSource { * * cell - Array of that have been added. */ - cellsAdded = cells => { + cellsAdded(cells) { if (cells != null) { const model = this.getGraph().getModel(); @@ -248,7 +248,7 @@ class mxSwimlaneManager extends mxEventSource { model.endUpdate(); } } - }; + } /** * Function: swimlaneAdded @@ -260,7 +260,7 @@ class mxSwimlaneManager extends mxEventSource { * * swimlane - that represents the new swimlane. */ - swimlaneAdded = swimlane => { + swimlaneAdded(swimlane) { const model = this.getGraph().getModel(); const parent = model.getParent(swimlane); const childCount = model.getChildCount(parent); @@ -285,7 +285,7 @@ class mxSwimlaneManager extends mxEventSource { parent != null ? this.isCellHorizontal(parent) : this.horizontal; this.resizeSwimlane(swimlane, geo.width, geo.height, parentHorizontal); } - }; + } /** * Function: cellsResized @@ -297,7 +297,7 @@ class mxSwimlaneManager extends mxEventSource { * * cells - Array of whose size was changed. */ - cellsResized = cells => { + cellsResized(cells) { if (cells != null) { const model = this.getGraph().getModel(); @@ -340,7 +340,7 @@ class mxSwimlaneManager extends mxEventSource { model.endUpdate(); } } - }; + } /** * Function: resizeSwimlane @@ -353,7 +353,7 @@ class mxSwimlaneManager extends mxEventSource { * * swimlane - whose size has changed. */ - resizeSwimlane = (swimlane, w, h, parentHorizontal) => { + resizeSwimlane(swimlane, w, h, parentHorizontal) { const model = this.getGraph().getModel(); model.beginUpdate(); @@ -396,16 +396,16 @@ class mxSwimlaneManager extends mxEventSource { } finally { model.endUpdate(); } - }; + } /** * Function: destroy * * Removes all handlers from the and deletes the reference to it. */ - destroy = () => { + destroy() { this.setGraph(null); - }; + } } export default mxSwimlaneManager; diff --git a/src/mxgraph/view/mxTemporaryCellStates.js b/src/mxgraph/view/mxTemporaryCellStates.js index d07d2e459..c72b89a19 100644 --- a/src/mxgraph/view/mxTemporaryCellStates.js +++ b/src/mxgraph/view/mxTemporaryCellStates.js @@ -116,13 +116,13 @@ class mxTemporaryCellStates { * * Returns the top, left corner as a new . */ - destroy = () => { + destroy() { this.view.setScale(this.oldScale); this.view.setStates(this.oldStates); this.view.setGraphBounds(this.oldBounds); this.view.validateCellState = this.oldValidateCellState; this.view.graph.cellRenderer.doRedrawShape = this.oldDoRedrawShape; - }; + } } export default mxTemporaryCellStates; diff --git a/src/pages/_app.js b/src/pages/_app.js index 7fd92ed0e..08f1033a5 100644 --- a/src/pages/_app.js +++ b/src/pages/_app.js @@ -1,8 +1,8 @@ -import '../styles/globals.css' -import "../public/css/common.css"; +import '../styles/globals.css'; +import '../public/css/common.css'; function MyApp({ Component, pageProps }) { - return + return ; } -export default MyApp +export default MyApp; diff --git a/src/pages/api/hello.js b/src/pages/api/hello.js index 9987aff4c..9a0d9bf55 100644 --- a/src/pages/api/hello.js +++ b/src/pages/api/hello.js @@ -1,5 +1,5 @@ // Next.js API route support: https://nextjs.org/docs/api-routes/introduction export default (req, res) => { - res.status(200).json({ name: 'John Doe' }) -} + res.status(200).json({ name: 'John Doe' }); +}; diff --git a/src/pages/index.js b/src/pages/index.js index 51bbc6578..5ab29e277 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,10 +1,11 @@ -import Head from 'next/head' -import styles from '../styles/Home.module.css' -import HelloWorld from "./HelloWorld"; +import Head from 'next/head'; +import styles from '../styles/Home.module.css'; +import HelloWorld from './HelloWorld'; export default function Home() { - return <> - - ; + return ( + <> + + + ); } -