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

Trying to run HelloWorld...

development
Junsik Shim 2021-09-07 21:21:22 +09:00
parent bdc50a9f48
commit 2482ec10e9
47 changed files with 145 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -72,7 +72,7 @@ export { default as CircleLayout } from './view/layout/layout/CircleLayout';
export { default as CompactTreeLayout } from './view/layout/layout/CompactTreeLayout';
export { default as CompositeLayout } from './view/layout/layout/CompositeLayout';
export { default as EdgeLabelLayout } from './view/layout/layout/EdgeLabelLayout';
export { default as MxFastOrganicLayout } from './view/layout/layout/FastOrganicLayout';
export { default as FastOrganicLayout } from './view/layout/layout/FastOrganicLayout';
export { default as GraphLayout } from './view/layout/layout/GraphLayout';
export { default as ParallelEdgeLayout } from './view/layout/layout/ParallelEdgeLayout';
export { default as PartitionLayout } from './view/layout/layout/PartitionLayout';
@ -113,7 +113,7 @@ export { default as mxStylesheetCodec } from './util/serialization/mxStylesheetC
export { default as mxTerminalChangeCodec } from './util/serialization/mxTerminalChangeCodec';
export { default as Actor } from './view/geometry/shape/Actor';
export { default as Label } from './view/geometry/shape/node/LabelShape';
export { default as LabelShape } from './view/geometry/shape/node/LabelShape';
export { default as Shape } from './view/geometry/shape/Shape';
export { default as SwimlaneShape } from './view/geometry/shape/node/SwimlaneShape';
export { default as TextShape } from './view/geometry/shape/node/TextShape';

4
packages/core/src/util/serialization/mxGraphCodec.js
View File

@ -5,7 +5,7 @@
* Type definitions from the typed-mxgraph project
*/
import graph from '../../view/Graph';
import { Graph } from '../../view/Graph';
import mxCodecRegistry from './mxCodecRegistry';
import mxObjectCodec from './mxObjectCodec';
@ -28,7 +28,7 @@ import mxObjectCodec from './mxObjectCodec';
*/
class mxGraphCodec extends mxObjectCodec {
constructor() {
super(new graph(), [
super(new Graph(), [
'graphListeners',
'eventListeners',
'view',

4
packages/core/src/view/geometry/shape/Shape.ts
View File

@ -1205,7 +1205,7 @@ class Shape {
* Returns the rotation from the style.
*/
getRotation() {
return this.rotation;
return this.rotation ?? 0;
}
/**
@ -1230,7 +1230,7 @@ class Shape {
*/
getShapeRotation() {
let rot = this.getRotation();
console.log('rot', rot, this, this.rotation);
if (this.direction === DIRECTION_NORTH) {
rot += 270;
} else if (this.direction === DIRECTION_WEST) {

4
packages/html/stories/Anchors.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
ConnectionHandler,
ConnectionConstraint,
Geometry,
@ -91,7 +91,7 @@ const Template = ({ label, ...args }) => {
graph.getStylesheet().getDefaultEdgeStyle().edgeStyle = 'orthogonalEdgeStyle';
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/AutoLayout.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
InternalEvent,
CellRenderer,
EdgeHandler,
@ -88,7 +88,7 @@ const Template = ({ label, ...args }) => {
graph.view.setTranslate(20, 20);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Boundary.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
Point,
GraphHandler,
utils,
@ -172,7 +172,7 @@ const Template = ({ label, ...args }) => {
};
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

14
packages/html/stories/Clipboard.stories.js
View File

@ -1,14 +1,14 @@
import {
Graph,
InternalEvent,
Rubberband,
mxClipboard,
RubberBand,
Clipboard,
utils,
EventUtils,
mxClient,
mxCodec,
Model,
mxStringUtils,
StringUtils,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -44,7 +44,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Public helper method for shared clipboard.
mxClipboard.cellsToString = function (cells) {
Clipboard.cellsToString = function (cells) {
const codec = new mxCodec();
const model = new Model();
const parent = model.getRoot().getChildAt(0);
@ -142,7 +142,7 @@ const Template = ({ label, ...args }) => {
}
}
textInput.value = mxClipboard.cellsToString(clones);
textInput.value = Clipboard.cellsToString(clones);
}
textInput.select();
@ -228,7 +228,7 @@ const Template = ({ label, ...args }) => {
// Parses and inserts XML into graph
const pasteText = function (text) {
const xml = mxStringUtils.trim(text);
const xml = StringUtils.trim(text);
const x = graph.container.scrollLeft / graph.view.scale - graph.view.translate.x;
const y = graph.container.scrollTop / graph.view.scale - graph.view.translate.y;
@ -294,7 +294,7 @@ const Template = ({ label, ...args }) => {
});
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Constituent.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, InternalEvent, GraphHandler, Rubberband } from '@maxgraph/core';
import { Graph, InternalEvent, GraphHandler, RubberBand } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -69,7 +69,7 @@ const Template = ({ label, ...args }) => {
const graph = new MyCustomGraph(container);
// Enables rubberband selection
new Rubberband(graph);
new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/ContextIcons.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
EventUtils,
utils,
VertexHandler,
@ -168,7 +168,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Control.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
mxDomHelpers,
ImageShape,
Rectangle,
@ -128,7 +128,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

8
packages/html/stories/DragSource.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
mxDomUtils,
Rubberband,
DomUtils,
RubberBand,
DragSource,
utils,
GestureUtils,
@ -87,7 +87,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).
@ -124,7 +124,7 @@ const Template = ({ label, ...args }) => {
const elt = document.elementFromPoint(x, y);
for (const graph of graphs) {
if (mxDomUtils.isAncestorNode(graph.container, elt)) {
if (DomUtils.isAncestorNode(graph.container, elt)) {
return graph;
}
}

4
packages/html/stories/Drop.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
utils,
EventUtils,
InternalEvent,
@ -53,7 +53,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
InternalEvent.addListener(container, 'dragover', function (evt) {
if (graph.isEnabled()) {

8
packages/html/stories/DynamicLoading.stories.js
View File

@ -1,13 +1,13 @@
import {
Graph,
Text,
TextShape,
mxEffects,
InternalEvent,
Constants,
Perimeter,
mxCodec,
utils,
mxXmlUtils,
XmlUtils,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -31,7 +31,7 @@ const Template = ({ label, ...args }) => {
let requestId = 0;
// Speedup the animation
Text.prototype.enableBoundingBox = false;
TextShape.prototype.enableBoundingBox = false;
// Creates the graph inside the given container
const graph = new Graph(container);
@ -85,7 +85,7 @@ const Template = ({ label, ...args }) => {
graph.getModel().beginUpdate();
try {
const xml = server(cell.id);
const doc = mxXmlUtils.parseXml(xml);
const doc = XmlUtils.parseXml(xml);
const dec = new mxCodec(doc);
const model = dec.decode(doc.documentElement);

4
packages/html/stories/DynamicStyle.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, utils, Constants, Rubberband } from '@maxgraph/core';
import { Graph, utils, Constants, RubberBand } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -29,7 +29,7 @@ const Template = ({ label, ...args }) => {
graph.edgeLabelsMovable = false;
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Needs to set a flag to check for dynamic style changes,
// that is, changes to styles on cells where the style was

4
packages/html/stories/DynamicToolbar.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
ConnectionHandler,
ImageBox,
mxToolbar,
@ -74,7 +74,7 @@ const Template = ({ label, ...args }) => {
// Stops editing on enter or escape keypress
const keyHandler = new mxKeyHandler(graph);
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
addVertex('/images/rectangle.gif', 100, 40, '');
addVertex('/images/rounded.gif', 100, 40, 'shape=rounded');

6
packages/html/stories/Editing.stories.js
View File

@ -2,7 +2,7 @@ import {
Graph,
mxKeyHandler,
utils,
mxDomUtils,
DomUtils,
CloneUtils,
EventUtils,
} from '@maxgraph/core';
@ -48,14 +48,14 @@ const Template = ({ label, ...args }) => {
td1.style.textAlign = 'center';
td1.style.fontSize = '12px';
td1.style.color = '#774400';
mxDomUtils.write(td1, cell.value.first);
DomUtils.write(td1, cell.value.first);
const tr2 = document.createElement('tr');
const td2 = document.createElement('td');
td2.style.textAlign = 'center';
td2.style.fontSize = '12px';
td2.style.color = '#774400';
mxDomUtils.write(td2, cell.value.second);
DomUtils.write(td2, cell.value.second);
tr1.appendChild(td1);
tr2.appendChild(td2);

10
packages/html/stories/Events.stories.js
View File

@ -1,10 +1,10 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
ConnectionHandler,
LayoutManager,
mxParallelEdgeLayout,
ParallelEdgeLayout,
ImageBox,
mxKeyHandler,
Constants,
@ -62,7 +62,7 @@ const Template = ({ label, ...args }) => {
// Optionally you can enable panning, tooltips and connections
// using graph.setPanning(), setTooltips() & setConnectable().
// To enable rubberband selection and basic keyboard events,
// use new Rubberband(graph) and new mxKeyHandler(graph).
// use new RubberBand(graph) and new mxKeyHandler(graph).
const graph = new MyCustomGraph(container);
// Enables tooltips, new connections and panning
@ -71,7 +71,7 @@ const Template = ({ label, ...args }) => {
graph.setConnectable(true);
// Automatically handle parallel edges
const layout = new mxParallelEdgeLayout(graph);
const layout = new ParallelEdgeLayout(graph);
const layoutMgr = new LayoutManager(graph);
layoutMgr.getLayout = function (cell) {
@ -82,7 +82,7 @@ const Template = ({ label, ...args }) => {
// Enables rubberband (marquee) selection and a handler
// for basic keystrokes (eg. return, escape during editing).
const rubberband = new Rubberband(graph);
const rubberband = new RubberBand(graph);
const keyHandler = new mxKeyHandler(graph);
// Changes the default style for edges "in-place" and assigns

4
packages/html/stories/ExtendCanvas.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
Rectangle,
Point,
utils,
@ -195,7 +195,7 @@ const Template = ({ label, ...args }) => {
};
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

13
packages/html/stories/FixedIcons.stories.js
View File

@ -1,4 +1,11 @@
import { Graph, Rubberband, Rectangle, Constants, utils, mxLabel } from '@maxgraph/core';
import {
Graph,
RubberBand,
Rectangle,
Constants,
utils,
LabelShape,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -23,7 +30,7 @@ const Template = ({ label, ...args }) => {
container.style.cursor = 'default';
// Overrides the image bounds code to change the position
mxLabel.prototype.getImageBounds = function (x, y, w, h) {
LabelShape.prototype.getImageBounds = function (x, y, w, h) {
const iw = utils.getValue(this.style, 'imageWidth', Constants.DEFAULT_IMAGESIZE);
const ih = utils.getValue(this.style, 'imageHeight', Constants.DEFAULT_IMAGESIZE);
@ -45,7 +52,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/FixedPoints.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
ConnectionHandler,
ConnectionConstraint,
ConstraintHandler,
@ -142,7 +142,7 @@ const Template = ({ label, ...args }) => {
graph.setConnectable(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Grid.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
mxLog,
GraphView,
Point,
@ -45,7 +45,7 @@ const Template = ({ label, ...args }) => {
graph.setPanning(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
let repaintGrid;

6
packages/html/stories/Groups.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Rubberband, GraphHandler, mxPopupMenuHandler } from '@maxgraph/core';
import { Graph, RubberBand, GraphHandler, PopupMenuHandler } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -106,7 +106,7 @@ const Template = ({ label, ...args }) => {
};
// Returns last selected ancestor
mxPopupMenuHandler.prototype.getCellForPopupEvent = function (me) {
PopupMenuHandler.prototype.getCellForPopupEvent = function (me) {
let cell = me.getCell();
const model = this.graph.getModel();
let parent = cell.getParent();
@ -133,7 +133,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Guides.stories.js
View File

@ -5,7 +5,7 @@ import {
Constants,
EdgeHandler,
EdgeStyle,
Rubberband,
RubberBand,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -63,7 +63,7 @@ const Template = ({ label, ...args }) => {
graph.alternateEdgeStyle = 'elbow=vertical';
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Handles.stories.js
View File

@ -7,7 +7,7 @@ import {
Rectangle,
VertexHandler,
InternalEvent,
Rubberband,
RubberBand,
utils,
VertexHandle,
} from '@maxgraph/core';
@ -205,7 +205,7 @@ const Template = ({ label, ...args }) => {
graph.centerZoom = false;
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/HelloPort.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
EdgeStyle,
Point,
Constants,
@ -72,7 +72,7 @@ const Template = ({ label, ...args }) => {
};
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/HelloWorld.stories.js
View File

@ -25,11 +25,11 @@ const Template = ({ label, ...args }) => {
container.style.background = 'url(/images/grid.gif)';
container.style.cursor = 'default';
if (!args.contextMenu) InternalEvent.disableContextMenu(container);
// if (!args.contextMenu) InternalEvent.disableContextMenu(container);
const graph = new Graph(container);
// if (args.rubberBand) new Rubberband(graph);
// if (args.rubberBand) new RubberBand(graph);
const parent = graph.getDefaultParent();

14
packages/html/stories/HierarchicalLayout.stories.js
View File

@ -1,11 +1,11 @@
import {
Graph,
mxDomUtils,
mxFastOrganicLayout,
DomUtils,
FastOrganicLayout,
mxHierarchicalLayout,
Perimeter,
InternalEvent,
Rubberband,
RubberBand,
Constants,
} from '@maxgraph/core';
@ -42,7 +42,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Adds rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Changes the default vertex style in-place
let style = graph.getStylesheet().getDefaultVertexStyle();
@ -58,7 +58,7 @@ const Template = ({ label, ...args }) => {
// Creates a layout algorithm to be used
// with the graph
const layout = new mxHierarchicalLayout(graph);
const organic = new mxFastOrganicLayout(graph);
const organic = new FastOrganicLayout(graph);
organic.forceConstant = 120;
const parent = graph.getDefaultParent();
@ -68,7 +68,7 @@ const Template = ({ label, ...args }) => {
// Adds a button to execute the layout
let button = document.createElement('button');
mxDomUtils.write(button, 'Hierarchical');
DomUtils.write(button, 'Hierarchical');
InternalEvent.addListener(button, 'click', function (evt) {
layout.execute(parent);
});
@ -76,7 +76,7 @@ const Template = ({ label, ...args }) => {
// Adds a button to execute the layout
button = document.createElement('button');
mxDomUtils.write(button, 'Organic');
DomUtils.write(button, 'Organic');
InternalEvent.addListener(button, 'click', function (evt) {
organic.execute(parent);

4
packages/html/stories/HoverIcons.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
InternalEvent,
Rubberband,
RubberBand,
ImageBox,
Rectangle,
utils,
@ -104,7 +104,7 @@ const Template = ({ label, ...args }) => {
graph.setConnectable(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Defines the tolerance before removing the icons
const ICON_TOLERANCE = 20;

4
packages/html/stories/HoverStyle.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Constants, Rubberband, CloneUtils } from '@maxgraph/core';
import { Graph, Constants, RubberBand, CloneUtils } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -103,7 +103,7 @@ const Template = ({ label, ...args }) => {
});
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

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

@ -6,9 +6,9 @@ import {
InternalEvent,
mxClient,
mxCodec,
mxDomUtils,
DomUtils,
utils,
popup,
mxWindow,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -41,11 +41,11 @@ const Template = ({ label, ...args }) => {
const codec = new mxObjectCodec(new CustomData());
codec.encode = function (enc, obj) {
const node = enc.document.createElement('CustomData');
mxDomUtils.setTextContent(node, JSON.stringify(obj));
DomUtils.setTextContent(node, JSON.stringify(obj));
return node;
};
codec.decode = function (dec, node, into) {
const obj = JSON.parse(mxDomUtils.getTextContent(node));
const obj = JSON.parse(DomUtils.getTextContent(node));
obj.constructor = CustomData;
return obj;
@ -85,7 +85,7 @@ const Template = ({ label, ...args }) => {
mxDomHelpers.button('Show JSON', function () {
const encoder = new mxCodec();
const node = encoder.encode(graph.getModel());
popup(utils.getXml(node), true);
mxWindow.popup(utils.getXml(node), true);
})
);

4
packages/html/stories/Labels.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Rubberband, mxKeyHandler, Constants, Rectangle } from '@maxgraph/core';
import { Graph, RubberBand, mxKeyHandler, Constants, Rectangle } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -28,7 +28,7 @@ const Template = ({ label, ...args }) => {
graph.htmlLabels = true;
graph.vertexLabelsMovable = true;
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
new mxKeyHandler(graph);

4
packages/html/stories/Merge.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Perimeter, Constants, Rubberband } from '@maxgraph/core';
import { Graph, Perimeter, Constants, RubberBand } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -48,7 +48,7 @@ const Template = ({ label, ...args }) => {
style.strokeWidth = 2;
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

6
packages/html/stories/Monitor.stories.js
View File

@ -2,7 +2,7 @@ import {
Graph,
EdgeStyle,
mxDomHelpers,
mxXmlUtils,
XmlUtils,
Perimeter,
utils,
Constants,
@ -76,7 +76,7 @@ const Template = ({ label, ...args }) => {
'<Cell id="30" value="" edge="1" parent="2" source="27" target="EnterAccountingData"><Geometry relative="1" as="geometry"><Array as="points"><Point x="469" y="40"/></Array></Geometry></Cell>' +
'<Cell id="33" value="" edge="1" parent="2" source="6" target="EnterAccountingData"><Geometry relative="1" as="geometry"><Array as="points"><Point x="255" y="200"/></Array></Geometry></Cell>' +
'</root></Transactions>';
const doc = mxXmlUtils.parseXml(xml);
const doc = XmlUtils.parseXml(xml);
const codec = new mxCodec(doc);
codec.decode(doc.documentElement, graph.getModel());
@ -101,7 +101,7 @@ const Template = ({ label, ...args }) => {
*/
function update(graph, xml) {
if (xml != null && xml.length > 0) {
const doc = mxXmlUtils.parseXml(xml);
const doc = XmlUtils.parseXml(xml);
if (doc != null && doc.documentElement != null) {
const model = graph.getModel();

4
packages/html/stories/Morph.stories.js
View File

@ -3,7 +3,7 @@ import {
mxDomHelpers,
mxMorphing,
InternalEvent,
Rubberband,
RubberBand,
} from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -42,7 +42,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Orthogonal.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
ConnectionHandler,
GraphHandler,
Guide,
@ -82,7 +82,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/PageBreaks.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
Rectangle,
Rubberband,
RubberBand,
mxDomHelpers,
InternalEvent,
} from '@maxgraph/core';
@ -57,7 +57,7 @@ const Template = ({ label, ...args }) => {
graph.graphHandler.scaleGrid = true;
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Perimeter.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Rubberband, GraphView, utils } from '@maxgraph/core';
import { Graph, RubberBand, GraphView, utils } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -55,7 +55,7 @@ const Template = ({ label, ...args }) => {
// graph.setResizeContainer(true);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Permissions.stories.js
View File

@ -2,7 +2,7 @@ import {
Graph,
ConnectionHandler,
ImageBox,
Rubberband,
RubberBand,
mxKeyHandler,
mxDomHelpers,
} from '@maxgraph/core';
@ -44,7 +44,7 @@ const Template = ({ label, ...args }) => {
graph.setAllowLoops(true);
// Enables rubberband selection and key handling
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
const keyHandler = new mxKeyHandler(graph);

4
packages/html/stories/PortRefs.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
Point,
EdgeHandler,
ConstraintHandler,
@ -44,7 +44,7 @@ const Template = ({ label, ...args }) => {
graph.setPortsEnabled(false);
// Enables rubberband selection
new Rubberband(graph);
new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

8
packages/html/stories/RadialTreeLayout.stories.js
View File

@ -1,8 +1,8 @@
import {
Graph,
Rubberband,
RubberBand,
Constants,
mxRadialTreeLayout,
RadialTreeLayout,
Perimeter,
} from '@maxgraph/core';
@ -32,7 +32,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Adds rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Changes the default vertex style in-place
let style = graph.getStylesheet().getDefaultVertexStyle();
@ -47,7 +47,7 @@ const Template = ({ label, ...args }) => {
// Creates a layout algorithm to be used
// with the graph
const layout = new mxRadialTreeLayout(graph);
const layout = new RadialTreeLayout(graph);
const parent = graph.getDefaultParent();

4
packages/html/stories/SecondLabel.stories.js
View File

@ -2,7 +2,7 @@ import {
Graph,
RectangleShape,
mxDomHelpers,
Text,
TextShape,
Point,
Rectangle,
Constants,
@ -98,7 +98,7 @@ const Template = ({ label, ...args }) => {
const secondLabel = graph.getSecondLabel(state.cell);
if (secondLabel != null && state.shape != null && state.secondLabel == null) {
state.secondLabel = new Text(
state.secondLabel = new TextShape(
secondLabel,
new Rectangle(),
Constants.ALIGN_LEFT,

13
packages/html/stories/Stencils.stories.js
View File

@ -8,10 +8,10 @@ import {
CellHighlight,
Constants,
VertexHandler,
Rubberband,
RubberBand,
Shape,
StencilShape,
StencilRegistry,
StencilShapeRegistry,
CellRenderer,
utils,
} from '@maxgraph/core';
@ -66,7 +66,7 @@ const Template = ({ label, ...args }) => {
// Uses the shape for resize previews
VertexHandler.prototype.createSelectionShape = function (bounds) {
const key = this.state.style.shape;
const stencil = StencilRegistry.getStencil(key);
const stencil = StencilShapeRegistry.getStencil(key);
let shape = null;
if (stencil != null) {
@ -128,7 +128,10 @@ const Template = ({ label, ...args }) => {
while (shape != null) {
if (shape.nodeType === Constants.NODETYPE_ELEMENT) {
StencilRegistry.addStencil(shape.getAttribute('name'), new StencilShape(shape));
StencilShapeRegistry.addStencil(
shape.getAttribute('name'),
new StencilShape(shape)
);
}
shape = shape.nextSibling;
@ -159,7 +162,7 @@ const Template = ({ label, ...args }) => {
style.shadow = '1';
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

4
packages/html/stories/Toolbar.stories.js
View File

@ -1,6 +1,6 @@
import {
Graph,
Rubberband,
RubberBand,
ConnectionHandler,
ImageBox,
mxToolbar,
@ -84,7 +84,7 @@ const Template = ({ label, ...args }) => {
// Stops editing on enter or escape keypress
const keyHandler = new mxKeyHandler(graph);
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
const addVertex = (icon, w, h, style) => {
const vertex = new Cell(null, new Geometry(0, 0, w, h), style);

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

@ -4,12 +4,12 @@ import {
mxDomHelpers,
mxKeyHandler,
InternalEvent,
mxXmlUtils,
XmlUtils,
mxCodec,
Constants,
utils,
EdgeStyle,
mxDomUtils,
DomUtils,
mxForm,
CellAttributeChange,
} from '@maxgraph/core';
@ -37,7 +37,7 @@ const Template = ({ label, ...args }) => {
// Note that these XML nodes will be enclosing the
// Cell nodes for the model cells in the output
const doc = mxXmlUtils.createXmlDocument();
const doc = XmlUtils.createXmlDocument();
const person1 = doc.createElement('Person');
person1.setAttribute('firstName', 'Daffy');
@ -72,7 +72,7 @@ const Template = ({ label, ...args }) => {
// Overrides method to provide a cell label in the display
graph.convertValueToString = function (cell) {
if (mxDomUtils.isNode(cell.value)) {
if (DomUtils.isNode(cell.value)) {
if (cell.value.nodeName.toLowerCase() == 'person') {
const firstName = cell.getAttribute('firstName', '');
const lastName = cell.getAttribute('lastName', '');
@ -94,7 +94,7 @@ const Template = ({ label, ...args }) => {
// Overrides method to store a cell label in the model
const { cellLabelChanged } = graph;
graph.cellLabelChanged = function (cell, newValue, autoSize) {
if (mxDomUtils.isNode(cell.value) && cell.value.nodeName.toLowerCase() == 'person') {
if (DomUtils.isNode(cell.value) && cell.value.nodeName.toLowerCase() == 'person') {
const pos = newValue.indexOf(' ');
const firstName = pos > 0 ? newValue.substring(0, pos) : newValue;
@ -116,7 +116,7 @@ const Template = ({ label, ...args }) => {
// Overrides method to create the editing value
const { getEditingValue } = graph;
graph.getEditingValue = function (cell) {
if (mxDomUtils.isNode(cell.value) && cell.value.nodeName.toLowerCase() == 'person') {
if (DomUtils.isNode(cell.value) && cell.value.nodeName.toLowerCase() == 'person') {
const firstName = cell.getAttribute('firstName', '');
const lastName = cell.getAttribute('lastName', '');
@ -218,13 +218,13 @@ const Template = ({ label, ...args }) => {
const cell = graph.getSelectionCell();
if (cell == null) {
mxDomUtils.writeln(div, 'Nothing selected.');
DomUtils.writeln(div, 'Nothing selected.');
} else {
// Writes the title
const center = document.createElement('center');
mxDomUtils.writeln(center, `${cell.value.nodeName} (${cell.id})`);
DomUtils.writeln(center, `${cell.value.nodeName} (${cell.id})`);
div.appendChild(center);
mxDomUtils.br(div);
DomUtils.br(div);
// Creates the form from the attributes of the user object
const form = new mxForm();
@ -236,7 +236,7 @@ const Template = ({ label, ...args }) => {
}
div.appendChild(form.getTable());
mxDomUtils.br(div);
DomUtils.br(div);
}
}

8
packages/html/stories/Validation.stories.js
View File

@ -1,7 +1,7 @@
import {
Graph,
Rubberband,
mxXmlUtils,
RubberBand,
XmlUtils,
Multiplicity,
mxKeyHandler,
InternalEvent,
@ -29,7 +29,7 @@ const Template = ({ label, ...args }) => {
container.style.background = 'url(/images/grid.gif)';
container.style.cursor = 'default';
const xmlDocument = mxXmlUtils.createXmlDocument();
const xmlDocument = XmlUtils.createXmlDocument();
const sourceNode = xmlDocument.createElement('Source');
const targetNode = xmlDocument.createElement('Target');
const subtargetNode = xmlDocument.createElement('Subtarget');
@ -87,7 +87,7 @@ const Template = ({ label, ...args }) => {
);
// Enables rubberband selection
new Rubberband(graph);
new RubberBand(graph);
// Removes cells when [DELETE] is pressed
const keyHandler = new mxKeyHandler(graph);

4
packages/html/stories/Visibility.stories.js
View File

@ -1,4 +1,4 @@
import { Graph, Rubberband, mxDomHelpers } from '@maxgraph/core';
import { Graph, RubberBand, mxDomHelpers } from '@maxgraph/core';
import { globalTypes } from '../.storybook/preview';
@ -29,7 +29,7 @@ const Template = ({ label, ...args }) => {
const graph = new Graph(container);
// Enables rubberband selection
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
// Gets the default parent for inserting new cells. This
// is normally the first child of the root (ie. layer 0).

8
packages/html/stories/Window.stories.js
View File

@ -2,10 +2,10 @@ import {
Graph,
mxWindow,
mxKeyHandler,
Rubberband,
RubberBand,
InternalEvent,
mxLog,
mxDomUtils,
DomUtils,
mxClient,
} from '@maxgraph/core';
@ -57,7 +57,7 @@ const Template = ({ label, ...args }) => {
graph.setTooltips(true);
graph.setPanning(true);
if (args.rubberBand) new Rubberband(graph);
if (args.rubberBand) new RubberBand(graph);
new mxKeyHandler(graph);
@ -85,7 +85,7 @@ const Template = ({ label, ...args }) => {
const lorem =
'Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. ';
let content = document.createElement('div');
mxDomUtils.write(content, lorem + lorem + lorem);
DomUtils.write(content, lorem + lorem + lorem);
wnd = new mxWindow(
'Scrollable, resizable, auto height',