development
mcyph 2021-05-02 23:59:43 +10:00
parent fe7ac7e84d
commit 7cac8a2a86
14 changed files with 137 additions and 137 deletions

View File

@ -655,9 +655,9 @@ graph.getPreferredSizeForCell = function(cell)
let result = graphGetPreferredSizeForCell.apply(this, arguments);
let style = this.getCellStyle(cell);
if (style['minWidth'] > 0)
if (style.minWidth > 0)
{
result.width = Math.max(style['minWidth'], result.width);
result.width = Math.max(style.minWidth, result.width);
}
return result;
@ -1032,7 +1032,7 @@ graph.isWrapping = function(state)
{
let style = this.getCurrentCellStyle(cell);
return this.isCellsSelectable() && !this.isCellLocked(cell) && style['selectable'] != 0;
return this.isCellsSelectable() && !this.isCellLocked(cell) && style.selectable != 0;
};</pre></blockquote><p>You can then use the new style as shown in this example.</p><blockquote><pre class="prettyprint">graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30, 'selectable=0');</pre></blockquote><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>cell</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link1306 onMouseOver="ShowTip(event, 'tt246', 'link1306')" onMouseOut="HideTip('tt246')">mxCell</a> whose selectable state should be returned.</td></tr></table></div></div></div>
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxGraph.isCellsSelectable"></a>isCellsSelectable</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td class="prettyprint">mxGraph.prototype.isCellsSelectable = function()</td></tr></table></blockquote><p>Returns <a href="#mxGraph.cellsSelectable" class=LVariable id=link1307 onMouseOver="ShowTip(event, 'tt120', 'link1307')" onMouseOut="HideTip('tt120')">cellsSelectable</a>.</p></div></div></div>

View File

@ -667,7 +667,7 @@ export default MYNAMEHERE;
style.verticalAlign = mxConstants.ALIGN_TOP;
style.gradientColor = '#41B9F5';
style.fillColor = '#8CCDF5';
style['swimlaneFillColor'] = '#ffffff';
style.swimlaneFillColor = '#ffffff';
style.strokeColor = '#1B78C8';
style.fontColor = '#000000';
style.strokeWidth = '2';

View File

@ -228,32 +228,32 @@ export default MYNAMEHERE;
let fillColor = (invert) ? 'none' : '#FFFFFF';
let style = graph.getStylesheet().getDefaultEdgeStyle();
delete style['endArrow'];
style['strokeColor'] = strokeColor;
style['labelBackgroundColor'] = labelBackground;
style['edgeStyle'] = 'wireEdgeStyle';
style['fontColor'] = fontColor;
style['fontSize'] = '9';
style['movable'] = '0';
style['strokeWidth'] = strokeWidth;
//style['rounded'] = '1';
delete style.endArrow;
style.strokeColor = strokeColor;
style.labelBackgroundColor = labelBackground;
style.edgeStyle = 'wireEdgeStyle';
style.fontColor = fontColor;
style.fontSize = '9';
style.movable = '0';
style.strokeWidth = strokeWidth;
//style.rounded = '1';
// Sets join node size
style['startSize'] = joinNodeSize;
style['endSize'] = joinNodeSize;
style.startSize = joinNodeSize;
style.endSize = joinNodeSize;
style = graph.getStylesheet().getDefaultVertexStyle();
style['gradientDirection'] = 'south';
//style['gradientColor'] = '#909090';
style['strokeColor'] = strokeColor;
//style['fillColor'] = '#e0e0e0';
style['fillColor'] = 'none';
style['fontColor'] = fontColor;
style['fontStyle'] = '1';
style['fontSize'] = '12';
style['resizable'] = '0';
style['rounded'] = '1';
style['strokeWidth'] = strokeWidth;
style.gradientDirection = 'south';
//style.gradientColor = '#909090';
style.strokeColor = strokeColor;
//style.fillColor = '#e0e0e0';
style.fillColor = 'none';
style.fontColor = fontColor;
style.fontStyle = '1';
style.fontSize = '12';
style.resizable = '0';
style.rounded = '1';
style.strokeWidth = strokeWidth;
let parent = graph.getDefaultParent();
@ -724,8 +724,8 @@ export default MYNAMEHERE;
this.state.style = this.lastStyle;
// Workaround for shape using current stroke width if no strokewidth defined
this.state.style['strokeWidth'] = this.state.style['strokeWidth'] || '1';
this.state.style['strokeColor'] = this.state.style['strokeColor'] || 'none';
this.state.style.strokeWidth = this.state.style.strokeWidth || '1';
this.state.style.strokeColor = this.state.style.strokeColor || 'none';
if (this.state.shape != null)
{
@ -738,8 +738,8 @@ export default MYNAMEHERE;
{
this.lastStyle = state.style;
state.style = mxUtils.clone(state.style);
state.style['strokeColor'] = '#00ff00';
state.style['strokeWidth'] = '3';
state.style.strokeColor = '#00ff00';
state.style.strokeWidth = '3';
if (state.shape != null)
{
@ -781,12 +781,12 @@ export default MYNAMEHERE;
if (this.model.isEdge(this.model.getTerminal(cell, true)))
{
style['startArrow'] = 'oval';
style.startArrow = 'oval';
}
if (this.model.isEdge(this.model.getTerminal(cell, false)))
{
style['endArrow'] = 'oval';
style.endArrow = 'oval';
}
}
@ -838,11 +838,11 @@ export default MYNAMEHERE;
// Gets the initial connection from the source terminal or edge
if (source != null && state.view.graph.model.isEdge(source.cell))
{
horizontal = state.style['sourceConstraint'] == 'horizontal';
horizontal = state.style.sourceConstraint == 'horizontal';
}
else if (source != null)
{
horizontal = source.style['portConstraint'] != 'vertical';
horizontal = source.style.portConstraint != 'vertical';
// Checks the direction of the shape and rotates
let direction = source.style.direction;

View File

@ -628,7 +628,7 @@ Actions.prototype.init = function()
if (refState != null)
{
graph.stopEditing();
let value = (refState.style['html'] == '1') ? null : '1';
let value = (refState.style.html == '1') ? null : '1';
graph.getModel().beginUpdate();
try

View File

@ -5608,7 +5608,7 @@ DiagramStylePanel.prototype.addView = function(div)
let style = graph.getCellStyle(cells[i]);
// Handles special label background color
if (style['labelBackgroundColor'] != null)
if (style.labelBackgroundColor != null)
{
graph.updateCellStyles('labelBackgroundColor', (graphStyle != null) ?
graphStyle.background : null, [cells[i]]);

View File

@ -204,7 +204,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
{
let style = this.getCurrentCellStyle(cell);
return (style != null) ? (style['html'] == '1' || style.whiteSpace == 'wrap') : false;
return (style != null) ? (style.html == '1' || style.whiteSpace == 'wrap') : false;
};
// Implements a listener for hover and click handling on edges
@ -625,7 +625,7 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
if (state.view.graph.isHtmlLabel(state.cell))
{
if (state.style['html'] != 1)
if (state.style.html != 1)
{
result = mxUtils.htmlEntities(result, false);
}
@ -2358,20 +2358,20 @@ Graph.prototype.initLayoutManager = function()
{
let style = this.graph.getCellStyle(cell);
if (style['childLayout'] == 'stackLayout')
if (style.childLayout == 'stackLayout')
{
let stackLayout = new mxStackLayout(this.graph, true);
stackLayout.resizeParentMax = mxUtils.getValue(style, 'resizeParentMax', '1') == '1';
stackLayout.horizontal = mxUtils.getValue(style, 'horizontalStack', '1') == '1';
stackLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
stackLayout.resizeLast = mxUtils.getValue(style, 'resizeLast', '0') == '1';
stackLayout.spacing = style['stackSpacing'] || stackLayout.spacing;
stackLayout.border = style['stackBorder'] || stackLayout.border;
stackLayout.marginLeft = style['marginLeft'] || 0;
stackLayout.marginRight = style['marginRight'] || 0;
stackLayout.marginTop = style['marginTop'] || 0;
stackLayout.marginBottom = style['marginBottom'] || 0;
stackLayout.allowGaps = style['allowGaps'] || 0;
stackLayout.spacing = style.stackSpacing || stackLayout.spacing;
stackLayout.border = style.stackBorder || stackLayout.border;
stackLayout.marginLeft = style.marginLeft || 0;
stackLayout.marginRight = style.marginRight || 0;
stackLayout.marginTop = style.marginTop || 0;
stackLayout.marginBottom = style.marginBottom || 0;
stackLayout.allowGaps = style.allowGaps || 0;
stackLayout.fill = true;
if (stackLayout.allowGaps)
@ -2381,7 +2381,7 @@ Graph.prototype.initLayoutManager = function()
return stackLayout;
}
else if (style['childLayout'] == 'treeLayout')
else if (style.childLayout == 'treeLayout')
{
let treeLayout = new mxCompactTreeLayout(this.graph);
treeLayout.horizontal = mxUtils.getValue(style, 'horizontalTree', '1') == '1';
@ -2394,7 +2394,7 @@ Graph.prototype.initLayoutManager = function()
return treeLayout;
}
else if (style['childLayout'] == 'flowLayout')
else if (style.childLayout == 'flowLayout')
{
let flowLayout = new mxHierarchicalLayout(this.graph, mxUtils.getValue(style,
'flowOrientation', mxConstants.DIRECTION_EAST));
@ -2414,15 +2414,15 @@ Graph.prototype.initLayoutManager = function()
return flowLayout;
}
else if (style['childLayout'] == 'circleLayout')
else if (style.childLayout == 'circleLayout')
{
return new mxCircleLayout(this.graph);
}
else if (style['childLayout'] == 'organicLayout')
else if (style.childLayout == 'organicLayout')
{
return new mxFastOrganicLayout(this.graph);
}
else if (style['childLayout'] == 'tableLayout')
else if (style.childLayout == 'tableLayout')
{
return new TableLayout(this.graph);
}
@ -3602,11 +3602,11 @@ Graph.prototype.isContainer = function(cell)
if (this.isSwimlane(cell))
{
return style['container'] != '0';
return style.container != '0';
}
else
{
return style['container'] == '1';
return style.container == '1';
}
};
@ -3617,7 +3617,7 @@ Graph.prototype.isCellConnectable = function(cell)
{
let style = this.getCurrentCellStyle(cell);
return (style['connectable'] != null) ? style['connectable'] != '0' :
return (style.connectable != null) ? style.connectable != '0' :
mxGraph.prototype.isCellConnectable.apply(this, arguments);
};
@ -3628,7 +3628,7 @@ Graph.prototype.isLabelMovable = function(cell)
{
let style = this.getCurrentCellStyle(cell);
return (style['movableLabel'] != null) ? style['movableLabel'] != '0' :
return (style.movableLabel != null) ? style.movableLabel != '0' :
mxGraph.prototype.isLabelMovable.apply(this, arguments);
};
@ -3711,10 +3711,10 @@ Graph.prototype.isCellFoldable = function(cell)
{
let style = this.getCurrentCellStyle(cell);
return this.foldingEnabled && (style['treeFolding'] == '1' ||
return this.foldingEnabled && (style.treeFolding == '1' ||
(!this.isCellLocked(cell) &&
((this.isContainer(cell) && style['collapsible'] != '0') ||
(!this.isContainer(cell) && style['collapsible'] == '1'))));
((this.isContainer(cell) && style.collapsible != '0') ||
(!this.isContainer(cell) && style.collapsible == '1'))));
};
/**
@ -4396,7 +4396,7 @@ HoverIcons.prototype.drag = function(evt, x, y)
{
let direction = this.getDirection();
es.cell.style = mxUtils.setStyle(es.cell.style, 'sourcePortConstraint', direction);
es.style['sourcePortConstraint'] = direction;
es.style.sourcePortConstraint = direction;
}
}
};
@ -4809,7 +4809,7 @@ HoverIcons.prototype.update = function(state, x, y)
*/
HoverIcons.prototype.setCurrentState = function(state)
{
if (state.style['portConstraint'] != 'eastwest')
if (state.style.portConstraint != 'eastwest')
{
this.graph.container.appendChild(this.arrowUp);
this.graph.container.appendChild(this.arrowDown);
@ -4962,7 +4962,7 @@ Graph.prototype.isTable = function(cell)
{
let style = this.getCellStyle(cell);
return style != null && style['childLayout'] == 'tableLayout';
return style != null && style.childLayout == 'tableLayout';
};
/**
@ -5494,7 +5494,7 @@ TableLayout.prototype.execute = function(parent)
var state2 = this.validEdges[e];
var pts2 = state2.absolutePoints;
if (pts2 != null && mxUtils.intersects(state, state2) && state2.style['noJump'] != '1')
if (pts2 != null && mxUtils.intersects(state, state2) && state2.style.noJump != '1')
{
// Compares each segment of the edge with the current segment
for (let j = 0; j < pts2.length - 1; j++)
@ -5713,8 +5713,8 @@ TableLayout.prototype.execute = function(parent)
mxGraphView.prototype.updateFloatingTerminalPoint = function(edge, start, end, source)
{
if (start != null && edge != null &&
(start.style['snapToPoint'] == '1' ||
edge.style['snapToPoint'] == '1'))
(start.style.snapToPoint == '1' ||
edge.style.snapToPoint == '1'))
{
start = this.getTerminalPort(edge, start, source);
let next = this.getNextPoint(edge, end, source);
@ -6568,9 +6568,9 @@ if (typeof mxVertexHandler != 'undefined')
{
let style = this.getCurrentCellStyle(parent);
if (style['expand'] != null)
if (style.expand != null)
{
return style['expand'] != '0';
return style.expand != '0';
}
}
@ -9428,7 +9428,7 @@ if (typeof mxVertexHandler != 'undefined')
{
let state = this.graph.view.getState(this.editingCell);
return state != null && state.style['html'] == 1;
return state != null && state.style.html == 1;
};
/**
@ -9597,7 +9597,7 @@ if (typeof mxVertexHandler != 'undefined')
// dashed borders for divs and table cells
let state = this.graph.view.getState(cell);
if (state != null && state.style['html'] == 1)
if (state != null && state.style.html == 1)
{
this.textarea.className = 'mxCellEditor geContentEditable';
}
@ -10157,7 +10157,7 @@ if (typeof mxVertexHandler != 'undefined')
stackLayoutResizeCell.apply(this, arguments);
let style = this.graph.getCellStyle(cell);
if (style['childLayout'] == null)
if (style.childLayout == null)
{
let parent = cell.getParent();
let geo = (parent != null) ? parent.getGeometry() : null;
@ -10166,7 +10166,7 @@ if (typeof mxVertexHandler != 'undefined')
{
style = this.graph.getCellStyle(parent);
if (style['childLayout'] == 'stackLayout')
if (style.childLayout == 'stackLayout')
{
let border = parseFloat(mxUtils.getValue(style, 'stackBorder', mxStackLayout.prototype.border));
let horizontal = mxUtils.getValue(style, 'horizontalStack', '1') == '1';
@ -10675,7 +10675,7 @@ if (typeof mxVertexHandler != 'undefined')
{
let result = new mxPoint(0, 0);
let tol = this.tolerance;
let name = this.state.style['shape'];
let name = this.state.style.shape;
if (mxCellRenderer.defaultShapes[name] == null &&
mxStencilRegistry.getStencil(name) == null)

View File

@ -1656,7 +1656,7 @@
let mxRhombusPaintVertexShape = mxRhombus.prototype.paintVertexShape;
mxRhombus.prototype.getLabelBounds = function(rect)
{
if (this.style['double'] == 1)
if (this.style.double == 1)
{
let margin = (Math.max(2, this.strokewidth + 1) * 2 + parseFloat(
this.style[mxConstants.'margin'] || 0)) * this.scale;
@ -1671,7 +1671,7 @@
{
mxRhombusPaintVertexShape.apply(this, arguments);
if (!this.outline && this.style['double'] == 1)
if (!this.outline && this.style.double == 1)
{
let margin = Math.max(2, this.strokewidth + 1) * 2 +
parseFloat(this.style[mxConstants.'margin'] || 0);
@ -1703,7 +1703,7 @@
};
ExtendedShape.prototype.getLabelBounds = function(rect)
{
if (this.style['double'] == 1)
if (this.style.double == 1)
{
let margin = (Math.max(2, this.strokewidth + 1) + parseFloat(
this.style[mxConstants.'margin'] || 0)) * this.scale;
@ -1719,7 +1719,7 @@
{
if (this.style != null)
{
if (!this.outline && this.style['double'] == 1)
if (!this.outline && this.style.double == 1)
{
let margin = Math.max(2, this.strokewidth + 1) + parseFloat(this.style[mxConstants.'margin'] || 0);
x += margin;
@ -2144,9 +2144,9 @@
{
let sw = (parseFloat(vertex.style.strokeWidth || 1) * vertex.view.scale / 2) - 1;
if (vertex.style['backboneSize'] != null)
if (vertex.style.backboneSize != null)
{
sw += (parseFloat(vertex.style['backboneSize']) * vertex.view.scale / 2) - 1;
sw += (parseFloat(vertex.style.backboneSize) * vertex.view.scale / 2) - 1;
}
if (vertex.style.direction == 'south' ||
@ -3782,14 +3782,14 @@
{
if (mxUtils.getValue(state.style, 'absoluteArcSize', 0) == '1')
{
this.state.style['arcSize'] = Math.round(Math.max(0, Math.min(bounds.width,
this.state.style.arcSize = Math.round(Math.max(0, Math.min(bounds.width,
(bounds.x + bounds.width - pt.x) * 2)));
}
else
{
let f = Math.min(50, Math.max(0, (bounds.width - pt.x + bounds.x) * 100 /
Math.min(bounds.width, bounds.height)));
this.state.style['arcSize'] = Math.round(f);
this.state.style.arcSize = Math.round(f);
}
});
}
@ -3826,7 +3826,7 @@
let fixed = (fixedDefaultValue != null) ? mxUtils.getValue(this.state.style, 'fixedSize', '0') != '0' : null;
let size = (fixed) ? (pt.x - bounds.x) : Math.max(0, Math.min(max, (pt.x - bounds.x) / bounds.width * 0.75));
this.state.style['size'] = size;
this.state.style.size = size;
}, false, true)];
if (mxUtils.getValue(state.style, 'rounded', false))
@ -3855,7 +3855,7 @@
let fixed = (fixedDefaultValue != null) ? mxUtils.getValue(this.state.style, 'fixedSize', '0') != '0' : null;
let size = (fixed) ? (pt.x - bounds.x) : Math.max(0, Math.min(max, (pt.x - bounds.x) / bounds.width));
this.state.style['size'] = size;
this.state.style.size = size;
}, false, redrawEdges)];
if (allowArcHandle && mxUtils.getValue(state.style, 'rounded', false))
@ -3879,7 +3879,7 @@
return new mxPoint(bounds.x + size, bounds.y + size);
}, function(bounds, pt)
{
this.state.style['size'] = Math.round(Math.max(0, Math.min(Math.min(bounds.width, pt.x - bounds.x),
this.state.style.size = Math.round(Math.max(0, Math.min(Math.min(bounds.width, pt.x - bounds.x),
Math.min(bounds.height, pt.y - bounds.y))) / factor);
}, false)];
@ -3903,7 +3903,7 @@
return new mxPoint(bounds.x, bounds.y + size);
}, function(bounds, pt)
{
this.state.style['size'] = Math.max(0, pt.y - bounds.y);
this.state.style.size = Math.max(0, pt.y - bounds.y);
}, true)];
}
};
@ -3920,8 +3920,8 @@
return new mxPoint(bounds.x + (1 - as) * bounds.width, bounds.y + (1 - aw) * bounds.height / 2);
}, function(bounds, pt)
{
this.state.style['arrowWidth'] = Math.max(0, Math.min(1, Math.abs(bounds.y + bounds.height / 2 - pt.y) / bounds.height * 2));
this.state.style['arrowSize'] = Math.max(0, Math.min(maxSize, (bounds.x + bounds.width - pt.x) / (bounds.width)));
this.state.style.arrowWidth = Math.max(0, Math.min(1, Math.abs(bounds.y + bounds.height / 2 - pt.y) / bounds.height * 2));
this.state.style.arrowSize = Math.max(0, Math.min(maxSize, (bounds.x + bounds.width - pt.x) / (bounds.width)));
})];
};
};
@ -3977,7 +3977,7 @@
}, function(dist, nx, ny, p0, p1, pt)
{
let w = Math.sqrt(mxUtils.ptSegDistSq(p0.x, p0.y, p1.x, p1.y, pt.x, pt.y));
state.style['width'] = Math.round(w * 2) / state.view.scale - spacing;
state.style.width = Math.round(w * 2) / state.view.scale - spacing;
});
};
@ -4014,7 +4014,7 @@
let l = mxUtils.ptLineDist(p0.x, p0.y, p0.x + ny, p0.y - nx, pt.x, pt.y);
state.style.startSize = Math.round((l - state.shape.strokewidth) * 100 / 3) / 100 / state.view.scale;
state.style['width'] = Math.round(w * 2) / state.view.scale;
state.style.width = Math.round(w * 2) / state.view.scale;
// Applies to opposite side
if (mxEvent.isControlDown(me.getEvent()))
@ -4045,13 +4045,13 @@
let l = mxUtils.ptLineDist(p0.x, p0.y, p0.x + ny, p0.y - nx, pt.x, pt.y);
state.style.startSize = Math.round((l - state.shape.strokewidth) * 100 / 3) / 100 / state.view.scale;
state.style['startWidth'] = Math.max(0, Math.round(w * 2) - state.shape.getEdgeWidth()) / state.view.scale;
state.style.startWidth = Math.max(0, Math.round(w * 2) - state.shape.getEdgeWidth()) / state.view.scale;
// Applies to opposite side
if (mxEvent.isControlDown(me.getEvent()))
{
state.style.endSize = state.style.startSize;
state.style['endWidth'] = state.style['startWidth'];
state.style.endWidth = state.style.startWidth;
}
// Snaps to endWidth
@ -4062,9 +4062,9 @@
state.style.startSize = state.style.endSize;
}
if (Math.abs(parseFloat(state.style['startWidth']) - parseFloat(state.style['endWidth'])) < tol)
if (Math.abs(parseFloat(state.style.startWidth) - parseFloat(state.style.endWidth)) < tol)
{
state.style['startWidth'] = state.style['endWidth'];
state.style.startWidth = state.style.endWidth;
}
}
}));
@ -4085,7 +4085,7 @@
let l = mxUtils.ptLineDist(p0.x, p0.y, p0.x + ny, p0.y - nx, pt.x, pt.y);
state.style.endSize = Math.round((l - state.shape.strokewidth) * 100 / 3) / 100 / state.view.scale;
state.style['width'] = Math.round(w * 2) / state.view.scale;
state.style.width = Math.round(w * 2) / state.view.scale;
// Applies to opposite side
if (mxEvent.isControlDown(me.getEvent()))
@ -4116,13 +4116,13 @@
let l = mxUtils.ptLineDist(p0.x, p0.y, p0.x + ny, p0.y - nx, pt.x, pt.y);
state.style.endSize = Math.round((l - state.shape.strokewidth) * 100 / 3) / 100 / state.view.scale;
state.style['endWidth'] = Math.max(0, Math.round(w * 2) - state.shape.getEdgeWidth()) / state.view.scale;
state.style.endWidth = Math.max(0, Math.round(w * 2) - state.shape.getEdgeWidth()) / state.view.scale;
// Applies to opposite side
if (mxEvent.isControlDown(me.getEvent()))
{
state.style.startSize = state.style.endSize;
state.style['startWidth'] = state.style['endWidth'];
state.style.startWidth = state.style.endWidth;
}
// Snaps to start geometry
@ -4133,9 +4133,9 @@
state.style.endSize = state.style.startSize;
}
if (Math.abs(parseFloat(state.style['endWidth']) - parseFloat(state.style['startWidth'])) < tol)
if (Math.abs(parseFloat(state.style.endWidth) - parseFloat(state.style.startWidth)) < tol)
{
state.style['endWidth'] = state.style['startWidth'];
state.style.endWidth = state.style.startWidth;
}
}
}));
@ -4218,7 +4218,7 @@
return new mxPoint(bounds.getCenterX(), bounds.y + size);
}, function(bounds, pt)
{
this.state.style['size'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.size = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
},
'umlFrame': function(state)
@ -4231,8 +4231,8 @@
return new mxPoint(bounds.x + w0, bounds.y + h0);
}, function(bounds, pt)
{
this.state.style['width'] = Math.round(Math.max(UmlFrame.prototype.corner, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style['height'] = Math.round(Math.max(UmlFrame.prototype.corner * 1.5, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.width = Math.round(Math.max(UmlFrame.prototype.corner, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style.height = Math.round(Math.max(UmlFrame.prototype.corner * 1.5, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
return handles;
@ -4250,7 +4250,7 @@
{
let fixed = mxUtils.getValue(this.state.style, 'fixedSize', '0') != '0';
let size = (fixed) ? Math.max(0, Math.min(bounds.width * 0.5, (pt.x - bounds.x))) : Math.max(0, Math.min(0.5, (pt.x - bounds.x) / bounds.width));
this.state.style['size'] = size;
this.state.style.size = size;
}, false)];
if (mxUtils.getValue(state.style, 'rounded', false))
@ -4271,7 +4271,7 @@
}, function(bounds, pt)
{
let m = Math.min(bounds.width, bounds.height);
this.state.style['size'] = Math.max(0, Math.min(1, Math.min((Math.max(0, bounds.getCenterY() - pt.y) / m) * 2,
this.state.style.size = Math.max(0, Math.min(1, Math.min((Math.max(0, bounds.getCenterY() - pt.y) / m) * 2,
(Math.max(0, bounds.getCenterX() - pt.x) / m) * 2)));
})];
},
@ -4285,7 +4285,7 @@
return new mxPoint(bounds.x + bounds.width - size, bounds.y + size);
}, function(bounds, pt)
{
this.state.style['size'] = Math.round(Math.max(0, Math.min(Math.min(bounds.width, bounds.x + bounds.width - pt.x),
this.state.style.size = Math.round(Math.max(0, Math.min(Math.min(bounds.width, bounds.x + bounds.width - pt.x),
Math.min(bounds.height, pt.y - bounds.y))));
})];
},
@ -4299,7 +4299,7 @@
return new mxPoint(bounds.x + bounds.width - size, bounds.y + size);
}, function(bounds, pt)
{
this.state.style['size'] = Math.round(Math.max(0, Math.min(Math.min(bounds.width, bounds.x + bounds.width - pt.x),
this.state.style.size = Math.round(Math.max(0, Math.min(Math.min(bounds.width, bounds.x + bounds.width - pt.x),
Math.min(bounds.height, pt.y - bounds.y))));
})];
},
@ -4312,7 +4312,7 @@
return new mxPoint(bounds.x + bounds.width / 4, bounds.y + size * 3 / 4);
}, function(bounds, pt)
{
this.state.style['size'] = Math.round(Math.max(0, Math.min(bounds.height, (pt.y - bounds.y) * 4 / 3)));
this.state.style.size = Math.round(Math.max(0, Math.min(bounds.height, (pt.y - bounds.y) * 4 / 3)));
}, false)];
if (mxUtils.getValue(state.style, 'rounded', false))
@ -4335,7 +4335,7 @@
let fixed = mxUtils.getValue(this.state.style, 'fixedSize', '0') != '0';
let size = (fixed) ? Math.max(0, Math.min(bounds.width, (bounds.x + bounds.width - pt.x))) : Math.max(0, Math.min(1, (bounds.x + bounds.width - pt.x) / bounds.width));
this.state.style['size'] = size;
this.state.style.size = size;
}, false)];
},
'callout': function(state)
@ -4350,8 +4350,8 @@
}, function(bounds, pt)
{
let base = Math.max(0, Math.min(bounds.width, mxUtils.getValue(this.state.style, 'base', CalloutShape.prototype.base)));
this.state.style['size'] = Math.round(Math.max(0, Math.min(bounds.height, bounds.y + bounds.height - pt.y)));
this.state.style['position'] = Math.round(Math.max(0, Math.min(1, (pt.x - bounds.x) / bounds.width)) * 100) / 100;
this.state.style.size = Math.round(Math.max(0, Math.min(bounds.height, bounds.y + bounds.height - pt.y)));
this.state.style.position = Math.round(Math.max(0, Math.min(1, (pt.x - bounds.x) / bounds.width)) * 100) / 100;
}, false), createHandle(state, ['position2'], function(bounds)
{
var position2 = Math.max(0, Math.min(1, mxUtils.getValue(this.state.style, 'position2', CalloutShape.prototype.position2)));
@ -4371,7 +4371,7 @@
{
let position = Math.max(0, Math.min(1, mxUtils.getValue(this.state.style, 'position', CalloutShape.prototype.position)));
this.state.style['base'] = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x - position * bounds.width)));
this.state.style.base = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x - position * bounds.width)));
}, false)];
if (mxUtils.getValue(state.style, 'rounded', false))
@ -4391,8 +4391,8 @@
return new mxPoint(bounds.x + dx, bounds.y + dy);
}, function(bounds, pt)
{
this.state.style['dx'] = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style['dy'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.dx = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style.dy = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
if (mxUtils.getValue(state.style, 'rounded', false))
@ -4412,8 +4412,8 @@
return new mxPoint(bounds.x + dx / 2, bounds.y + dy * 2);
}, function(bounds, pt)
{
this.state.style['jettyWidth'] = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)) * 2);
this.state.style['jettyHeight'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)) / 2);
this.state.style.jettyWidth = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)) * 2);
this.state.style.jettyHeight = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)) / 2);
})];
return handles;
@ -4428,8 +4428,8 @@
return new mxPoint(bounds.x + dx, bounds.y + dy);
}, function(bounds, pt)
{
this.state.style['dx'] = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style['dy'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.dx = Math.round(Math.max(0, Math.min(bounds.width, pt.x - bounds.x)));
this.state.style.dy = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
},
'tee': function(state)
@ -4442,8 +4442,8 @@
return new mxPoint(bounds.x + (bounds.width + dx) / 2, bounds.y + dy);
}, function(bounds, pt)
{
this.state.style['dx'] = Math.round(Math.max(0, Math.min(bounds.width / 2, (pt.x - bounds.x - bounds.width / 2)) * 2));
this.state.style['dy'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.dx = Math.round(Math.max(0, Math.min(bounds.width / 2, (pt.x - bounds.x - bounds.width / 2)) * 2));
this.state.style.dy = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
},
'singleArrow': createArrowHandleFunction(1),
@ -4470,8 +4470,8 @@
tw = bounds.width - tw;
}
this.state.style['tabWidth'] = Math.round(tw);
this.state.style['tabHeight'] = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
this.state.style.tabWidth = Math.round(tw);
this.state.style.tabHeight = Math.round(Math.max(0, Math.min(bounds.height, pt.y - bounds.y)));
}, false)];
},
'document': function(state)
@ -4483,7 +4483,7 @@
return new mxPoint(bounds.x + 3 * bounds.width / 4, bounds.y + (1 - size) * bounds.height);
}, function(bounds, pt)
{
this.state.style['size'] = Math.max(0, Math.min(1, (bounds.y + bounds.height - pt.y) / bounds.height));
this.state.style.size = Math.max(0, Math.min(1, (bounds.y + bounds.height - pt.y) / bounds.height));
}, false)];
},
'tape': function(state)
@ -4495,7 +4495,7 @@
return new mxPoint(bounds.getCenterX(), bounds.y + size * bounds.height / 2);
}, function(bounds, pt)
{
this.state.style['size'] = Math.max(0, Math.min(1, ((pt.y - bounds.y) / bounds.height) * 2));
this.state.style.size = Math.max(0, Math.min(1, ((pt.y - bounds.y) / bounds.height) * 2));
}, false)];
},
'isoCube2' : function(state)
@ -4508,7 +4508,7 @@
return new mxPoint(bounds.x, bounds.y + isoH);
}, function(bounds, pt)
{
this.state.style['isoAngle'] = Math.max(0, (pt.y - bounds.y) * 50 / bounds.height);
this.state.style.isoAngle = Math.max(0, (pt.y - bounds.y) * 50 / bounds.height);
}, true)];
},
'cylinder2' : createCylinderHandleFunction(CylinderShape.prototype.size),
@ -4522,7 +4522,7 @@
return new mxPoint(bounds.getCenterX(), bounds.y + (1 - size) * bounds.height);
}, function(bounds, pt)
{
this.state.style['size'] = Math.max(0, Math.min(1, (bounds.y + bounds.height - pt.y) / bounds.height));
this.state.style.size = Math.max(0, Math.min(1, (bounds.y + bounds.height - pt.y) / bounds.height));
}, false)];
},
'step': createDisplayHandleFunction(StepShape.prototype.size, true, null, true, StepShape.prototype.fixedSize),
@ -4550,7 +4550,7 @@
// LATER: Make locked state independent of rotatable flag, fix toggle if default is false
//if (this.graph.isCellResizable(this.state.cell) || this.graph.isCellMovable(this.state.cell))
{
let name = this.state.style['shape'];
let name = this.state.style.shape;
if (mxCellRenderer.defaultShapes[name] == null &&
mxStencilRegistry.getStencil(name) == null)
@ -4592,7 +4592,7 @@
mxEdgeHandler.prototype.createCustomHandles = function()
{
let name = this.state.style['shape'];
let name = this.state.style.shape;
if (mxCellRenderer.defaultShapes[name] == null &&
mxStencilRegistry.getStencil(name) == null)

View File

@ -3739,7 +3739,7 @@ Sidebar.prototype.createDragSource = function(elt, dropHandler, preview, cells,
arrowLeft.style.left = Math.floor(bds.x - this.triangleLeft.width) + 'px';
arrowLeft.style.top = arrowRight.style.top;
if (state.style['portConstraint'] != 'eastwest')
if (state.style.portConstraint != 'eastwest')
{
graph.container.appendChild(arrowUp);
graph.container.appendChild(arrowDown);

View File

@ -127,7 +127,7 @@ class mxElbowEdgeHandler extends mxEdgeHandler {
this.state.style.edge === EDGESTYLE_TOPTOBOTTOM ||
((this.state.style.edge === mxEdgeStyle.ElbowConnector ||
this.state.style.edge === EDGESTYLE_ELBOW) &&
this.state.style['elbow'] === ELBOW_VERTICAL)
this.state.style.elbow === ELBOW_VERTICAL)
? 'row-resize'
: 'col-resize';
}

View File

@ -374,7 +374,7 @@ class mxEdgeStyle {
if (
!horizontal &&
(vertical || state.style['elbow'] === ELBOW_VERTICAL)
(vertical || state.style.elbow === ELBOW_VERTICAL)
) {
mxEdgeStyle.TopToBottom(state, source, target, points, result);
} else {

View File

@ -291,11 +291,11 @@ class mxCellRenderer {
shape.apply(state);
shape.image = state.view.graph.getImage(state);
shape.indicatorColor = state.view.graph.getIndicatorColor(state);
shape.indicatorStrokeColor = state.style['indicatorStrokeColor'];
shape.indicatorStrokeColor = state.style.indicatorStrokeColor;
shape.indicatorGradientColor = state.view.graph.getIndicatorGradientColor(
state
);
shape.indicatorDirection = state.style['indicatorDirection'];
shape.indicatorDirection = state.style.indicatorDirection;
shape.indicatorImage = state.view.graph.getIndicatorImage(state);
this.postConfigureShape(state);
}

View File

@ -4814,9 +4814,9 @@ class mxGraph extends mxEventSource {
* var result = graphGetPreferredSizeForCell.apply(this, arguments);
* var style = this.getCellStyle(cell);
*
* if (style['minWidth'] > 0)
* if (style.minWidth > 0)
* {
* result.width = Math.max(style['minWidth'], result.width);
* result.width = Math.max(style.minWidth, result.width);
* }
*
* return result;
@ -8674,7 +8674,7 @@ class mxGraph extends mxEventSource {
* {
* var style = this.getCurrentCellStyle(cell);
*
* return this.isCellsSelectable() && !this.isCellLocked(cell) && style['selectable'] != 0;
* return this.isCellsSelectable() && !this.isCellLocked(cell) && style.selectable != 0;
* };
* ```
*

View File

@ -5999,9 +5999,9 @@
" * var result = graphGetPreferredSizeForCell.apply(this, arguments);",
" * var style = this.getCellStyle(cell);",
" *",
" * if (style['minWidth'] > 0)",
" * if (style.minWidth > 0)",
" * {",
" * result.width = Math.max(style['minWidth'], result.width);",
" * result.width = Math.max(style.minWidth, result.width);",
" * }",
" *",
" * return result;",
@ -7558,7 +7558,7 @@
" * {",
" * var style = this.getCurrentCellStyle(cell);",
" *",
" * return this.isCellsSelectable() && !this.isCellLocked(cell) && style['selectable'] != 0;",
" * return this.isCellsSelectable() && !this.isCellLocked(cell) && style.selectable != 0;",
" * };",
" * ```",
" *",

View File

@ -86,10 +86,10 @@ const Template = ({ label, ...args }) => {
}
// In case the edge style must be changed during the preview:
// this.edgeState.style['edgeStyle'] = 'orthogonalEdgeStyle';
// this.edgeState.style.edgeStyle = 'orthogonalEdgeStyle';
// And to use the new edge style in the new edge inserted into the graph,
// update the cell style as follows:
// this.edgeState.cell.style = mxUtils.setStyle(this.edgeState.cell.style, 'edgeStyle', this.edgeState.style['edgeStyle']);
// this.edgeState.cell.style = mxUtils.setStyle(this.edgeState.cell.style, 'edgeStyle', this.edgeState.style.edgeStyle);
}
return super.updateEdgeState(pt, constraint);
}