From ff309ee781d06641a6d04d4a8095a02cb9db2048 Mon Sep 17 00:00:00 2001 From: mcyph <20507948+mcyph@users.noreply.github.com> Date: Sun, 13 Jun 2021 22:29:29 +1000 Subject: [PATCH] conversions to typescript and type fixes --- packages/core/src/view/Graph.ts | 7 --- .../src/view/connection/ConnectionHandler.ts | 48 +++++++--------- .../core/src/view/drag_drop/GraphDragDrop.ts | 55 +++++++++++++++++++ packages/core/src/view/ports/GraphPorts.ts | 25 +++------ .../core/src/view/printing/PrintPreview.ts | 30 +++------- .../core/src/view/selection/RubberBand.ts | 6 +- packages/core/src/view/split/GraphSplit.ts | 36 ------------ 7 files changed, 91 insertions(+), 116 deletions(-) delete mode 100644 packages/core/src/view/split/GraphSplit.ts diff --git a/packages/core/src/view/Graph.ts b/packages/core/src/view/Graph.ts index 9731f2f28..f5003ff49 100644 --- a/packages/core/src/view/Graph.ts +++ b/packages/core/src/view/Graph.ts @@ -205,13 +205,6 @@ class Graph extends EventSource { */ dialect: 'svg' | 'mixedHtml' | 'preferHtml' | 'strictHtml' = 'svg'; - /** - * Specifies if ports are enabled. This is used in {@link cellConnected} to update - * the respective style. - * @default true - */ - portsEnabled: boolean = true; - /** * Value returned by {@link getOverlap} if {@link isAllowOverlapParent} returns * `true` for the given cell. {@link getOverlap} is used in {@link constrainChild} if diff --git a/packages/core/src/view/connection/ConnectionHandler.ts b/packages/core/src/view/connection/ConnectionHandler.ts index 812a278c2..21dc66788 100644 --- a/packages/core/src/view/connection/ConnectionHandler.ts +++ b/packages/core/src/view/connection/ConnectionHandler.ts @@ -577,7 +577,7 @@ class ConnectionHandler extends EventSource { * * Creates and returns the used in . */ - createMarker() { + createMarker(): CellMarker { const self = this; class MyCellMarker extends CellMarker { @@ -670,7 +670,7 @@ class ConnectionHandler extends EventSource { }; } - return new MyCellMarker(this.graph); + return new MyCellMarker(this.graph); } /** @@ -678,8 +678,11 @@ class ConnectionHandler extends EventSource { * * Starts a new connection for the given state and coordinates. */ - // start(state: mxCellState, x: number, y: number, edgeState: mxCellState): void; - start(state, x, y, edgeState) { + start(state: CellState, + x: number, + y: number, + edgeState: CellState): void { + this.previous = state; this.first = new Point(x, y); this.edgeState = edgeState != null ? edgeState : this.createEdgeState(null); @@ -698,8 +701,7 @@ class ConnectionHandler extends EventSource { * Returns true if the source terminal has been clicked and a new * connection is currently being previewed. */ - // isConnecting(): boolean; - isConnecting() { + isConnecting(): boolean { return this.first != null && this.shape != null; } @@ -713,8 +715,8 @@ class ConnectionHandler extends EventSource { * cell - that represents the source terminal. * me - that is associated with this call. */ - // isValidSource(cell: mxCell, me: mxMouseEvent): boolean; - isValidSource(cell, me) { + isValidSource(cell: Cell, + me: InternalMouseEvent): boolean { return this.graph.isValidSource(cell); } @@ -729,8 +731,7 @@ class ConnectionHandler extends EventSource { * * cell - that represents the target terminal. */ - // isValidTarget(cell: mxCell): boolean; - isValidTarget(cell) { + isValidTarget(cell: Cell): boolean { return true; } @@ -746,12 +747,10 @@ class ConnectionHandler extends EventSource { * source - that represents the source terminal. * target - that represents the target terminal. */ - // validateConnection(source: mxCell, target: mxCell): string; - validateConnection(source, target) { + validateConnection(source: Cell, target: Cell): string { if (!this.isValidTarget(target)) { return ''; } - return this.graph.getEdgeValidationError(null, source, target); } @@ -765,8 +764,7 @@ class ConnectionHandler extends EventSource { * * state - whose connect image should be returned. */ - // getConnectImage(state: mxCellState): mxImage; - getConnectImage(state) { + getConnectImage(state: CellState): Image { return this.connectImage; } @@ -780,15 +778,13 @@ class ConnectionHandler extends EventSource { * * state - whose connect icons should be returned. */ - // isMoveIconToFrontForState(state: mxCellState): boolean; - isMoveIconToFrontForState(state) { + isMoveIconToFrontForState(state: CellState): boolean { if ( state.text != null && state.text.node.parentNode === this.graph.container ) { return true; } - return this.moveIconFront; } @@ -872,8 +868,7 @@ class ConnectionHandler extends EventSource { * * icons - Optional array of to be redrawn. */ - // redrawIcons(icons?: mxImageShape[], state?: mxCellState): void; - redrawIcons(icons, state) { + redrawIcons(icons?: ImageShape[], state?: CellState): void { if (icons != null && icons[0] != null && state != null) { const pos = this.getIconPosition(icons[0], state); icons[0].bounds.x = pos.x; @@ -891,8 +886,7 @@ class ConnectionHandler extends EventSource { * * icons - Optional array of to be redrawn. */ - // getIconPosition(icon?: mxImageShape[], state?: mxCellState): mxPoint; - getIconPosition(icon, state) { + getIconPosition(icon?: ImageShape[], state?: CellState): Point { const { scale } = this.graph.getView(); let cx = state.getCenterX(); let cy = state.getCenterY(); @@ -916,7 +910,6 @@ class ConnectionHandler extends EventSource { cy = pt.y; } } - return new Point(cx - icon.bounds.width / 2, cy - icon.bounds.height / 2); } @@ -925,8 +918,7 @@ class ConnectionHandler extends EventSource { * * Destroys the connect icons and resets the respective state. */ - // destroyIcons(): void; - destroyIcons() { + destroyIcons(): void { if (this.icons != null) { for (let i = 0; i < this.icons.length; i += 1) { this.icons[i].destroy(); @@ -948,8 +940,7 @@ class ConnectionHandler extends EventSource { * are not null, or and are not null and * is null or and are not null. */ - // isStartEvent(me: mxMouseEvent): boolean; - isStartEvent(me) { + isStartEvent(me: InternalMouseEvent): boolean { return ( (this.constraintHandler.currentFocus !== null && this.constraintHandler.currentConstraint !== null) || @@ -964,8 +955,7 @@ class ConnectionHandler extends EventSource { * * Handles the event by initiating a new connection. */ - // mouseDown(sender: Event, me: mxMouseEvent): void; - mouseDown(sender, me) { + mouseDown(sender: any, me: InternalMouseEvent): void { this.mouseDownCounter += 1; if ( diff --git a/packages/core/src/view/drag_drop/GraphDragDrop.ts b/packages/core/src/view/drag_drop/GraphDragDrop.ts index 4542f956b..89f9371fa 100644 --- a/packages/core/src/view/drag_drop/GraphDragDrop.ts +++ b/packages/core/src/view/drag_drop/GraphDragDrop.ts @@ -1,3 +1,7 @@ +import Cell from '../cell/datatypes/Cell'; +import CellArray from '../cell/datatypes/CellArray'; +import InternalMouseEvent from '../event/InternalMouseEvent'; + class GraphDragDrop { /** * Specifies the return value for {@link isDropEnabled}. @@ -55,6 +59,57 @@ class GraphDragDrop { setDropEnabled(value: boolean): void { this.dropEnabled = value; } + + /***************************************************************************** + * Group: Split behaviour + *****************************************************************************/ + + /** + * Returns {@link splitEnabled} as a boolean. + */ + isSplitEnabled(): boolean { + return this.splitEnabled; + } + + /** + * Specifies if the graph should allow dropping of cells onto or into other + * cells. + * + * @param dropEnabled Boolean indicating if the graph should allow dropping + * of cells into other cells. + */ + setSplitEnabled(value: boolean): void { + this.splitEnabled = value; + } + + /** + * Returns true if the given edge may be splitted into two edges with the + * given cell as a new terminal between the two. + * + * @param target {@link mxCell} that represents the edge to be splitted. + * @param cells {@link mxCell} that should split the edge. + * @param evt Mouseevent that triggered the invocation. + */ + // isSplitTarget(target: mxCell, cells: mxCellArray, evt: Event): boolean; + isSplitTarget(target: Cell, cells: CellArray, evt: InternalMouseEvent): boolean { + if ( + target.isEdge() && + cells != null && + cells.length == 1 && + cells[0].isConnectable() && + this.getEdgeValidationError(target, target.getTerminal(true), cells[0]) == + null + ) { + const src = target.getTerminal(true); + const trg = target.getTerminal(false); + + return ( + !cells[0].isAncestor(src) && + !cells[0].isAncestor(trg) + ); + } + return false; + } } export default GraphDragDrop; diff --git a/packages/core/src/view/ports/GraphPorts.ts b/packages/core/src/view/ports/GraphPorts.ts index 55ef1d477..433b5b577 100644 --- a/packages/core/src/view/ports/GraphPorts.ts +++ b/packages/core/src/view/ports/GraphPorts.ts @@ -1,6 +1,13 @@ import Cell from "../cell/datatypes/Cell"; class GraphPorts { + /** + * Specifies if ports are enabled. This is used in {@link cellConnected} to update + * the respective style. + * @default true + */ + portsEnabled: boolean = true; + /***************************************************************************** * Group: Drilldown *****************************************************************************/ @@ -60,24 +67,6 @@ class GraphPorts { setPortsEnabled(value: boolean): void { this.portsEnabled = value; } - - /** - * Returns {@link splitEnabled} as a boolean. - */ - isSplitEnabled(): boolean { - return this.splitEnabled; - } - - /** - * Specifies if the graph should allow dropping of cells onto or into other - * cells. - * - * @param dropEnabled Boolean indicating if the graph should allow dropping - * of cells into other cells. - */ - setSplitEnabled(value: boolean): void { - this.splitEnabled = value; - } } export default GraphPorts; diff --git a/packages/core/src/view/printing/PrintPreview.ts b/packages/core/src/view/printing/PrintPreview.ts index 70256e6c3..3d6787e15 100644 --- a/packages/core/src/view/printing/PrintPreview.ts +++ b/packages/core/src/view/printing/PrintPreview.ts @@ -459,14 +459,8 @@ class PrintPreview { bounds.width /= sc; bounds.height /= sc; - const hpages = Math.max( - 1, - Math.ceil((bounds.width + this.x0) / availableWidth) - ); - const vpages = Math.max( - 1, - Math.ceil((bounds.height + this.y0) / availableHeight) - ); + const hpages = Math.max(1, Math.ceil((bounds.width + this.x0) / availableWidth)); + const vpages = Math.max(1, Math.ceil((bounds.height + this.y0) / availableHeight)); this.pageCount = hpages * vpages; const writePageSelector = () => { @@ -523,10 +517,7 @@ class PrintPreview { } }; - const cov = this.getCoverPages( - this.pageFormat.width, - this.pageFormat.height - ); + const cov = this.getCoverPages(this.pageFormat.width, this.pageFormat.height); if (cov != null) { for (let i = 0; i < cov.length; i += 1) { @@ -534,10 +525,7 @@ class PrintPreview { } } - const apx = this.getAppendices( - this.pageFormat.width, - this.pageFormat.height - ); + const apx = this.getAppendices(this.pageFormat.width, this.pageFormat.height); // Appends each page to the page output for printing, making // sure there will be a page break after each page (ie. div) @@ -665,9 +653,7 @@ class PrintPreview { 'font-family: Arial; font-size:10pt; border: solid 1px darkgray;' + 'background: white; border-collapse:collapse; }' ); - doc.writeln( - ' table.mxPageSelector td { border: solid 1px gray; padding:4px; }' - ); + doc.writeln(' table.mxPageSelector td { border: solid 1px gray; padding:4px; }'); doc.writeln(' body.mxPage { background: gray; }'); doc.writeln('}'); @@ -681,16 +667,14 @@ class PrintPreview { /** * Called before closing the body of the page. This implementation is empty. */ - // writePostfix(doc: Document): any; - writePostfix(doc) { + writePostfix(doc: Document): any { // empty } /** * Creates the page selector table. */ - // createPageSelector(vpages: number, hpages: number): HTMLTableElement; - createPageSelector(vpages, hpages) { + createPageSelector(vpages: number, hpages: number): HTMLTableElement { const doc = this.wnd.document; const table = doc.createElement('table'); table.className = 'mxPageSelector'; diff --git a/packages/core/src/view/selection/RubberBand.ts b/packages/core/src/view/selection/RubberBand.ts index 3c499ef26..8f0b78095 100644 --- a/packages/core/src/view/selection/RubberBand.ts +++ b/packages/core/src/view/selection/RubberBand.ts @@ -3,7 +3,7 @@ * Copyright (c) 2006-2016, Gaudenz Alder */ -import utils, { getOffset, getScrollOrigin } from '../../util/Utils'; +import utils, { getOffset, getScrollOrigin, setOpacity } from '../../util/Utils'; import InternalEvent from '../event/InternalEvent'; import Point from '../geometry/Point'; import InternalMouseEvent from '../event/InternalMouseEvent'; @@ -243,11 +243,11 @@ class RubberBand { /** * Creates the rubberband selection shape. */ - createShape(): HTMLElement { + createShape(): HTMLElement | null { if (this.sharedDiv == null) { this.sharedDiv = document.createElement('div'); this.sharedDiv.className = 'mxRubberband'; - utils.setOpacity(this.sharedDiv, this.defaultOpacity); + setOpacity(this.sharedDiv, this.defaultOpacity); } this.graph.container.appendChild(this.sharedDiv); diff --git a/packages/core/src/view/split/GraphSplit.ts b/packages/core/src/view/split/GraphSplit.ts deleted file mode 100644 index 4e4f5b5b4..000000000 --- a/packages/core/src/view/split/GraphSplit.ts +++ /dev/null @@ -1,36 +0,0 @@ -import Cell from "../cell/datatypes/Cell"; -import CellArray from "../cell/datatypes/CellArray"; -import InternalMouseEvent from "../event/InternalMouseEvent"; - -class GraphSplit { - /** - * Returns true if the given edge may be splitted into two edges with the - * given cell as a new terminal between the two. - * - * @param target {@link mxCell} that represents the edge to be splitted. - * @param cells {@link mxCell} that should split the edge. - * @param evt Mouseevent that triggered the invocation. - */ - // isSplitTarget(target: mxCell, cells: mxCellArray, evt: Event): boolean; - isSplitTarget(target: Cell, cells: CellArray, evt: InternalMouseEvent): boolean { - if ( - target.isEdge() && - cells != null && - cells.length == 1 && - cells[0].isConnectable() && - this.getEdgeValidationError(target, target.getTerminal(true), cells[0]) == - null - ) { - const src = target.getTerminal(true); - const trg = target.getTerminal(false); - - return ( - !cells[0].isAncestor(src) && - !cells[0].isAncestor(trg) - ); - } - return false; - } -} - -export default GraphSplit;