updates to js syntax
parent
a599a51ef9
commit
fc98630dad
|
@ -40,7 +40,7 @@ echo($xml);</pre></blockquote><p>To open a local file, the file should be upload
|
|||
<mxDefaultToolbar>
|
||||
<add as="save" action="save" icon="images/save.gif"/>
|
||||
<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"/>
|
||||
...</pre></blockquote><p>The format of the configuration is described in <a href="../io/mxDefaultToolbarCodec-js.html#mxDefaultToolbarCodec.decode" class=LFunction id=link200 onMouseOver="ShowTip(event, 'tt128', 'link200')" onMouseOut="HideTip('tt128')">mxDefaultToolbarCodec.decode</a>.</p><h4 class=CHeading>Ids</h4><p>For the IDs, there is an implicit behaviour in <a href="../io/mxCodec-js.html#mxCodec" class=LClass id=link201 onMouseOver="ShowTip(event, 'tt3', 'link201')" onMouseOut="HideTip('tt3')">mxCodec</a>: It moves the Id from the cell to the user object at encoding time and vice versa at decoding time. For example, if the Task node from above has an id attribute, then the <a href="../model/mxCell-js.html#mxCell.id" class=LVariable id=link202 onMouseOver="ShowTip(event, 'tt129', 'link202')" onMouseOut="HideTip('tt129')">mxCell.id</a> of the corresponding cell will have this value. If there is no Id collision in the model, then the cell may be retrieved using this Id with the <a href="../model/mxGraphModel-js.html#mxGraphModel.getCell" class=LFunction id=link203 onMouseOver="ShowTip(event, 'tt130', 'link203')" onMouseOut="HideTip('tt130')">mxGraphModel.getCell</a> function. If there is a collision, a new Id will be created for the cell using <a href="../model/mxGraphModel-js.html#mxGraphModel.createId" class=LFunction id=link204 onMouseOver="ShowTip(event, 'tt131', 'link204')" onMouseOut="HideTip('tt131')">mxGraphModel.createId</a>. At encoding time, this new Id will replace the value previously stored under the id attribute in the Task node.</p><p>See <a href="../io/mxEditorCodec-js.html#mxEditorCodec" class=LClass id=link205 onMouseOver="ShowTip(event, 'tt132', 'link205')" onMouseOut="HideTip('tt132')">mxEditorCodec</a>, <a href="../io/mxDefaultToolbarCodec-js.html#mxDefaultToolbarCodec" class=LClass id=link206 onMouseOver="ShowTip(event, 'tt133', 'link206')" onMouseOut="HideTip('tt133')">mxDefaultToolbarCodec</a> and <a href="../io/mxDefaultPopupMenuCodec-js.html#mxDefaultPopupMenuCodec" class=LClass id=link207 onMouseOver="ShowTip(event, 'tt127', 'link207')" onMouseOut="HideTip('tt127')">mxDefaultPopupMenuCodec</a> for information about configuring the editor and user interface.</p><h4 class=CHeading>Programmatically inserting cells</h4><p>For inserting a new cell, say, by clicking a button in the document, the following code can be used. This requires an reference to the editor.</p><blockquote><pre class="prettyprint">var userObject = new Object();
|
||||
...</pre></blockquote><p>The format of the configuration is described in <a href="../io/mxDefaultToolbarCodec-js.html#mxDefaultToolbarCodec.decode" class=LFunction id=link200 onMouseOver="ShowTip(event, 'tt128', 'link200')" onMouseOut="HideTip('tt128')">mxDefaultToolbarCodec.decode</a>.</p><h4 class=CHeading>Ids</h4><p>For the IDs, there is an implicit behaviour in <a href="../io/mxCodec-js.html#mxCodec" class=LClass id=link201 onMouseOver="ShowTip(event, 'tt3', 'link201')" onMouseOut="HideTip('tt3')">mxCodec</a>: It moves the Id from the cell to the user object at encoding time and vice versa at decoding time. For example, if the Task node from above has an id attribute, then the <a href="../model/mxCell-js.html#mxCell.id" class=LVariable id=link202 onMouseOver="ShowTip(event, 'tt129', 'link202')" onMouseOut="HideTip('tt129')">mxCell.id</a> of the corresponding cell will have this value. If there is no Id collision in the model, then the cell may be retrieved using this Id with the <a href="../model/mxGraphModel-js.html#mxGraphModel.getCell" class=LFunction id=link203 onMouseOver="ShowTip(event, 'tt130', 'link203')" onMouseOut="HideTip('tt130')">mxGraphModel.getCell</a> function. If there is a collision, a new Id will be created for the cell using <a href="../model/mxGraphModel-js.html#mxGraphModel.createId" class=LFunction id=link204 onMouseOver="ShowTip(event, 'tt131', 'link204')" onMouseOut="HideTip('tt131')">mxGraphModel.createId</a>. At encoding time, this new Id will replace the value previously stored under the id attribute in the Task node.</p><p>See <a href="../io/mxEditorCodec-js.html#mxEditorCodec" class=LClass id=link205 onMouseOver="ShowTip(event, 'tt132', 'link205')" onMouseOut="HideTip('tt132')">mxEditorCodec</a>, <a href="../io/mxDefaultToolbarCodec-js.html#mxDefaultToolbarCodec" class=LClass id=link206 onMouseOver="ShowTip(event, 'tt133', 'link206')" onMouseOut="HideTip('tt133')">mxDefaultToolbarCodec</a> and <a href="../io/mxDefaultPopupMenuCodec-js.html#mxDefaultPopupMenuCodec" class=LClass id=link207 onMouseOver="ShowTip(event, 'tt127', 'link207')" onMouseOut="HideTip('tt127')">mxDefaultPopupMenuCodec</a> for information about configuring the editor and user interface.</p><h4 class=CHeading>Programmatically inserting cells</h4><p>For inserting a new cell, say, by clicking a button in the document, the following code can be used. This requires an reference to the editor.</p><blockquote><pre class="prettyprint">var userObject = {};
|
||||
var parent = editor.graph.getDefaultParent();
|
||||
var model = editor.graph.model;
|
||||
model.beginUpdate();
|
||||
|
|
|
@ -11,7 +11,7 @@ if (browserType) {document.write("<div class=" + browserType + ">");if (browserV
|
|||
|
||||
|
||||
|
||||
<div id=Content><div class="CClass"><div class=CTopic id=MainTopic><h1 class=CTitle><a name="mxObjectCodec"></a>mxObjectCodec</h1><div class=CBody><p>Generic codec for JavaScript objects that implements a mapping between JavaScript objects and XML nodes that maps each field or element to an attribute or child node, and vice versa.</p><h4 class=CHeading>Atomic Values</h4><p>Consider the following example.</p><blockquote><pre class="prettyprint">var obj = new Object();
|
||||
<div id=Content><div class="CClass"><div class=CTopic id=MainTopic><h1 class=CTitle><a name="mxObjectCodec"></a>mxObjectCodec</h1><div class=CBody><p>Generic codec for JavaScript objects that implements a mapping between JavaScript objects and XML nodes that maps each field or element to an attribute or child node, and vice versa.</p><h4 class=CHeading>Atomic Values</h4><p>Consider the following example.</p><blockquote><pre class="prettyprint">var obj = {};
|
||||
obj.foo = "Foo";
|
||||
obj.bar = "Bar";</pre></blockquote><p>This object is encoded into an XML node using the following.</p><blockquote><pre class="prettyprint">var enc = new mxCodec();
|
||||
var node = enc.encode(obj);</pre></blockquote><p>The output of the encoding may be viewed using <a href="../util/mxLog-js.html#mxLog" class=LClass id=link48 onMouseOver="ShowTip(event, 'tt38', 'link48')" onMouseOut="HideTip('tt38')">mxLog</a> as follows.</p><blockquote><pre class="prettyprint">mxLog.show();
|
||||
|
@ -29,7 +29,7 @@ obj["foo"] = {bar: "Bar"};</pre></blockquote><p>This array i
|
|||
|
||||
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="mxObjectCodec.Functions"></a>Functions</h3></div></div>
|
||||
|
||||
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxObjectCodec.mxObjectCodec"></a>mxObjectCodec</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>function mxObjectCodec(</td><td class="PParameter prettyprint " nowrap>template,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>exclude,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>idrefs,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>mapping</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs a new codec for the specified template object. The variables in the optional exclude array are ignored by the codec. Variables in the optional idrefs array are turned into references in the XML. The optional mapping may be used to map from variable names to XML attributes. The argument is created as follows:</p><blockquote><pre class="prettyprint">var mapping = new Object();
|
||||
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxObjectCodec.mxObjectCodec"></a>mxObjectCodec</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>function mxObjectCodec(</td><td class="PParameter prettyprint " nowrap>template,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>exclude,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>idrefs,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>mapping</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs a new codec for the specified template object. The variables in the optional exclude array are ignored by the codec. Variables in the optional idrefs array are turned into references in the XML. The optional mapping may be used to map from variable names to XML attributes. The argument is created as follows:</p><blockquote><pre class="prettyprint">var mapping = {};
|
||||
mapping['variableName'] = 'attribute-name';</pre></blockquote><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>template</td><td class=CDLDescription>Prototypical instance of the object to be encoded/decoded.</td></tr><tr><td class=CDLEntry>exclude</td><td class=CDLDescription>Optional array of fieldnames to be ignored.</td></tr><tr><td class=CDLEntry>idrefs</td><td class=CDLDescription>Optional array of fieldnames to be converted to/from references.</td></tr><tr><td class=CDLEntry>mapping</td><td class=CDLDescription>Optional mapping from field- to attributenames.</td></tr></table></div></div></div>
|
||||
|
||||
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="mxObjectCodec.Variables"></a>Variables</h3></div></div>
|
||||
|
|
|
@ -17,7 +17,7 @@ mxClipboard.paste(graph2);</pre></blockquote><p>This copies the selection cells
|
|||
cells = cells || graph.getSelectionCells();
|
||||
var result = graph.getExportableCells(cells);
|
||||
|
||||
mxClipboard.parents = new Object();
|
||||
mxClipboard.parents = {};
|
||||
|
||||
for (var i = 0; i < result.length; i++)
|
||||
{
|
||||
|
|
|
@ -27,7 +27,7 @@ style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;</pre></blockquote><p>F
|
|||
var label = this.convertValueToString(cell);
|
||||
return 'Tooltip for '+label;
|
||||
}</pre></blockquote><h4 class=CHeading>Shapes & Styles</h4><p>The implementation of new shapes is demonstrated in the examples. We’ll assume that we have implemented a custom shape with the name BoxShape which we want to use for drawing vertices. To use this shape, it must first be registered in the cell renderer as follows:</p><blockquote><pre class="prettyprint">mxCellRenderer.registerShape('box', BoxShape);</pre></blockquote><p>The code registers the BoxShape constructor under the name box in the cell renderer of the graph. The shape can now be referenced using the shape-key in a style definition. (The cell renderer contains a set of additional shapes, namely one for each constant with a SHAPE-prefix in <a href="../util/mxConstants-js.html#mxConstants" class=LClass id=link770 onMouseOver="ShowTip(event, 'tt527', 'link770')" onMouseOut="HideTip('tt527')">mxConstants</a>.)</p><p>Styles are a collection of key, value pairs and a stylesheet is a collection of named styles. The names are referenced by the cellstyle, which is stored in <a href="../model/mxCell-js.html#mxCell.style" class=LVariable id=link771 onMouseOver="ShowTip(event, 'tt528', 'link771')" onMouseOut="HideTip('tt528')">mxCell.style</a> with the following format: [stylename;|key=value;]. The string is resolved to a collection of key, value pairs, where the keys are overridden with the values in the string.</p><p>When introducing a new shape, the name under which the shape is registered must be used in the stylesheet. There are three ways of doing this:</p><ul><li>By changing the default style, so that all vertices will use the new shape</li><li>By defining a new style, so that only vertices with the respective cellstyle will use the new shape</li><li>By using shape=box in the cellstyle’s optional list of key, value pairs to be overridden</li></ul><p>In the first case, the code to fetch and modify the default style for vertices is as follows:</p><blockquote><pre class="prettyprint">var style = graph.getStylesheet().getDefaultVertexStyle();
|
||||
style[mxConstants.STYLE_SHAPE] = 'box';</pre></blockquote><p>The code takes the default vertex style, which is used for all vertices that do not have a specific cellstyle, and modifies the value for the shape-key in-place to use the new BoxShape for drawing vertices. This is done by assigning the box value in the second line, which refers to the name of the BoxShape in the cell renderer.</p><p>In the second case, a collection of key, value pairs is created and then added to the stylesheet under a new name. In order to distinguish the shapename and the stylename we’ll use boxstyle for the stylename:</p><blockquote><pre class="prettyprint">var style = new Object();
|
||||
style[mxConstants.STYLE_SHAPE] = 'box';</pre></blockquote><p>The code takes the default vertex style, which is used for all vertices that do not have a specific cellstyle, and modifies the value for the shape-key in-place to use the new BoxShape for drawing vertices. This is done by assigning the box value in the second line, which refers to the name of the BoxShape in the cell renderer.</p><p>In the second case, a collection of key, value pairs is created and then added to the stylesheet under a new name. In order to distinguish the shapename and the stylename we’ll use boxstyle for the stylename:</p><blockquote><pre class="prettyprint">var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = 'box';
|
||||
style[mxConstants.STYLE_STROKECOLOR] = '#000000';
|
||||
style[mxConstants.STYLE_FONTCOLOR] = '#000000';
|
||||
|
|
|
@ -34,7 +34,7 @@ edgeStyle[mxConstants.STYLE_EDGE] = mxEdgeStyle.EntityRelation;</pre></blockquot
|
|||
|
||||
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxStylesheet.getDefaultEdgeStyle"></a>getDefaultEdgeStyle</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td class="prettyprint">mxStylesheet.prototype.getDefaultEdgeStyle = function()</td></tr></table></blockquote><p>Sets the default style for edges.</p></div></div></div>
|
||||
|
||||
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxStylesheet.putCellStyle"></a>putCellStyle</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxStylesheet.prototype.putCellStyle = function(</td><td class="PParameter prettyprint " nowrap>name,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>style</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Stores the given map of key, value pairs under the given name in <a href="#mxStylesheet.styles" class=LFunction id=link20 onMouseOver="ShowTip(event, 'tt9', 'link20')" onMouseOut="HideTip('tt9')">styles</a>.</p><h4 class=CHeading>Example</h4><p>The following example adds a new style called ‘rounded’ into an existing stylesheet:</p><blockquote><pre class="prettyprint">var style = new Object();
|
||||
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxStylesheet.putCellStyle"></a>putCellStyle</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class="PBeforeParameters prettyprint "nowrap>mxStylesheet.prototype.putCellStyle = function(</td><td class="PParameter prettyprint " nowrap>name,</td></tr><tr><td></td><td class="PParameter prettyprint " nowrap>style</td><td class="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Stores the given map of key, value pairs under the given name in <a href="#mxStylesheet.styles" class=LFunction id=link20 onMouseOver="ShowTip(event, 'tt9', 'link20')" onMouseOut="HideTip('tt9')">styles</a>.</p><h4 class=CHeading>Example</h4><p>The following example adds a new style called ‘rounded’ into an existing stylesheet:</p><blockquote><pre class="prettyprint">var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_ROUNDED] = true;
|
||||
|
|
|
@ -1141,7 +1141,7 @@ follow this template to create a style and register it with
|
|||
mxStyleSheet:</p>
|
||||
|
||||
<pre>
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
style[mxConstants.STYLE_OPACITY] = 50;
|
||||
style[mxConstants.STYLE_FONTCOLOR]= '#774400';
|
||||
|
|
|
@ -424,9 +424,9 @@ var editor = new mxEditor(config);
|
|||
For example, consider the following JavaScript object definition:
|
||||
</p>
|
||||
<pre>
|
||||
var object = new Object();
|
||||
var object = {};
|
||||
object.myBool = true;
|
||||
object.myObject = new Object();
|
||||
object.myObject = {};
|
||||
object.myObject.name = 'Test';
|
||||
object.myArray = ['a', ['b', 'c'], 'd'];
|
||||
</pre>
|
||||
|
|
|
@ -127,7 +127,7 @@
|
|||
};
|
||||
|
||||
// Sample user objects with 2 fields
|
||||
var value = new Object();
|
||||
var value = {};
|
||||
value.first = 'First value';
|
||||
value.second = 'Second value';
|
||||
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
|
||||
var urlParams = (function(url)
|
||||
{
|
||||
var result = new Object();
|
||||
var result = {};
|
||||
var params = window.location.search.slice(1).split('&');
|
||||
|
||||
for (var i = 0; i < params.length; i++)
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
// - chrome=0: Chromeless mode.
|
||||
var urlParams = (function(url)
|
||||
{
|
||||
var result = new Object();
|
||||
var result = {};
|
||||
var idx = url.lastIndexOf('?');
|
||||
|
||||
if (idx > 0)
|
||||
|
@ -95,7 +95,7 @@
|
|||
mxResources.parse(xhr[0].getText());
|
||||
|
||||
// Configures the default graph theme
|
||||
var themes = new Object();
|
||||
var themes = {};
|
||||
themes[Graph.prototype.defaultThemeName] = xhr[1].getDocumentElement();
|
||||
|
||||
// Main
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
function Actions(editorUi)
|
||||
{
|
||||
this.editorUi = editorUi;
|
||||
this.actions = new Object();
|
||||
this.actions = {};
|
||||
this.init();
|
||||
};
|
||||
|
||||
|
|
|
@ -1697,7 +1697,7 @@ PageSetupDialog.addPageFormatPanel = function(div, namePostfix, pageFormat, page
|
|||
formatDiv.style.display = 'none';
|
||||
customDiv.style.display = 'none';
|
||||
|
||||
var pf = new Object();
|
||||
var pf = {};
|
||||
var formats = PageSetupDialog.getFormats();
|
||||
|
||||
for (var i = 0; i < formats.length; i++)
|
||||
|
|
|
@ -1626,7 +1626,7 @@ EditorUi.prototype.initClipboard = function()
|
|||
result = result || graph.getSelectionCells();
|
||||
result = graph.getExportableCells(graph.model.getTopmostCells(result));
|
||||
|
||||
var cloneMap = new Object();
|
||||
var cloneMap = {};
|
||||
var lookup = graph.createCellLookup(result);
|
||||
var clones = graph.cloneCells(result, null, cloneMap);
|
||||
|
||||
|
|
|
@ -6356,7 +6356,7 @@ if (typeof mxVertexHandler != 'undefined')
|
|||
*/
|
||||
Graph.prototype.createCellLookup = function(cells, lookup)
|
||||
{
|
||||
lookup = (lookup != null) ? lookup : new Object();
|
||||
lookup = (lookup != null) ? lookup : {};
|
||||
|
||||
for (var i = 0; i < cells.length; i++)
|
||||
{
|
||||
|
@ -6380,7 +6380,7 @@ if (typeof mxVertexHandler != 'undefined')
|
|||
*/
|
||||
Graph.prototype.createCellMapping = function(mapping, lookup, cellMapping)
|
||||
{
|
||||
cellMapping = (cellMapping != null) ? cellMapping : new Object();
|
||||
cellMapping = (cellMapping != null) ? cellMapping : {};
|
||||
|
||||
for (var objectId in mapping)
|
||||
{
|
||||
|
@ -6411,8 +6411,8 @@ if (typeof mxVertexHandler != 'undefined')
|
|||
var cells = []
|
||||
|
||||
// Clones cells to remove invalid edges
|
||||
var cloneMap = new Object();
|
||||
var cellMapping = new Object();
|
||||
var cloneMap = {};
|
||||
var cellMapping = {};
|
||||
var layers = tempModel.getChildren(this.cloneCell(tempModel.root,
|
||||
this.isCloneInvalidEdges(), cloneMap));
|
||||
|
||||
|
@ -6496,7 +6496,7 @@ if (typeof mxVertexHandler != 'undefined')
|
|||
*/
|
||||
Graph.prototype.encodeCells = function(cells)
|
||||
{
|
||||
var cloneMap = new Object();
|
||||
var cloneMap = {};
|
||||
var clones = this.cloneCells(cells, null, cloneMap);
|
||||
|
||||
// Creates a dictionary for fast lookups
|
||||
|
@ -6664,7 +6664,7 @@ if (typeof mxVertexHandler != 'undefined')
|
|||
var graphMoveCells = Graph.prototype.moveCells;
|
||||
Graph.prototype.moveCells = function(cells, dx, dy, clone, target, evt, mapping)
|
||||
{
|
||||
mapping = (mapping != null) ? mapping : new Object();
|
||||
mapping = (mapping != null) ? mapping : {};
|
||||
|
||||
// Replaces source tables with rows
|
||||
if (this.isTable(target))
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
Menus = function(editorUi)
|
||||
{
|
||||
this.editorUi = editorUi;
|
||||
this.menus = new Object();
|
||||
this.menus = {};
|
||||
this.init();
|
||||
|
||||
// Pre-fetches checkmark image
|
||||
|
|
|
@ -8,8 +8,8 @@ function Sidebar(editorUi, container)
|
|||
{
|
||||
this.editorUi = editorUi;
|
||||
this.container = container;
|
||||
this.palettes = new Object();
|
||||
this.taglist = new Object();
|
||||
this.palettes = {};
|
||||
this.taglist = {};
|
||||
this.showTooltips = true;
|
||||
this.graph = editorUi.createTemporaryGraph(this.editorUi.editor.graph.getStylesheet());
|
||||
this.graph.cellRenderer.minSvgStrokeWidth = this.minThumbStrokeWidth;
|
||||
|
@ -769,7 +769,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
|
|||
var active = false;
|
||||
var complete = false;
|
||||
var page = 0;
|
||||
var hash = new Object();
|
||||
var hash = {};
|
||||
|
||||
// Count is dynamically updated below
|
||||
var count = 12;
|
||||
|
@ -822,7 +822,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
|
|||
{
|
||||
clearDiv();
|
||||
searchTerm = input.value;
|
||||
hash = new Object();
|
||||
hash = {};
|
||||
complete = false;
|
||||
page = 0;
|
||||
}
|
||||
|
@ -836,7 +836,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
|
|||
active = true;
|
||||
|
||||
// Ignores old results
|
||||
var current = new Object();
|
||||
var current = {};
|
||||
this.currentSearch = current;
|
||||
|
||||
this.searchEntries(searchTerm, count, page, mxUtils.bind(this, function(results, len, more, terms)
|
||||
|
@ -926,7 +926,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
|
|||
clearDiv();
|
||||
input.value = '';
|
||||
searchTerm = '';
|
||||
hash = new Object();
|
||||
hash = {};
|
||||
button.style.display = 'none';
|
||||
complete = false;
|
||||
input.focus();
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
|
||||
var urlParams = (function(url)
|
||||
{
|
||||
var result = new Object();
|
||||
var result = {};
|
||||
var idx = url.lastIndexOf('?');
|
||||
|
||||
if (idx > 0)
|
||||
|
|
|
@ -71,7 +71,7 @@
|
|||
|
||||
function configureStylesheet(graph)
|
||||
{
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_IMAGE] = 'images/icons48/keys.png';
|
||||
|
|
|
@ -104,7 +104,7 @@
|
|||
graph.view.setTranslate(4, 4);
|
||||
|
||||
// Sets default vertex style
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_ELLIPSE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.EllipsePerimeter;
|
||||
style[mxConstants.STYLE_FILLCOLOR] = '#8CCDF5';
|
||||
|
|
|
@ -493,7 +493,7 @@
|
|||
|
||||
function configureStylesheet(graph)
|
||||
{
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_ALIGN] = mxConstants.ALIGN_CENTER;
|
||||
|
@ -512,7 +512,7 @@
|
|||
|
||||
// NOTE: Alternative vertex style for non-HTML labels should be as
|
||||
// follows. This repaces the above style for HTML labels.
|
||||
/*var style = new Object();
|
||||
/*var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_LABEL;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_VERTICAL_ALIGN] = mxConstants.ALIGN_TOP;
|
||||
|
@ -533,7 +533,7 @@
|
|||
style[mxConstants.STYLE_OPACITY] = '80';
|
||||
graph.getStylesheet().putDefaultVertexStyle(style);*/
|
||||
|
||||
style = new Object();
|
||||
style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_SWIMLANE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_ALIGN] = mxConstants.ALIGN_CENTER;
|
||||
|
@ -549,7 +549,7 @@
|
|||
style[mxConstants.STYLE_FONTSTYLE] = 1;
|
||||
graph.getStylesheet().putCellStyle('group', style);
|
||||
|
||||
style = new Object();
|
||||
style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
|
||||
style[mxConstants.STYLE_FONTCOLOR] = '#774400';
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
|
|
|
@ -628,7 +628,7 @@
|
|||
|
||||
function configureStylesheet(graph)
|
||||
{
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_ALIGN] = mxConstants.ALIGN_LEFT;
|
||||
|
@ -641,7 +641,7 @@
|
|||
style[mxConstants.STYLE_IMAGE_HEIGHT] = '48';
|
||||
graph.getStylesheet().putDefaultVertexStyle(style);
|
||||
|
||||
style = new Object();
|
||||
style = {};
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_SWIMLANE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
style[mxConstants.STYLE_ALIGN] = mxConstants.ALIGN_CENTER;
|
||||
|
|
|
@ -250,7 +250,7 @@ class mxEditor extends mxEventSource {
|
|||
* the following code can be used. This requires an reference to the editor.
|
||||
*
|
||||
* (code)
|
||||
* var userObject = new Object();
|
||||
* var userObject = {};
|
||||
* var parent = editor.graph.getDefaultParent();
|
||||
* var model = editor.graph.model;
|
||||
* model.beginUpdate();
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -2,48 +2,8 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
/**
|
||||
* Class: mxConstraintHandler
|
||||
*
|
||||
* Handles constraints on connection targets. This class is in charge of
|
||||
* showing fixed points when the mouse is over a vertex and handles constraints
|
||||
* to establish new connections.
|
||||
*
|
||||
* Constructor: mxConstraintHandler
|
||||
*
|
||||
* Constructs an new constraint handler.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* graph - Reference to the enclosing <mxGraph>.
|
||||
* factoryMethod - Optional function to create the edge. The function takes
|
||||
* the source and target <mxCell> as the first and second argument and
|
||||
* returns the <mxCell> that represents the new edge.
|
||||
*/
|
||||
function mxConstraintHandler(graph)
|
||||
{
|
||||
this.graph = graph;
|
||||
|
||||
// Adds a graph model listener to update the current focus on changes
|
||||
this.resetHandler = mxUtils.bind(this, (sender, evt)=>
|
||||
{
|
||||
if (this.currentFocus != null && this.graph.view.getState(this.currentFocus.cell) == null)
|
||||
{
|
||||
this.reset();
|
||||
}
|
||||
else
|
||||
{
|
||||
this.redraw();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.model.addListener(mxEvent.CHANGE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.SCALE_AND_TRANSLATE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.TRANSLATE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.SCALE, this.resetHandler);
|
||||
this.graph.addListener(mxEvent.ROOT, this.resetHandler);
|
||||
};
|
||||
|
||||
class mxConstraintHandler {
|
||||
/**
|
||||
* Variable: pointImage
|
||||
*
|
||||
|
@ -72,14 +32,50 @@ enabled = true;
|
|||
*/
|
||||
highlightColor = mxConstants.DEFAULT_VALID_COLOR;
|
||||
|
||||
/**
|
||||
* Class: mxConstraintHandler
|
||||
*
|
||||
* Handles constraints on connection targets. This class is in charge of
|
||||
* showing fixed points when the mouse is over a vertex and handles constraints
|
||||
* to establish new connections.
|
||||
*
|
||||
* Constructor: mxConstraintHandler
|
||||
*
|
||||
* Constructs an new constraint handler.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* graph - Reference to the enclosing <mxGraph>.
|
||||
* factoryMethod - Optional function to create the edge. The function takes
|
||||
* the source and target <mxCell> as the first and second argument and
|
||||
* returns the <mxCell> that represents the new edge.
|
||||
*/
|
||||
constructor(graph) {
|
||||
this.graph = graph;
|
||||
|
||||
// Adds a graph model listener to update the current focus on changes
|
||||
this.resetHandler = mxUtils.bind(this, (sender, evt) => {
|
||||
if (this.currentFocus != null && this.graph.view.getState(this.currentFocus.cell) == null) {
|
||||
this.reset();
|
||||
} else {
|
||||
this.redraw();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.model.addListener(mxEvent.CHANGE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.SCALE_AND_TRANSLATE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.TRANSLATE, this.resetHandler);
|
||||
this.graph.view.addListener(mxEvent.SCALE, this.resetHandler);
|
||||
this.graph.addListener(mxEvent.ROOT, this.resetHandler);
|
||||
};
|
||||
|
||||
/**
|
||||
* Function: isEnabled
|
||||
*
|
||||
* Returns true if events are handled. This implementation
|
||||
* returns <enabled>.
|
||||
*/
|
||||
isEnabled = ()=>
|
||||
{
|
||||
isEnabled = () => {
|
||||
return this.enabled;
|
||||
};
|
||||
|
||||
|
@ -93,8 +89,7 @@ isEnabled = ()=>
|
|||
*
|
||||
* enabled - Boolean that specifies the new enabled state.
|
||||
*/
|
||||
setEnabled = (enabled)=>
|
||||
{
|
||||
setEnabled = (enabled) => {
|
||||
this.enabled = enabled;
|
||||
};
|
||||
|
||||
|
@ -103,20 +98,16 @@ setEnabled = (enabled)=>
|
|||
*
|
||||
* Resets the state of this handler.
|
||||
*/
|
||||
reset = ()=>
|
||||
{
|
||||
if (this.focusIcons != null)
|
||||
{
|
||||
for (var i = 0; i < this.focusIcons.length; i++)
|
||||
{
|
||||
reset = () => {
|
||||
if (this.focusIcons != null) {
|
||||
for (var i = 0; i < this.focusIcons.length; i++) {
|
||||
this.focusIcons[i].destroy();
|
||||
}
|
||||
|
||||
this.focusIcons = null;
|
||||
}
|
||||
|
||||
if (this.focusHighlight != null)
|
||||
{
|
||||
if (this.focusHighlight != null) {
|
||||
this.focusHighlight.destroy();
|
||||
this.focusHighlight = null;
|
||||
}
|
||||
|
@ -138,8 +129,7 @@ reset = ()=>
|
|||
*
|
||||
* me - <mxMouseEvent> whose tolerance should be returned.
|
||||
*/
|
||||
getTolerance = (me)=>
|
||||
{
|
||||
getTolerance = (me) => {
|
||||
return this.graph.getTolerance();
|
||||
};
|
||||
|
||||
|
@ -148,8 +138,7 @@ getTolerance = (me)=>
|
|||
*
|
||||
* Returns the tolerance to be used for intersecting connection points.
|
||||
*/
|
||||
getImageForConstraint = (state, constraint, point)=>
|
||||
{
|
||||
getImageForConstraint = (state, constraint, point) => {
|
||||
return this.pointImage;
|
||||
};
|
||||
|
||||
|
@ -159,8 +148,7 @@ getImageForConstraint = (state, constraint, point)=>
|
|||
* Returns true if the given <mxMouseEvent> should be ignored in <update>. This
|
||||
* implementation always returns false.
|
||||
*/
|
||||
isEventIgnored = (me, source)=>
|
||||
{
|
||||
isEventIgnored = (me, source) => {
|
||||
return false;
|
||||
};
|
||||
|
||||
|
@ -169,8 +157,7 @@ isEventIgnored = (me, source)=>
|
|||
*
|
||||
* Returns true if the given state should be ignored. This always returns false.
|
||||
*/
|
||||
isStateIgnored = (state, source)=>
|
||||
{
|
||||
isStateIgnored = (state, source) => {
|
||||
return false;
|
||||
};
|
||||
|
||||
|
@ -179,12 +166,9 @@ isStateIgnored = (state, source)=>
|
|||
*
|
||||
* Destroys the <focusIcons> if they exist.
|
||||
*/
|
||||
destroyIcons = ()=>
|
||||
{
|
||||
if (this.focusIcons != null)
|
||||
{
|
||||
for (var i = 0; i < this.focusIcons.length; i++)
|
||||
{
|
||||
destroyIcons = () => {
|
||||
if (this.focusIcons != null) {
|
||||
for (var i = 0; i < this.focusIcons.length; i++) {
|
||||
this.focusIcons[i].destroy();
|
||||
}
|
||||
|
||||
|
@ -198,10 +182,8 @@ destroyIcons = ()=>
|
|||
*
|
||||
* Destroys the <focusHighlight> if one exists.
|
||||
*/
|
||||
destroyFocusHighlight = ()=>
|
||||
{
|
||||
if (this.focusHighlight != null)
|
||||
{
|
||||
destroyFocusHighlight = () => {
|
||||
if (this.focusHighlight != null) {
|
||||
this.focusHighlight.destroy();
|
||||
this.focusHighlight = null;
|
||||
}
|
||||
|
@ -213,8 +195,7 @@ destroyFocusHighlight = ()=>
|
|||
* 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());
|
||||
};
|
||||
|
||||
|
@ -223,23 +204,19 @@ isKeepFocusEvent = (me)=>
|
|||
*
|
||||
* Returns the cell for the given event.
|
||||
*/
|
||||
getCellForEvent = (me, point)=>
|
||||
{
|
||||
getCellForEvent = (me, point) => {
|
||||
var cell = me.getCell();
|
||||
|
||||
// Gets cell under actual point if different from event location
|
||||
if (cell == null && point != null && (me.getGraphX() != point.x || me.getGraphY() != point.y))
|
||||
{
|
||||
if (cell == null && point != null && (me.getGraphX() != point.x || me.getGraphY() != point.y)) {
|
||||
cell = this.graph.getCellAt(point.x, point.y);
|
||||
}
|
||||
|
||||
// Uses connectable parent vertex if one exists
|
||||
if (cell != null && !this.graph.isCellConnectable(cell))
|
||||
{
|
||||
if (cell != null && !this.graph.isCellConnectable(cell)) {
|
||||
var parent = this.graph.getModel().getParent(cell);
|
||||
|
||||
if (this.graph.getModel().isVertex(parent) && this.graph.isCellConnectable(parent))
|
||||
{
|
||||
if (this.graph.getModel().isVertex(parent) && this.graph.isCellConnectable(parent)) {
|
||||
cell = parent;
|
||||
}
|
||||
}
|
||||
|
@ -253,15 +230,11 @@ getCellForEvent = (me, point)=>
|
|||
* Updates the state of this handler based on the given <mxMouseEvent>.
|
||||
* Source is a boolean indicating if the cell is a source or target.
|
||||
*/
|
||||
update = (me, source, existingEdge, point)=>
|
||||
{
|
||||
if (this.isEnabled() && !this.isEventIgnored(me))
|
||||
{
|
||||
update = (me, source, existingEdge, point) => {
|
||||
if (this.isEnabled() && !this.isEventIgnored(me)) {
|
||||
// Lazy installation of mouseleave handler
|
||||
if (this.mouseleaveHandler == null && this.graph.container != null)
|
||||
{
|
||||
this.mouseleaveHandler = mxUtils.bind(this, ()=>
|
||||
{
|
||||
if (this.mouseleaveHandler == null && this.graph.container != null) {
|
||||
this.mouseleaveHandler = mxUtils.bind(this, () => {
|
||||
this.reset();
|
||||
});
|
||||
|
||||
|
@ -278,8 +251,7 @@ update = (me, source, existingEdge, point)=>
|
|||
// Keeps focus icons visible while over vertex bounds and no other cell under mouse or shift is pressed
|
||||
if (!this.isKeepFocusEvent(me) && (this.currentFocusArea == null || this.currentFocus == null ||
|
||||
(state != null) || !this.graph.getModel().isVertex(this.currentFocus.cell) ||
|
||||
!mxUtils.intersects(this.currentFocusArea, mouse)) && (state != this.currentFocus))
|
||||
{
|
||||
!mxUtils.intersects(this.currentFocusArea, mouse)) && (state != this.currentFocus)) {
|
||||
this.currentFocusArea = null;
|
||||
this.currentFocus = null;
|
||||
this.setFocus(me, state, source);
|
||||
|
@ -290,21 +262,18 @@ update = (me, source, existingEdge, point)=>
|
|||
var minDistSq = null;
|
||||
|
||||
if (this.focusIcons != null && this.constraints != null &&
|
||||
(state == null || this.currentFocus == state))
|
||||
{
|
||||
(state == null || this.currentFocus == state)) {
|
||||
var cx = mouse.getCenterX();
|
||||
var cy = mouse.getCenterY();
|
||||
|
||||
for (var i = 0; i < this.focusIcons.length; i++)
|
||||
{
|
||||
for (var i = 0; i < this.focusIcons.length; i++) {
|
||||
var dx = cx - this.focusIcons[i].bounds.getCenterX();
|
||||
var dy = cy - this.focusIcons[i].bounds.getCenterY();
|
||||
var tmp = dx * dx + dy * dy;
|
||||
|
||||
if ((this.intersects(this.focusIcons[i], mouse, source, existingEdge) || (point != null &&
|
||||
this.intersects(this.focusIcons[i], grid, source, existingEdge))) &&
|
||||
(minDistSq == null || tmp < minDistSq))
|
||||
{
|
||||
(minDistSq == null || tmp < minDistSq)) {
|
||||
this.currentConstraint = this.constraints[i];
|
||||
this.currentPoint = this.focusPoints[i];
|
||||
minDistSq = tmp;
|
||||
|
@ -314,8 +283,7 @@ update = (me, source, existingEdge, point)=>
|
|||
tmp.width -= 1;
|
||||
tmp.height -= 1;
|
||||
|
||||
if (this.focusHighlight == null)
|
||||
{
|
||||
if (this.focusHighlight == null) {
|
||||
var hl = this.createHighlightShape();
|
||||
hl.dialect = (this.graph.dialect == mxConstants.DIALECT_SVG) ?
|
||||
mxConstants.DIALECT_SVG : mxConstants.DIALECT_VML;
|
||||
|
@ -324,8 +292,7 @@ update = (me, source, existingEdge, point)=>
|
|||
hl.init(this.graph.getView().getOverlayPane());
|
||||
this.focusHighlight = hl;
|
||||
|
||||
var getState = mxUtils.bind(this, ()=>
|
||||
{
|
||||
var getState = mxUtils.bind(this, () => {
|
||||
return (this.currentFocus != null) ? this.currentFocus : state;
|
||||
});
|
||||
|
||||
|
@ -338,13 +305,10 @@ update = (me, source, existingEdge, point)=>
|
|||
}
|
||||
}
|
||||
|
||||
if (this.currentConstraint == null)
|
||||
{
|
||||
if (this.currentConstraint == null) {
|
||||
this.destroyFocusHighlight();
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
this.currentConstraint = null;
|
||||
this.currentFocus = null;
|
||||
this.currentPoint = null;
|
||||
|
@ -358,16 +322,13 @@ update = (me, source, existingEdge, point)=>
|
|||
* the handler is not enabled then the outline is painted, but the constraints
|
||||
* are ignored.
|
||||
*/
|
||||
redraw = ()=>
|
||||
{
|
||||
if (this.currentFocus != null && this.constraints != null && this.focusIcons != null)
|
||||
{
|
||||
redraw = () => {
|
||||
if (this.currentFocus != null && this.constraints != null && this.focusIcons != null) {
|
||||
var state = this.graph.view.getState(this.currentFocus.cell);
|
||||
this.currentFocus = state;
|
||||
this.currentFocusArea = new mxRectangle(state.x, state.y, state.width, state.height);
|
||||
|
||||
for (var i = 0; i < this.constraints.length; i++)
|
||||
{
|
||||
for (var i = 0; i < this.constraints.length; i++) {
|
||||
var cp = this.graph.getConnectionPoint(state, this.constraints[i]);
|
||||
var img = this.getImageForConstraint(state, this.constraints[i], cp);
|
||||
|
||||
|
@ -388,22 +349,18 @@ redraw = ()=>
|
|||
* 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) &&
|
||||
this.graph.isCellConnectable(state.cell)) ? ((this.isEnabled()) ?
|
||||
(this.graph.getAllConnectionConstraints(state, source) || []) : []) : null;
|
||||
|
||||
// Only uses cells which have constraints
|
||||
if (this.constraints != null)
|
||||
{
|
||||
if (this.constraints != null) {
|
||||
this.currentFocus = state;
|
||||
this.currentFocusArea = new mxRectangle(state.x, state.y, state.width, state.height);
|
||||
|
||||
if (this.focusIcons != null)
|
||||
{
|
||||
for (var i = 0; i < this.focusIcons.length; i++)
|
||||
{
|
||||
if (this.focusIcons != null) {
|
||||
for (var i = 0; i < this.focusIcons.length; i++) {
|
||||
this.focusIcons[i].destroy();
|
||||
}
|
||||
|
||||
|
@ -414,8 +371,7 @@ setFocus = (me, state, source)=>
|
|||
this.focusPoints = [];
|
||||
this.focusIcons = [];
|
||||
|
||||
for (var i = 0; i < this.constraints.length; i++)
|
||||
{
|
||||
for (var i = 0; i < this.constraints.length; i++) {
|
||||
var cp = this.graph.getConnectionPoint(state, this.constraints[i]);
|
||||
var img = this.getImageForConstraint(state, this.constraints[i], cp);
|
||||
|
||||
|
@ -429,13 +385,11 @@ setFocus = (me, state, source)=>
|
|||
icon.init(this.graph.getView().getDecoratorPane());
|
||||
|
||||
// Move the icon behind all other overlays
|
||||
if (icon.node.previousSibling != null)
|
||||
{
|
||||
if (icon.node.previousSibling != null) {
|
||||
icon.node.parentNode.insertBefore(icon.node, icon.node.parentNode.firstChild);
|
||||
}
|
||||
|
||||
var getState = mxUtils.bind(this, ()=>
|
||||
{
|
||||
var getState = mxUtils.bind(this, () => {
|
||||
return (this.currentFocus != null) ? this.currentFocus : state;
|
||||
});
|
||||
|
||||
|
@ -448,9 +402,7 @@ setFocus = (me, state, source)=>
|
|||
}
|
||||
|
||||
this.currentFocusArea.grow(this.getTolerance(me));
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
this.destroyIcons();
|
||||
this.destroyFocusHighlight();
|
||||
}
|
||||
|
@ -463,8 +415,7 @@ setFocus = (me, state, source)=>
|
|||
*
|
||||
* Returns true if the given icon intersects the given point.
|
||||
*/
|
||||
createHighlightShape = ()=>
|
||||
{
|
||||
createHighlightShape = () => {
|
||||
var hl = new mxRectangleShape(null, this.highlightColor, this.highlightColor, mxConstants.HIGHLIGHT_STROKEWIDTH);
|
||||
hl.opacity = mxConstants.HIGHLIGHT_OPACITY;
|
||||
|
||||
|
@ -476,8 +427,7 @@ createHighlightShape = ()=>
|
|||
*
|
||||
* 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);
|
||||
};
|
||||
|
||||
|
@ -486,21 +436,21 @@ intersects = (icon, mouse, source, existingEdge)=>
|
|||
*
|
||||
* Destroy this handler.
|
||||
*/
|
||||
destroy = ()=>
|
||||
{
|
||||
destroy = () => {
|
||||
this.reset();
|
||||
|
||||
if (this.resetHandler != null)
|
||||
{
|
||||
if (this.resetHandler != null) {
|
||||
this.graph.model.removeListener(this.resetHandler);
|
||||
this.graph.view.removeListener(this.resetHandler);
|
||||
this.graph.removeListener(this.resetHandler);
|
||||
this.resetHandler = null;
|
||||
}
|
||||
|
||||
if (this.mouseleaveHandler != null && this.graph.container != null)
|
||||
{
|
||||
if (this.mouseleaveHandler != null && this.graph.container != null) {
|
||||
mxEvent.removeListener(this.graph.container, 'mouseleave', this.mouseleaveHandler);
|
||||
this.mouseleaveHandler = null;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxConstraintHandler;
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -2,34 +2,28 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
function mxEdgeSegmentHandler(state)
|
||||
{
|
||||
mxEdgeHandler.call(this, state);
|
||||
};
|
||||
|
||||
/**
|
||||
* Extends mxEdgeHandler.
|
||||
*/
|
||||
mxUtils.extend(mxEdgeSegmentHandler, mxElbowEdgeHandler);
|
||||
class mxEdgeSegmentHandler extends mxElbowEdgeHandler {
|
||||
constructor(state) {
|
||||
// WARNING: should be super of mxEdgeHandler!
|
||||
super(state);
|
||||
};
|
||||
|
||||
/**
|
||||
* Function: getCurrentPoints
|
||||
*
|
||||
* Returns the current absolute points.
|
||||
*/
|
||||
getCurrentPoints = ()=>
|
||||
{
|
||||
getCurrentPoints = () => {
|
||||
var pts = this.state.absolutePoints;
|
||||
|
||||
if (pts != null)
|
||||
{
|
||||
if (pts != null) {
|
||||
// Special case for straight edges where we add a virtual middle handle for moving the edge
|
||||
var tol = Math.max(1, this.graph.view.scale);
|
||||
|
||||
if (pts.length == 2 || (pts.length == 3 &&
|
||||
(Math.abs(pts[0].x - pts[1].x) < tol && Math.abs(pts[1].x - pts[2].x) < tol ||
|
||||
Math.abs(pts[0].y - pts[1].y) < tol && Math.abs(pts[1].y - pts[2].y) < tol)))
|
||||
{
|
||||
Math.abs(pts[0].y - pts[1].y) < tol && Math.abs(pts[1].y - pts[2].y) < tol))) {
|
||||
var cx = pts[0].x + (pts[pts.length - 1].x - pts[0].x) / 2;
|
||||
var cy = pts[0].y + (pts[pts.length - 1].y - pts[0].y) / 2;
|
||||
|
||||
|
@ -45,40 +39,31 @@ getCurrentPoints = ()=>
|
|||
*
|
||||
* Updates the given preview state taking into account the state of the constraint handler.
|
||||
*/
|
||||
getPreviewPoints = (point)=>
|
||||
{
|
||||
if (this.isSource || this.isTarget)
|
||||
{
|
||||
getPreviewPoints = (point) => {
|
||||
if (this.isSource || this.isTarget) {
|
||||
return getPreviewPoints.apply(this, arguments);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
var pts = this.getCurrentPoints();
|
||||
var last = this.convertPoint(pts[0].clone(), false);
|
||||
point = this.convertPoint(point.clone(), false);
|
||||
var result = [];
|
||||
|
||||
for (var i = 1; i < pts.length; i++)
|
||||
{
|
||||
for (var i = 1; i < pts.length; i++) {
|
||||
var pt = this.convertPoint(pts[i].clone(), false);
|
||||
|
||||
if (i == this.index)
|
||||
{
|
||||
if (Math.round(last.x - pt.x) == 0)
|
||||
{
|
||||
if (i == this.index) {
|
||||
if (Math.round(last.x - pt.x) == 0) {
|
||||
last.x = point.x;
|
||||
pt.x = point.x;
|
||||
}
|
||||
|
||||
if (Math.round(last.y - pt.y) == 0)
|
||||
{
|
||||
if (Math.round(last.y - pt.y) == 0) {
|
||||
last.y = point.y;
|
||||
pt.y = point.y;
|
||||
}
|
||||
}
|
||||
|
||||
if (i < pts.length - 1)
|
||||
{
|
||||
if (i < pts.length - 1) {
|
||||
result.push(pt);
|
||||
}
|
||||
|
||||
|
@ -86,8 +71,7 @@ getPreviewPoints = (point)=>
|
|||
}
|
||||
|
||||
// Replaces single point that intersects with source or target
|
||||
if (result.length == 1)
|
||||
{
|
||||
if (result.length == 1) {
|
||||
var source = this.state.getVisibleTerminalState(true);
|
||||
var target = this.state.getVisibleTerminalState(false);
|
||||
var scale = this.state.view.getScale();
|
||||
|
@ -97,8 +81,7 @@ getPreviewPoints = (point)=>
|
|||
var y = result[0].y * scale + tr.y;
|
||||
|
||||
if ((source != null && mxUtils.contains(source, x, y)) ||
|
||||
(target != null && mxUtils.contains(target, x, y)))
|
||||
{
|
||||
(target != null && mxUtils.contains(target, x, y))) {
|
||||
result = [point, point];
|
||||
}
|
||||
}
|
||||
|
@ -112,13 +95,11 @@ getPreviewPoints = (point)=>
|
|||
*
|
||||
* Overridden to perform optimization of the edge style result.
|
||||
*/
|
||||
updatePreviewState = (edge, point, terminalState, me)=>
|
||||
{
|
||||
updatePreviewState = (edge, point, terminalState, me) => {
|
||||
updatePreviewState.apply(this, arguments);
|
||||
|
||||
// Checks and corrects preview by running edge style again
|
||||
if (!this.isSource && !this.isTarget)
|
||||
{
|
||||
if (!this.isSource && !this.isTarget) {
|
||||
point = this.convertPoint(point.clone(), false);
|
||||
var pts = edge.absolutePoints;
|
||||
var pt0 = pts[0];
|
||||
|
@ -126,14 +107,12 @@ updatePreviewState = (edge, point, terminalState, me)=>
|
|||
|
||||
var result = [];
|
||||
|
||||
for (var i = 2; i < pts.length; i++)
|
||||
{
|
||||
for (var i = 2; i < pts.length; i++) {
|
||||
var pt2 = pts[i];
|
||||
|
||||
// Merges adjacent segments only if more than 2 to allow for straight edges
|
||||
if ((Math.round(pt0.x - pt1.x) != 0 || Math.round(pt1.x - pt2.x) != 0) &&
|
||||
(Math.round(pt0.y - pt1.y) != 0 || Math.round(pt1.y - pt2.y) != 0))
|
||||
{
|
||||
(Math.round(pt0.y - pt1.y) != 0 || Math.round(pt1.y - pt2.y) != 0)) {
|
||||
result.push(this.convertPoint(pt1.clone(), false));
|
||||
}
|
||||
|
||||
|
@ -147,14 +126,12 @@ updatePreviewState = (edge, point, terminalState, me)=>
|
|||
|
||||
// A straight line is represented by 3 handles
|
||||
if (result.length == 0 && (Math.round(pts[0].x - pts[pts.length - 1].x) == 0 ||
|
||||
Math.round(pts[0].y - pts[pts.length - 1].y) == 0))
|
||||
{
|
||||
Math.round(pts[0].y - pts[pts.length - 1].y) == 0)) {
|
||||
result = [point, point];
|
||||
}
|
||||
// Handles special case of transitions from straight vertical to routed
|
||||
else if (pts.length == 5 && result.length == 2 && source != null && target != null &&
|
||||
rpts != null && Math.round(rpts[0].x - rpts[rpts.length - 1].x) == 0)
|
||||
{
|
||||
rpts != null && Math.round(rpts[0].x - rpts[rpts.length - 1].x) == 0) {
|
||||
var view = this.graph.getView();
|
||||
var scale = view.getScale();
|
||||
var tr = view.getTranslate();
|
||||
|
@ -164,12 +141,10 @@ updatePreviewState = (edge, point, terminalState, me)=>
|
|||
// Use fixed connection point y-coordinate if one exists
|
||||
var sc = this.graph.getConnectionConstraint(edge, source, true);
|
||||
|
||||
if (sc != null)
|
||||
{
|
||||
if (sc != null) {
|
||||
var pt = this.graph.getConnectionPoint(source, sc);
|
||||
|
||||
if (pt != null)
|
||||
{
|
||||
if (pt != null) {
|
||||
this.convertPoint(pt, false);
|
||||
y0 = pt.y;
|
||||
}
|
||||
|
@ -180,12 +155,10 @@ updatePreviewState = (edge, point, terminalState, me)=>
|
|||
// Use fixed connection point y-coordinate if one exists
|
||||
var tc = this.graph.getConnectionConstraint(edge, target, false);
|
||||
|
||||
if (tc)
|
||||
{
|
||||
if (tc) {
|
||||
var pt = this.graph.getConnectionPoint(target, tc);
|
||||
|
||||
if (pt != null)
|
||||
{
|
||||
if (pt != null) {
|
||||
this.convertPoint(pt, false);
|
||||
ye = pt.y;
|
||||
}
|
||||
|
@ -206,28 +179,24 @@ updatePreviewState = (edge, point, terminalState, me)=>
|
|||
/**
|
||||
* Overriden to merge edge segments.
|
||||
*/
|
||||
connect = (edge, terminal, isSource, isClone, me)=>
|
||||
{
|
||||
connect = (edge, terminal, isSource, isClone, me) => {
|
||||
var model = this.graph.getModel();
|
||||
var geo = model.getGeometry(edge);
|
||||
var result = null;
|
||||
|
||||
// Merges adjacent edge segments
|
||||
if (geo != null && geo.points != null && geo.points.length > 0)
|
||||
{
|
||||
if (geo != null && geo.points != null && geo.points.length > 0) {
|
||||
var pts = this.abspoints;
|
||||
var pt0 = pts[0];
|
||||
var pt1 = pts[1];
|
||||
result = [];
|
||||
|
||||
for (var i = 2; i < pts.length; i++)
|
||||
{
|
||||
for (var i = 2; i < pts.length; i++) {
|
||||
var pt2 = pts[i];
|
||||
|
||||
// Merges adjacent segments only if more than 2 to allow for straight edges
|
||||
if ((Math.round(pt0.x - pt1.x) != 0 || Math.round(pt1.x - pt2.x) != 0) &&
|
||||
(Math.round(pt0.y - pt1.y) != 0 || Math.round(pt1.y - pt2.y) != 0))
|
||||
{
|
||||
(Math.round(pt0.y - pt1.y) != 0 || Math.round(pt1.y - pt2.y) != 0)) {
|
||||
result.push(this.convertPoint(pt1.clone(), false));
|
||||
}
|
||||
|
||||
|
@ -237,14 +206,11 @@ connect = (edge, terminal, isSource, isClone, me)=>
|
|||
}
|
||||
|
||||
model.beginUpdate();
|
||||
try
|
||||
{
|
||||
if (result != null)
|
||||
{
|
||||
try {
|
||||
if (result != null) {
|
||||
var geo = model.getGeometry(edge);
|
||||
|
||||
if (geo != null)
|
||||
{
|
||||
if (geo != null) {
|
||||
geo = geo.clone();
|
||||
geo.points = result;
|
||||
|
||||
|
@ -253,9 +219,7 @@ connect = (edge, terminal, isSource, isClone, me)=>
|
|||
}
|
||||
|
||||
edge = connect.apply(this, arguments);
|
||||
}
|
||||
finally
|
||||
{
|
||||
} finally {
|
||||
model.endUpdate();
|
||||
}
|
||||
|
||||
|
@ -267,8 +231,7 @@ connect = (edge, terminal, isSource, isClone, me)=>
|
|||
*
|
||||
* Returns no tooltips.
|
||||
*/
|
||||
getTooltipForNode = (node)=>
|
||||
{
|
||||
getTooltipForNode = (node) => {
|
||||
return null;
|
||||
};
|
||||
|
||||
|
@ -277,13 +240,11 @@ getTooltipForNode = (node)=>
|
|||
*
|
||||
* Starts the handling of the mouse gesture.
|
||||
*/
|
||||
start = (x, y, index)=>
|
||||
{
|
||||
start = (x, y, index) => {
|
||||
start.apply(this, arguments);
|
||||
|
||||
if (this.bends != null && this.bends[index] != null &&
|
||||
!this.isSource && !this.isTarget)
|
||||
{
|
||||
!this.isSource && !this.isTarget) {
|
||||
mxUtils.setOpacity(this.bends[index].node, 100);
|
||||
}
|
||||
};
|
||||
|
@ -293,8 +254,7 @@ start = (x, y, index)=>
|
|||
*
|
||||
* Adds custom bends for the center of each segment.
|
||||
*/
|
||||
createBends = ()=>
|
||||
{
|
||||
createBends = () => {
|
||||
var bends = [];
|
||||
|
||||
// Source
|
||||
|
@ -306,22 +266,18 @@ createBends = ()=>
|
|||
var pts = this.getCurrentPoints();
|
||||
|
||||
// Waypoints (segment handles)
|
||||
if (this.graph.isCellBendable(this.state.cell))
|
||||
{
|
||||
if (this.points == null)
|
||||
{
|
||||
if (this.graph.isCellBendable(this.state.cell)) {
|
||||
if (this.points == null) {
|
||||
this.points = [];
|
||||
}
|
||||
|
||||
for (var i = 0; i < pts.length - 1; i++)
|
||||
{
|
||||
for (var i = 0; i < pts.length - 1; i++) {
|
||||
bend = this.createVirtualBend();
|
||||
bends.push(bend);
|
||||
var horizontal = Math.round(pts[i].x - pts[i + 1].x) == 0;
|
||||
|
||||
// Special case where dy is 0 as well
|
||||
if (Math.round(pts[i].y - pts[i + 1].y) == 0 && i < pts.length - 2)
|
||||
{
|
||||
if (Math.round(pts[i].y - pts[i + 1].y) == 0 && i < pts.length - 2) {
|
||||
horizontal = Math.round(pts[i].x - pts[i + 2].x) == 0;
|
||||
}
|
||||
|
||||
|
@ -344,8 +300,7 @@ createBends = ()=>
|
|||
*
|
||||
* Overridden to invoke <refresh> before the redraw.
|
||||
*/
|
||||
redraw = ()=>
|
||||
{
|
||||
redraw = () => {
|
||||
this.refresh();
|
||||
redraw.apply(this, arguments);
|
||||
};
|
||||
|
@ -355,39 +310,30 @@ redraw = ()=>
|
|||
*
|
||||
* Updates the position of the custom bends.
|
||||
*/
|
||||
redrawInnerBends = (p0, pe)=>
|
||||
{
|
||||
if (this.graph.isCellBendable(this.state.cell))
|
||||
{
|
||||
redrawInnerBends = (p0, pe) => {
|
||||
if (this.graph.isCellBendable(this.state.cell)) {
|
||||
var pts = this.getCurrentPoints();
|
||||
|
||||
if (pts != null && pts.length > 1)
|
||||
{
|
||||
if (pts != null && pts.length > 1) {
|
||||
var straight = false;
|
||||
|
||||
// Puts handle in the center of straight edges
|
||||
if (pts.length == 4 && Math.round(pts[1].x - pts[2].x) == 0 && Math.round(pts[1].y - pts[2].y) == 0)
|
||||
{
|
||||
if (pts.length == 4 && Math.round(pts[1].x - pts[2].x) == 0 && Math.round(pts[1].y - pts[2].y) == 0) {
|
||||
straight = true;
|
||||
|
||||
if (Math.round(pts[0].y - pts[pts.length - 1].y) == 0)
|
||||
{
|
||||
if (Math.round(pts[0].y - pts[pts.length - 1].y) == 0) {
|
||||
var cx = pts[0].x + (pts[pts.length - 1].x - pts[0].x) / 2;
|
||||
pts[1] = new mxPoint(cx, pts[1].y);
|
||||
pts[2] = new mxPoint(cx, pts[2].y);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
var cy = pts[0].y + (pts[pts.length - 1].y - pts[0].y) / 2;
|
||||
pts[1] = new mxPoint(pts[1].x, cy);
|
||||
pts[2] = new mxPoint(pts[2].x, cy);
|
||||
}
|
||||
}
|
||||
|
||||
for (var i = 0; i < pts.length - 1; i++)
|
||||
{
|
||||
if (this.bends[i + 1] != null)
|
||||
{
|
||||
for (var i = 0; i < pts.length - 1; i++) {
|
||||
if (this.bends[i + 1] != null) {
|
||||
var p0 = pts[i];
|
||||
var pe = pts[i + 1];
|
||||
var pt = new mxPoint(p0.x + (pe.x - p0.x) / 2, p0.y + (pe.y - p0.y) / 2);
|
||||
|
@ -396,18 +342,19 @@ redrawInnerBends = (p0, pe)=>
|
|||
Math.floor(pt.y - b.height / 2), b.width, b.height);
|
||||
this.bends[i + 1].redraw();
|
||||
|
||||
if (this.manageLabelHandle)
|
||||
{
|
||||
if (this.manageLabelHandle) {
|
||||
this.checkLabelHandle(this.bends[i + 1].bounds);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (straight)
|
||||
{
|
||||
if (straight) {
|
||||
mxUtils.setOpacity(this.bends[1].node, this.virtualBendOpacity);
|
||||
mxUtils.setOpacity(this.bends[3].node, this.virtualBendOpacity);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxEdgeSegmentHandler;
|
||||
|
|
|
@ -2,6 +2,24 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
class mxElbowEdgeHandler extends mxEdgeHandler {
|
||||
/**
|
||||
* Specifies if a double click on the middle handle should call
|
||||
* <mxGraph.flipEdge>. Default is true.
|
||||
*/
|
||||
flipEnabled = true;
|
||||
|
||||
/**
|
||||
* Variable: doubleClickOrientationResource
|
||||
*
|
||||
* Specifies the resource key for the tooltip to be displayed on the single
|
||||
* control point for routed edges. If the resource for this key does not
|
||||
* exist then the value is used as the error message. Default is
|
||||
* 'doubleClickOrientation'.
|
||||
*/
|
||||
doubleClickOrientationResource = (mxClient.language !== 'none') ? 'doubleClickOrientation' : '';
|
||||
|
||||
/**
|
||||
* Class: mxElbowEdgeHandler
|
||||
*
|
||||
|
@ -18,40 +36,16 @@
|
|||
*
|
||||
* state - <mxCellState> of the cell to be modified.
|
||||
*/
|
||||
function mxElbowEdgeHandler(state)
|
||||
{
|
||||
mxEdgeHandler.call(this, state);
|
||||
constructor(state) {
|
||||
super(state);
|
||||
};
|
||||
|
||||
/**
|
||||
* Extends mxEdgeHandler.
|
||||
*/
|
||||
mxUtils.extend(mxElbowEdgeHandler, mxEdgeHandler);
|
||||
|
||||
/**
|
||||
* Specifies if a double click on the middle handle should call
|
||||
* <mxGraph.flipEdge>. Default is true.
|
||||
*/
|
||||
flipEnabled = true;
|
||||
|
||||
/**
|
||||
* Variable: doubleClickOrientationResource
|
||||
*
|
||||
* Specifies the resource key for the tooltip to be displayed on the single
|
||||
* control point for routed edges. If the resource for this key does not
|
||||
* exist then the value is used as the error message. Default is
|
||||
* 'doubleClickOrientation'.
|
||||
*/
|
||||
doubleClickOrientationResource =
|
||||
(mxClient.language != 'none') ? 'doubleClickOrientation' : '';
|
||||
|
||||
/**
|
||||
* Function: createBends
|
||||
*
|
||||
* Overrides <mxEdgeHandler.createBends> to create custom bends.
|
||||
*/
|
||||
createBends = ()=>
|
||||
{
|
||||
createBends = () => {
|
||||
var bends = [];
|
||||
|
||||
// Source
|
||||
|
@ -61,10 +55,8 @@ doubleClickOrientationResource =
|
|||
bends.push(bend);
|
||||
|
||||
// Virtual
|
||||
bends.push(this.createVirtualBend(mxUtils.bind(this, (evt)=>
|
||||
{
|
||||
if (!mxEvent.isConsumed(evt) && this.flipEnabled)
|
||||
{
|
||||
bends.push(this.createVirtualBend(mxUtils.bind(this, (evt) => {
|
||||
if (!mxEvent.isConsumed(evt) && this.flipEnabled) {
|
||||
this.graph.flipEdge(this.state.cell, evt);
|
||||
mxEvent.consume(evt);
|
||||
}
|
||||
|
@ -87,15 +79,13 @@ doubleClickOrientationResource =
|
|||
* Creates a virtual bend that supports double clicking and calls
|
||||
* <mxGraph.flipEdge>.
|
||||
*/
|
||||
createVirtualBend = (dblClickHandler)=>
|
||||
{
|
||||
createVirtualBend = (dblClickHandler) => {
|
||||
var bend = this.createHandleShape();
|
||||
this.initBend(bend, dblClickHandler);
|
||||
|
||||
bend.setCursor(this.getCursorForBend());
|
||||
|
||||
if (!this.graph.isCellBendable(this.state.cell))
|
||||
{
|
||||
if (!this.graph.isCellBendable(this.state.cell)) {
|
||||
bend.node.style.display = 'none';
|
||||
}
|
||||
|
||||
|
@ -107,13 +97,12 @@ createVirtualBend = (dblClickHandler)=>
|
|||
*
|
||||
* Returns the cursor to be used for the bend.
|
||||
*/
|
||||
getCursorForBend = ()=>
|
||||
{
|
||||
return (this.state.style[mxConstants.STYLE_EDGE] == mxEdgeStyle.TopToBottom ||
|
||||
this.state.style[mxConstants.STYLE_EDGE] == mxConstants.EDGESTYLE_TOPTOBOTTOM ||
|
||||
((this.state.style[mxConstants.STYLE_EDGE] == mxEdgeStyle.ElbowConnector ||
|
||||
this.state.style[mxConstants.STYLE_EDGE] == mxConstants.EDGESTYLE_ELBOW)&&
|
||||
this.state.style[mxConstants.STYLE_ELBOW] == mxConstants.ELBOW_VERTICAL)) ?
|
||||
getCursorForBend = () => {
|
||||
return (this.state.style[mxConstants.STYLE_EDGE] === mxEdgeStyle.TopToBottom ||
|
||||
this.state.style[mxConstants.STYLE_EDGE] === mxConstants.EDGESTYLE_TOPTOBOTTOM ||
|
||||
((this.state.style[mxConstants.STYLE_EDGE] === mxEdgeStyle.ElbowConnector ||
|
||||
this.state.style[mxConstants.STYLE_EDGE] === mxConstants.EDGESTYLE_ELBOW) &&
|
||||
this.state.style[mxConstants.STYLE_ELBOW] === mxConstants.ELBOW_VERTICAL)) ?
|
||||
'row-resize' : 'col-resize';
|
||||
};
|
||||
|
||||
|
@ -122,13 +111,11 @@ getCursorForBend = ()=>
|
|||
*
|
||||
* Returns the tooltip for the given node.
|
||||
*/
|
||||
getTooltipForNode = (node)=>
|
||||
{
|
||||
getTooltipForNode = (node) => {
|
||||
var tip = null;
|
||||
|
||||
if (this.bends != null && this.bends[1] != null && (node == this.bends[1].node ||
|
||||
node.parentNode == this.bends[1].node))
|
||||
{
|
||||
if (this.bends != null && this.bends[1] != null && (node === this.bends[1].node ||
|
||||
node.parentNode === this.bends[1].node)) {
|
||||
tip = this.doubleClickOrientationResource;
|
||||
tip = mxResources.get(tip) || tip; // translate
|
||||
}
|
||||
|
@ -147,14 +134,12 @@ getTooltipForNode = (node)=>
|
|||
* point - <mxPoint> to be converted.
|
||||
* gridEnabled - Boolean that specifies if the grid should be applied.
|
||||
*/
|
||||
convertPoint = (point, gridEnabled)=>
|
||||
{
|
||||
convertPoint = (point, gridEnabled) => {
|
||||
var scale = this.graph.getView().getScale();
|
||||
var tr = this.graph.getView().getTranslate();
|
||||
var origin = this.state.origin;
|
||||
|
||||
if (gridEnabled)
|
||||
{
|
||||
if (gridEnabled) {
|
||||
point.x = this.graph.snap(point.x);
|
||||
point.y = this.graph.snap(point.y);
|
||||
}
|
||||
|
@ -175,29 +160,22 @@ convertPoint = (point, gridEnabled)=>
|
|||
* p0 - <mxPoint> that represents the location of the first point.
|
||||
* pe - <mxPoint> that represents the location of the last point.
|
||||
*/
|
||||
redrawInnerBends = (p0, pe)=>
|
||||
{
|
||||
redrawInnerBends = (p0, pe) => {
|
||||
var g = this.graph.getModel().getGeometry(this.state.cell);
|
||||
var pts = this.state.absolutePoints;
|
||||
var pt = null;
|
||||
|
||||
// Keeps the virtual bend on the edge shape
|
||||
if (pts.length > 1)
|
||||
{
|
||||
if (pts.length > 1) {
|
||||
p0 = pts[1];
|
||||
pe = pts[pts.length - 2];
|
||||
}
|
||||
else if (g.points != null && g.points.length > 0)
|
||||
{
|
||||
} else if (g.points != null && g.points.length > 0) {
|
||||
pt = pts[0];
|
||||
}
|
||||
|
||||
if (pt == null)
|
||||
{
|
||||
if (pt == null) {
|
||||
pt = new mxPoint(p0.x + (pe.x - p0.x) / 2, p0.y + (pe.y - p0.y) / 2);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
pt = new mxPoint(this.graph.getView().scale * (pt.x + this.graph.getView().translate.x + this.state.origin.x),
|
||||
this.graph.getView().scale * (pt.y + this.graph.getView().translate.y + this.state.origin.y));
|
||||
}
|
||||
|
@ -209,12 +187,9 @@ redrawInnerBends = (p0, pe)=>
|
|||
var h = b.height;
|
||||
var bounds = new mxRectangle(Math.round(pt.x - w / 2), Math.round(pt.y - h / 2), w, h);
|
||||
|
||||
if (this.manageLabelHandle)
|
||||
{
|
||||
if (this.manageLabelHandle) {
|
||||
this.checkLabelHandle(bounds);
|
||||
}
|
||||
else if (this.handleImage == null && this.labelShape.visible && mxUtils.intersects(bounds, this.labelShape.bounds))
|
||||
{
|
||||
} else if (this.handleImage == null && this.labelShape.visible && mxUtils.intersects(bounds, this.labelShape.bounds)) {
|
||||
w = mxConstants.HANDLE_SIZE + 3;
|
||||
h = mxConstants.HANDLE_SIZE + 3;
|
||||
bounds = new mxRectangle(Math.floor(pt.x - w / 2), Math.floor(pt.y - h / 2), w, h);
|
||||
|
@ -223,8 +198,10 @@ redrawInnerBends = (p0, pe)=>
|
|||
this.bends[1].bounds = bounds;
|
||||
this.bends[1].redraw();
|
||||
|
||||
if (this.manageLabelHandle)
|
||||
{
|
||||
if (this.manageLabelHandle) {
|
||||
this.checkLabelHandle(this.bends[1].bounds);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxElbowEdgeHandler;
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -2,29 +2,8 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
/**
|
||||
* Class: mxHandle
|
||||
*
|
||||
* Implements a single custom handle for vertices.
|
||||
*
|
||||
* Constructor: mxHandle
|
||||
*
|
||||
* Constructs a new handle for the given state.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* state - <mxCellState> of the cell to be handled.
|
||||
*/
|
||||
function mxHandle(state, cursor, image, shape)
|
||||
{
|
||||
this.graph = state.view.graph;
|
||||
this.state = state;
|
||||
this.cursor = (cursor != null) ? cursor : this.cursor;
|
||||
this.image = (image != null) ? image : this.image;
|
||||
this.shape = (shape != null) ? shape : null;
|
||||
this.init();
|
||||
};
|
||||
|
||||
class mxHandle {
|
||||
/**
|
||||
* Variable: cursor
|
||||
*
|
||||
|
@ -46,34 +25,58 @@ image = null;
|
|||
*/
|
||||
ignoreGrid = false;
|
||||
|
||||
/**
|
||||
* Class: mxHandle
|
||||
*
|
||||
* Implements a single custom handle for vertices.
|
||||
*
|
||||
* Constructor: mxHandle
|
||||
*
|
||||
* Constructs a new handle for the given state.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* state - <mxCellState> of the cell to be handled.
|
||||
*/
|
||||
constructor(state, cursor, image, shape) {
|
||||
this.graph = state.view.graph;
|
||||
this.state = state;
|
||||
this.cursor = (cursor != null) ? cursor : this.cursor;
|
||||
this.image = (image != null) ? image : this.image;
|
||||
this.shape = (shape != null) ? shape : null;
|
||||
this.init();
|
||||
};
|
||||
|
||||
/**
|
||||
* Function: getPosition
|
||||
*
|
||||
* 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 <state>.
|
||||
*/
|
||||
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 <state>.
|
||||
*/
|
||||
copyStyle = (key)=>
|
||||
{
|
||||
copyStyle = (key) => {
|
||||
this.graph.setCellStyles(key, this.state.style[key], [this.state.cell]);
|
||||
};
|
||||
|
||||
|
@ -82,15 +85,13 @@ copyStyle = (key)=>
|
|||
*
|
||||
* Processes the given <mxMouseEvent> and invokes <setPosition>.
|
||||
*/
|
||||
processEvent = (me)=>
|
||||
{
|
||||
processEvent = (me) => {
|
||||
var scale = this.graph.view.scale;
|
||||
var tr = this.graph.view.translate;
|
||||
var pt = new mxPoint(me.getGraphX() / scale - tr.x, me.getGraphY() / scale - tr.y);
|
||||
|
||||
// Center shape on mouse cursor
|
||||
if (this.shape != null && this.shape.bounds != null)
|
||||
{
|
||||
if (this.shape != null && this.shape.bounds != null) {
|
||||
pt.x -= this.shape.bounds.width / scale / 4;
|
||||
pt.y -= this.shape.bounds.height / scale / 4;
|
||||
}
|
||||
|
@ -110,15 +111,12 @@ processEvent = (me)=>
|
|||
* Should be called after <setPosition> in <processEvent>.
|
||||
* This repaints the state using <mxCellRenderer>.
|
||||
*/
|
||||
positionChanged = ()=>
|
||||
{
|
||||
if (this.state.text != null)
|
||||
{
|
||||
positionChanged = () => {
|
||||
if (this.state.text != null) {
|
||||
this.state.text.apply(this.state);
|
||||
}
|
||||
|
||||
if (this.state.shape != null)
|
||||
{
|
||||
if (this.state.shape != null) {
|
||||
this.state.shape.apply(this.state);
|
||||
}
|
||||
|
||||
|
@ -130,10 +128,8 @@ positionChanged = ()=>
|
|||
*
|
||||
* Returns the rotation defined in the style of the cell.
|
||||
*/
|
||||
getRotation = ()=>
|
||||
{
|
||||
if (this.state.shape != null)
|
||||
{
|
||||
getRotation = () => {
|
||||
if (this.state.shape != null) {
|
||||
return this.state.shape.getRotation();
|
||||
}
|
||||
|
||||
|
@ -146,10 +142,8 @@ getRotation = ()=>
|
|||
* Returns the rotation from the style and the rotation from the direction of
|
||||
* the cell.
|
||||
*/
|
||||
getTotalRotation = ()=>
|
||||
{
|
||||
if (this.state.shape != null)
|
||||
{
|
||||
getTotalRotation = () => {
|
||||
if (this.state.shape != null) {
|
||||
return this.state.shape.getShapeRotation();
|
||||
}
|
||||
|
||||
|
@ -161,17 +155,13 @@ getTotalRotation = ()=>
|
|||
*
|
||||
* Creates and initializes the shapes required for this handle.
|
||||
*/
|
||||
init = ()=>
|
||||
{
|
||||
init = () => {
|
||||
var html = this.isHtmlRequired();
|
||||
|
||||
if (this.image != null)
|
||||
{
|
||||
if (this.image != null) {
|
||||
this.shape = new mxImageShape(new mxRectangle(0, 0, this.image.width, this.image.height), this.image.src);
|
||||
this.shape.preserveImageAspect = false;
|
||||
}
|
||||
else if (this.shape == null)
|
||||
{
|
||||
} else if (this.shape == null) {
|
||||
this.shape = this.createShape(html);
|
||||
}
|
||||
|
||||
|
@ -183,8 +173,7 @@ init = ()=>
|
|||
*
|
||||
* Creates and returns the shape for this handle.
|
||||
*/
|
||||
createShape = (html)=>
|
||||
{
|
||||
createShape = (html) => {
|
||||
var bounds = new mxRectangle(0, 0, mxConstants.HANDLE_SIZE, mxConstants.HANDLE_SIZE);
|
||||
|
||||
return new mxRectangleShape(bounds, mxConstants.HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR);
|
||||
|
@ -195,20 +184,15 @@ createShape = (html)=>
|
|||
*
|
||||
* Initializes <shape> and sets its cursor.
|
||||
*/
|
||||
initShape = (html)=>
|
||||
{
|
||||
if (html && this.shape.isHtmlAllowed())
|
||||
{
|
||||
initShape = (html) => {
|
||||
if (html && this.shape.isHtmlAllowed()) {
|
||||
this.shape.dialect = mxConstants.DIALECT_STRICTHTML;
|
||||
this.shape.init(this.graph.container);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
this.shape.dialect = (this.graph.dialect != mxConstants.DIALECT_SVG) ?
|
||||
mxConstants.DIALECT_MIXEDHTML : mxConstants.DIALECT_SVG;
|
||||
|
||||
if (this.cursor != null)
|
||||
{
|
||||
if (this.cursor != null) {
|
||||
this.shape.init(this.graph.getView().getOverlayPane());
|
||||
}
|
||||
}
|
||||
|
@ -222,14 +206,11 @@ initShape = (html)=>
|
|||
*
|
||||
* Renders the shape for this handle.
|
||||
*/
|
||||
redraw = ()=>
|
||||
{
|
||||
if (this.shape != null && this.state.shape != null)
|
||||
{
|
||||
redraw = () => {
|
||||
if (this.shape != null && this.state.shape != null) {
|
||||
var pt = this.getPosition(this.state.getPaintBounds());
|
||||
|
||||
if (pt != null)
|
||||
{
|
||||
if (pt != null) {
|
||||
var alpha = mxUtils.toRadians(this.getTotalRotation());
|
||||
pt = this.rotatePoint(this.flipPoint(pt), alpha);
|
||||
|
||||
|
@ -250,8 +231,7 @@ redraw = ()=>
|
|||
* 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;
|
||||
};
|
||||
|
||||
|
@ -260,8 +240,7 @@ isHtmlRequired = ()=>
|
|||
*
|
||||
* Rotates the point by the given angle.
|
||||
*/
|
||||
rotatePoint = (pt, alpha)=>
|
||||
{
|
||||
rotatePoint = (pt, alpha) => {
|
||||
var bounds = this.state.getCellBounds();
|
||||
var cx = new mxPoint(bounds.getCenterX(), bounds.getCenterY());
|
||||
var cos = Math.cos(alpha);
|
||||
|
@ -275,19 +254,15 @@ rotatePoint = (pt, alpha)=>
|
|||
*
|
||||
* Flips the given point vertically and/or horizontally.
|
||||
*/
|
||||
flipPoint = (pt)=>
|
||||
{
|
||||
if (this.state.shape != null)
|
||||
{
|
||||
flipPoint = (pt) => {
|
||||
if (this.state.shape != null) {
|
||||
var bounds = this.state.getCellBounds();
|
||||
|
||||
if (this.state.shape.flipH)
|
||||
{
|
||||
if (this.state.shape.flipH) {
|
||||
pt.x = 2 * bounds.x + bounds.width - pt.x;
|
||||
}
|
||||
|
||||
if (this.state.shape.flipV)
|
||||
{
|
||||
if (this.state.shape.flipV) {
|
||||
pt.y = 2 * bounds.y + bounds.height - pt.y;
|
||||
}
|
||||
}
|
||||
|
@ -301,10 +276,8 @@ flipPoint = (pt)=>
|
|||
* 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)=>
|
||||
{
|
||||
if (!ignore)
|
||||
{
|
||||
snapPoint = (pt, ignore) => {
|
||||
if (!ignore) {
|
||||
pt.x = this.graph.snap(pt.x);
|
||||
pt.y = this.graph.snap(pt.y);
|
||||
}
|
||||
|
@ -317,10 +290,8 @@ snapPoint = (pt, ignore)=>
|
|||
*
|
||||
* Shows or hides this handle.
|
||||
*/
|
||||
setVisible = (visible)=>
|
||||
{
|
||||
if (this.shape != null && this.shape.node != null)
|
||||
{
|
||||
setVisible = (visible) => {
|
||||
if (this.shape != null && this.shape.node != null) {
|
||||
this.shape.node.style.display = (visible) ? '' : 'none';
|
||||
}
|
||||
};
|
||||
|
@ -330,8 +301,7 @@ setVisible = (visible)=>
|
|||
*
|
||||
* 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();
|
||||
|
@ -342,11 +312,12 @@ reset = ()=>
|
|||
*
|
||||
* Destroys this handle.
|
||||
*/
|
||||
destroy = ()=>
|
||||
{
|
||||
if (this.shape != null)
|
||||
{
|
||||
destroy = () => {
|
||||
if (this.shape != null) {
|
||||
this.shape.destroy();
|
||||
this.shape = null;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxHandle;
|
||||
|
|
|
@ -2,6 +2,58 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
class mxKeyHandler {
|
||||
/**
|
||||
* Variable: graph
|
||||
*
|
||||
* Reference to the <mxGraph> associated with this handler.
|
||||
*/
|
||||
graph = null;
|
||||
|
||||
/**
|
||||
* Variable: target
|
||||
*
|
||||
* Reference to the target DOM, that is, the DOM node where the key event
|
||||
* listeners are installed.
|
||||
*/
|
||||
target = null;
|
||||
|
||||
/**
|
||||
* Variable: normalKeys
|
||||
*
|
||||
* Maps from keycodes to functions for non-pressed control keys.
|
||||
*/
|
||||
normalKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: shiftKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed shift keys.
|
||||
*/
|
||||
shiftKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: controlKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed control keys.
|
||||
*/
|
||||
controlKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: controlShiftKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed control and shift keys.
|
||||
*/
|
||||
controlShiftKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: enabled
|
||||
*
|
||||
* Specifies if events are handled. Default is true.
|
||||
*/
|
||||
enabled = true;
|
||||
|
||||
/**
|
||||
* Class: mxKeyHandler
|
||||
*
|
||||
|
@ -63,10 +115,8 @@
|
|||
* element is used as the event target, that is, the object where the key
|
||||
* event listener is installed.
|
||||
*/
|
||||
function mxKeyHandler(graph, target)
|
||||
{
|
||||
if (graph != null)
|
||||
{
|
||||
constructor(graph, target) {
|
||||
if (graph != null) {
|
||||
this.graph = graph;
|
||||
this.target = target || document.documentElement;
|
||||
|
||||
|
@ -76,8 +126,7 @@ function mxKeyHandler(graph, target)
|
|||
this.controlKeys = [];
|
||||
this.controlShiftKeys = [];
|
||||
|
||||
this.keydownHandler = mxUtils.bind(this, (evt)=>
|
||||
{
|
||||
this.keydownHandler = mxUtils.bind(this, (evt) => {
|
||||
this.keyDown(evt);
|
||||
});
|
||||
|
||||
|
@ -86,64 +135,13 @@ function mxKeyHandler(graph, target)
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Variable: graph
|
||||
*
|
||||
* Reference to the <mxGraph> associated with this handler.
|
||||
*/
|
||||
graph = null;
|
||||
|
||||
/**
|
||||
* Variable: target
|
||||
*
|
||||
* Reference to the target DOM, that is, the DOM node where the key event
|
||||
* listeners are installed.
|
||||
*/
|
||||
target = null;
|
||||
|
||||
/**
|
||||
* Variable: normalKeys
|
||||
*
|
||||
* Maps from keycodes to functions for non-pressed control keys.
|
||||
*/
|
||||
normalKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: shiftKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed shift keys.
|
||||
*/
|
||||
shiftKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: controlKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed control keys.
|
||||
*/
|
||||
controlKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: controlShiftKeys
|
||||
*
|
||||
* Maps from keycodes to functions for pressed control and shift keys.
|
||||
*/
|
||||
controlShiftKeys = null;
|
||||
|
||||
/**
|
||||
* Variable: enabled
|
||||
*
|
||||
* Specifies if events are handled. Default is true.
|
||||
*/
|
||||
enabled = true;
|
||||
|
||||
/**
|
||||
* Function: isEnabled
|
||||
*
|
||||
* Returns true if events are handled. This implementation returns
|
||||
* <enabled>.
|
||||
*/
|
||||
isEnabled = ()=>
|
||||
{
|
||||
isEnabled = () => {
|
||||
return this.enabled;
|
||||
};
|
||||
|
||||
|
@ -156,8 +154,7 @@ isEnabled = ()=>
|
|||
*
|
||||
* enabled - Boolean that specifies the new enabled state.
|
||||
*/
|
||||
setEnabled = (enabled)=>
|
||||
{
|
||||
setEnabled = (enabled) => {
|
||||
this.enabled = enabled;
|
||||
};
|
||||
|
||||
|
@ -172,8 +169,7 @@ setEnabled = (enabled)=>
|
|||
* 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;
|
||||
};
|
||||
|
||||
|
@ -188,8 +184,7 @@ bindKey = (code, funct)=>
|
|||
* 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;
|
||||
};
|
||||
|
||||
|
@ -204,8 +199,7 @@ bindShiftKey = (code, funct)=>
|
|||
* 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;
|
||||
};
|
||||
|
||||
|
@ -220,8 +214,7 @@ bindControlKey = (code, funct)=>
|
|||
* 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;
|
||||
};
|
||||
|
||||
|
@ -234,8 +227,7 @@ bindControlShiftKey = (code, funct)=>
|
|||
*
|
||||
* evt - Key event whose control key pressed state should be returned.
|
||||
*/
|
||||
isControlDown = (evt)=>
|
||||
{
|
||||
isControlDown = (evt) => {
|
||||
return mxEvent.isControlDown(evt);
|
||||
};
|
||||
|
||||
|
@ -249,29 +241,18 @@ isControlDown = (evt)=>
|
|||
*
|
||||
* evt - Key event whose associated function should be returned.
|
||||
*/
|
||||
getFunction = (evt)=>
|
||||
{
|
||||
if (evt != null && !mxEvent.isAltDown(evt))
|
||||
{
|
||||
if (this.isControlDown(evt))
|
||||
{
|
||||
if (mxEvent.isShiftDown(evt))
|
||||
{
|
||||
getFunction = (evt) => {
|
||||
if (evt != null && !mxEvent.isAltDown(evt)) {
|
||||
if (this.isControlDown(evt)) {
|
||||
if (mxEvent.isShiftDown(evt)) {
|
||||
return this.controlShiftKeys[evt.keyCode];
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
return this.controlKeys[evt.keyCode];
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if (mxEvent.isShiftDown(evt))
|
||||
{
|
||||
} else {
|
||||
if (mxEvent.isShiftDown(evt)) {
|
||||
return this.shiftKeys[evt.keyCode];
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
return this.normalKeys[evt.keyCode];
|
||||
}
|
||||
}
|
||||
|
@ -292,15 +273,13 @@ getFunction = (evt)=>
|
|||
*
|
||||
* evt - Key event that represents the keystroke.
|
||||
*/
|
||||
isGraphEvent = (evt)=>
|
||||
{
|
||||
isGraphEvent = (evt) => {
|
||||
var source = mxEvent.getSource(evt);
|
||||
|
||||
// Accepts events from the target object or
|
||||
// in-place editing inside graph
|
||||
if ((source == this.target || source.parentNode == this.target) ||
|
||||
(this.graph.cellEditor != null && this.graph.cellEditor.isEventSource(evt)))
|
||||
{
|
||||
(this.graph.cellEditor != null && this.graph.cellEditor.isEventSource(evt))) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
@ -320,23 +299,18 @@ isGraphEvent = (evt)=>
|
|||
*
|
||||
* evt - Key event that represents the keystroke.
|
||||
*/
|
||||
keyDown = (evt)=>
|
||||
{
|
||||
if (this.isEnabledForEvent(evt))
|
||||
{
|
||||
keyDown = (evt) => {
|
||||
if (this.isEnabledForEvent(evt)) {
|
||||
// Cancels the editing if escape is pressed
|
||||
if (evt.keyCode == 27 /* Escape */)
|
||||
{
|
||||
if (evt.keyCode == 27 /* Escape */) {
|
||||
this.escape(evt);
|
||||
}
|
||||
|
||||
// Invokes the function for the keystroke
|
||||
else if (!this.isEventIgnored(evt))
|
||||
{
|
||||
else if (!this.isEventIgnored(evt)) {
|
||||
var boundFunction = this.getFunction(evt);
|
||||
|
||||
if (boundFunction != null)
|
||||
{
|
||||
if (boundFunction != null) {
|
||||
boundFunction(evt);
|
||||
mxEvent.consume(evt);
|
||||
}
|
||||
|
@ -357,8 +331,7 @@ keyDown = (evt)=>
|
|||
*
|
||||
* evt - Key event that represents the keystroke.
|
||||
*/
|
||||
isEnabledForEvent = (evt)=>
|
||||
{
|
||||
isEnabledForEvent = (evt) => {
|
||||
return (this.graph.isEnabled() && !mxEvent.isConsumed(evt) &&
|
||||
this.isGraphEvent(evt) && this.isEnabled());
|
||||
};
|
||||
|
@ -373,8 +346,7 @@ isEnabledForEvent = (evt)=>
|
|||
*
|
||||
* evt - Key event that represents the keystroke.
|
||||
*/
|
||||
isEventIgnored = (evt)=>
|
||||
{
|
||||
isEventIgnored = (evt) => {
|
||||
return this.graph.isEditing();
|
||||
};
|
||||
|
||||
|
@ -390,10 +362,8 @@ isEventIgnored = (evt)=>
|
|||
* evt - Key event that represents the keystroke. Possible keycode in this
|
||||
* case is 27 (ESCAPE).
|
||||
*/
|
||||
escape = (evt)=>
|
||||
{
|
||||
if (this.graph.isEscapeEnabled())
|
||||
{
|
||||
escape = (evt) => {
|
||||
if (this.graph.isEscapeEnabled()) {
|
||||
this.graph.escape(evt);
|
||||
}
|
||||
};
|
||||
|
@ -405,13 +375,14 @@ escape = (evt)=>
|
|||
* normally not need to be called, it is called automatically when the
|
||||
* window unloads (in IE).
|
||||
*/
|
||||
destroy = ()=>
|
||||
{
|
||||
if (this.target != null && this.keydownHandler != null)
|
||||
{
|
||||
destroy = () => {
|
||||
if (this.target != null && this.keydownHandler != null) {
|
||||
mxEvent.removeListener(this.target, 'keydown', this.keydownHandler);
|
||||
this.keydownHandler = null;
|
||||
}
|
||||
|
||||
this.target = null;
|
||||
};
|
||||
}
|
||||
|
||||
export default mxKeyHandler;
|
||||
|
|
|
@ -2,110 +2,8 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
/**
|
||||
* Class: mxPanningHandler
|
||||
*
|
||||
* Event handler that pans and creates popupmenus. To use the left
|
||||
* mousebutton for panning without interfering with cell moving and
|
||||
* resizing, use <isUseLeftButton> and <isIgnoreCell>. For grid size
|
||||
* steps while panning, use <useGrid>. This handler is built-into
|
||||
* <mxGraph.panningHandler> and enabled using <mxGraph.setPanning>.
|
||||
*
|
||||
* Constructor: mxPanningHandler
|
||||
*
|
||||
* Constructs an event handler that creates a <mxPopupMenu>
|
||||
* and pans the graph.
|
||||
*
|
||||
* Event: mxEvent.PAN_START
|
||||
*
|
||||
* Fires when the panning handler changes its <active> state to true. The
|
||||
* <code>event</code> property contains the corresponding <mxMouseEvent>.
|
||||
*
|
||||
* Event: mxEvent.PAN
|
||||
*
|
||||
* Fires while handle is processing events. The <code>event</code> property contains
|
||||
* the corresponding <mxMouseEvent>.
|
||||
*
|
||||
* Event: mxEvent.PAN_END
|
||||
*
|
||||
* Fires when the panning handler changes its <active> state to false. The
|
||||
* <code>event</code> property contains the corresponding <mxMouseEvent>.
|
||||
*/
|
||||
function mxPanningHandler(graph)
|
||||
{
|
||||
if (graph != null)
|
||||
{
|
||||
this.graph = graph;
|
||||
this.graph.addMouseListener(this);
|
||||
|
||||
// Handles force panning event
|
||||
this.forcePanningHandler = mxUtils.bind(this, (sender, evt)=>
|
||||
{
|
||||
var evtName = evt.getProperty('eventName');
|
||||
var me = evt.getProperty('event');
|
||||
|
||||
if (evtName == mxEvent.MOUSE_DOWN && this.isForcePanningEvent(me))
|
||||
{
|
||||
this.start(me);
|
||||
this.active = true;
|
||||
this.fireEvent(new mxEventObject(mxEvent.PAN_START, 'event', me));
|
||||
me.consume();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.addListener(mxEvent.FIRE_MOUSE_EVENT, this.forcePanningHandler);
|
||||
|
||||
// Handles pinch gestures
|
||||
this.gestureHandler = mxUtils.bind(this, (sender, eo)=>
|
||||
{
|
||||
if (this.isPinchEnabled())
|
||||
{
|
||||
var evt = eo.getProperty('event');
|
||||
|
||||
if (!mxEvent.isConsumed(evt) && evt.type == 'gesturestart')
|
||||
{
|
||||
this.initialScale = this.graph.view.scale;
|
||||
|
||||
// Forces start of panning when pinch gesture starts
|
||||
if (!this.active && this.mouseDownEvent != null)
|
||||
{
|
||||
this.start(this.mouseDownEvent);
|
||||
this.mouseDownEvent = null;
|
||||
}
|
||||
}
|
||||
else if (evt.type == 'gestureend' && this.initialScale != null)
|
||||
{
|
||||
this.initialScale = null;
|
||||
}
|
||||
|
||||
if (this.initialScale != null)
|
||||
{
|
||||
this.zoomGraph(evt);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.addListener(mxEvent.GESTURE, this.gestureHandler);
|
||||
|
||||
this.mouseUpListener = mxUtils.bind(this, ()=>
|
||||
{
|
||||
if (this.active)
|
||||
{
|
||||
this.reset();
|
||||
}
|
||||
});
|
||||
|
||||
// Stops scrolling on every mouseup anywhere in the document
|
||||
mxEvent.addListener(document, 'mouseup', this.mouseUpListener);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Extends mxEventSource.
|
||||
*/
|
||||
mxPanningHandler.prototype = new mxEventSource();
|
||||
constructor = mxPanningHandler;
|
||||
|
||||
class mxPanningHandler extends mxEventSource {
|
||||
/**
|
||||
* Variable: graph
|
||||
*
|
||||
|
@ -207,13 +105,98 @@ startX = 0;
|
|||
*/
|
||||
startY = 0;
|
||||
|
||||
/**
|
||||
* Class: mxPanningHandler
|
||||
*
|
||||
* Event handler that pans and creates popupmenus. To use the left
|
||||
* mousebutton for panning without interfering with cell moving and
|
||||
* resizing, use <isUseLeftButton> and <isIgnoreCell>. For grid size
|
||||
* steps while panning, use <useGrid>. This handler is built-into
|
||||
* <mxGraph.panningHandler> and enabled using <mxGraph.setPanning>.
|
||||
*
|
||||
* Constructor: mxPanningHandler
|
||||
*
|
||||
* Constructs an event handler that creates a <mxPopupMenu>
|
||||
* and pans the graph.
|
||||
*
|
||||
* Event: mxEvent.PAN_START
|
||||
*
|
||||
* Fires when the panning handler changes its <active> state to true. The
|
||||
* <code>event</code> property contains the corresponding <mxMouseEvent>.
|
||||
*
|
||||
* Event: mxEvent.PAN
|
||||
*
|
||||
* Fires while handle is processing events. The <code>event</code> property contains
|
||||
* the corresponding <mxMouseEvent>.
|
||||
*
|
||||
* Event: mxEvent.PAN_END
|
||||
*
|
||||
* Fires when the panning handler changes its <active> state to false. The
|
||||
* <code>event</code> property contains the corresponding <mxMouseEvent>.
|
||||
*/
|
||||
constructor(graph) {
|
||||
// super not called
|
||||
if (graph != null) {
|
||||
this.graph = graph;
|
||||
this.graph.addMouseListener(this);
|
||||
|
||||
// Handles force panning event
|
||||
this.forcePanningHandler = mxUtils.bind(this, (sender, evt) => {
|
||||
var evtName = evt.getProperty('eventName');
|
||||
var me = evt.getProperty('event');
|
||||
|
||||
if (evtName == mxEvent.MOUSE_DOWN && this.isForcePanningEvent(me)) {
|
||||
this.start(me);
|
||||
this.active = true;
|
||||
this.fireEvent(new mxEventObject(mxEvent.PAN_START, 'event', me));
|
||||
me.consume();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.addListener(mxEvent.FIRE_MOUSE_EVENT, this.forcePanningHandler);
|
||||
|
||||
// Handles pinch gestures
|
||||
this.gestureHandler = mxUtils.bind(this, (sender, eo) => {
|
||||
if (this.isPinchEnabled()) {
|
||||
var evt = eo.getProperty('event');
|
||||
|
||||
if (!mxEvent.isConsumed(evt) && evt.type == 'gesturestart') {
|
||||
this.initialScale = this.graph.view.scale;
|
||||
|
||||
// Forces start of panning when pinch gesture starts
|
||||
if (!this.active && this.mouseDownEvent != null) {
|
||||
this.start(this.mouseDownEvent);
|
||||
this.mouseDownEvent = null;
|
||||
}
|
||||
} else if (evt.type == 'gestureend' && this.initialScale != null) {
|
||||
this.initialScale = null;
|
||||
}
|
||||
|
||||
if (this.initialScale != null) {
|
||||
this.zoomGraph(evt);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.addListener(mxEvent.GESTURE, this.gestureHandler);
|
||||
|
||||
this.mouseUpListener = mxUtils.bind(this, () => {
|
||||
if (this.active) {
|
||||
this.reset();
|
||||
}
|
||||
});
|
||||
|
||||
// Stops scrolling on every mouseup anywhere in the document
|
||||
mxEvent.addListener(document, 'mouseup', this.mouseUpListener);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Function: isActive
|
||||
*
|
||||
* Returns true if the handler is currently active.
|
||||
*/
|
||||
isActive = ()=>
|
||||
{
|
||||
isActive = () => {
|
||||
return this.active || this.initialScale != null;
|
||||
};
|
||||
|
||||
|
@ -222,8 +205,7 @@ isActive = ()=>
|
|||
*
|
||||
* Returns <panningEnabled>.
|
||||
*/
|
||||
isPanningEnabled = ()=>
|
||||
{
|
||||
isPanningEnabled = () => {
|
||||
return this.panningEnabled;
|
||||
};
|
||||
|
||||
|
@ -232,8 +214,7 @@ isPanningEnabled = ()=>
|
|||
*
|
||||
* Sets <panningEnabled>.
|
||||
*/
|
||||
setPanningEnabled = (value)=>
|
||||
{
|
||||
setPanningEnabled = (value) => {
|
||||
this.panningEnabled = value;
|
||||
};
|
||||
|
||||
|
@ -242,8 +223,7 @@ setPanningEnabled = (value)=>
|
|||
*
|
||||
* Returns <pinchEnabled>.
|
||||
*/
|
||||
isPinchEnabled = ()=>
|
||||
{
|
||||
isPinchEnabled = () => {
|
||||
return this.pinchEnabled;
|
||||
};
|
||||
|
||||
|
@ -252,8 +232,7 @@ isPinchEnabled = ()=>
|
|||
*
|
||||
* Sets <pinchEnabled>.
|
||||
*/
|
||||
setPinchEnabled = (value)=>
|
||||
{
|
||||
setPinchEnabled = (value) => {
|
||||
this.pinchEnabled = value;
|
||||
};
|
||||
|
||||
|
@ -264,8 +243,7 @@ setPinchEnabled = (value)=>
|
|||
* given cell. This returns true if control-shift is pressed or if
|
||||
* <usePopupTrigger> is true and the event is a popup trigger.
|
||||
*/
|
||||
isPanningTrigger = (me)=>
|
||||
{
|
||||
isPanningTrigger = (me) => {
|
||||
var evt = me.getEvent();
|
||||
|
||||
return (this.useLeftButtonForPanning && me.getState() == null &&
|
||||
|
@ -280,8 +258,7 @@ isPanningTrigger = (me)=>
|
|||
* implementation always returns true if <ignoreCell> is true or for
|
||||
* multi touch events.
|
||||
*/
|
||||
isForcePanningEvent = (me)=>
|
||||
{
|
||||
isForcePanningEvent = (me) => {
|
||||
return this.ignoreCell || mxEvent.isMultiTouchEvent(me.getEvent());
|
||||
};
|
||||
|
||||
|
@ -291,12 +268,10 @@ isForcePanningEvent = (me)=>
|
|||
* 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 (!me.isConsumed() && this.isPanningEnabled() && !this.active && this.isPanningTrigger(me))
|
||||
{
|
||||
if (!me.isConsumed() && this.isPanningEnabled() && !this.active && this.isPanningTrigger(me)) {
|
||||
this.start(me);
|
||||
this.consumePanningTrigger(me);
|
||||
}
|
||||
|
@ -307,8 +282,7 @@ mouseDown = (sender, me)=>
|
|||
*
|
||||
* Starts panning at the given event.
|
||||
*/
|
||||
start = (me)=>
|
||||
{
|
||||
start = (me) => {
|
||||
this.dx0 = -this.graph.container.scrollLeft;
|
||||
this.dy0 = -this.graph.container.scrollTop;
|
||||
|
||||
|
@ -349,8 +323,7 @@ start = (me)=>
|
|||
* };
|
||||
* (end)
|
||||
*/
|
||||
consumePanningTrigger = (me)=>
|
||||
{
|
||||
consumePanningTrigger = (me) => {
|
||||
me.consume();
|
||||
};
|
||||
|
||||
|
@ -359,18 +332,14 @@ consumePanningTrigger = (me)=>
|
|||
*
|
||||
* 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;
|
||||
|
||||
if (this.active)
|
||||
{
|
||||
if (this.previewEnabled)
|
||||
{
|
||||
if (this.active) {
|
||||
if (this.previewEnabled) {
|
||||
// Applies the grid to the panning steps
|
||||
if (this.useGrid)
|
||||
{
|
||||
if (this.useGrid) {
|
||||
this.dx = this.graph.snap(this.dx);
|
||||
this.dy = this.graph.snap(this.dy);
|
||||
}
|
||||
|
@ -379,23 +348,19 @@ mouseMove = (sender, me)=>
|
|||
}
|
||||
|
||||
this.fireEvent(new mxEventObject(mxEvent.PAN, 'event', me));
|
||||
}
|
||||
else if (this.panningTrigger)
|
||||
{
|
||||
} else if (this.panningTrigger) {
|
||||
var tmp = this.active;
|
||||
|
||||
// Panning is activated only if the mouse is moved
|
||||
// beyond the graph tolerance
|
||||
this.active = Math.abs(this.dx) > this.graph.tolerance || Math.abs(this.dy) > this.graph.tolerance;
|
||||
|
||||
if (!tmp && this.active)
|
||||
{
|
||||
if (!tmp && this.active) {
|
||||
this.fireEvent(new mxEventObject(mxEvent.PAN_START, 'event', me));
|
||||
}
|
||||
}
|
||||
|
||||
if (this.active || this.panningTrigger)
|
||||
{
|
||||
if (this.active || this.panningTrigger) {
|
||||
me.consume();
|
||||
}
|
||||
};
|
||||
|
@ -406,15 +371,11 @@ mouseMove = (sender, me)=>
|
|||
* Handles the event by setting the translation on the view or showing the
|
||||
* popupmenu.
|
||||
*/
|
||||
mouseUp = (sender, me)=>
|
||||
{
|
||||
if (this.active)
|
||||
{
|
||||
if (this.dx != null && this.dy != null)
|
||||
{
|
||||
mouseUp = (sender, me) => {
|
||||
if (this.active) {
|
||||
if (this.dx != null && this.dy != null) {
|
||||
// Ignores if scrollbars have been used for panning
|
||||
if (!this.graph.useScrollbarsForPanning || !mxUtils.hasScrollbars(this.graph.container))
|
||||
{
|
||||
if (!this.graph.useScrollbarsForPanning || !mxUtils.hasScrollbars(this.graph.container)) {
|
||||
var scale = this.graph.getView().scale;
|
||||
var t = this.graph.getView().translate;
|
||||
this.graph.panGraph(0, 0);
|
||||
|
@ -435,22 +396,18 @@ mouseUp = (sender, me)=>
|
|||
*
|
||||
* Zooms the graph to the given value and consumed the event if needed.
|
||||
*/
|
||||
zoomGraph = (evt)=>
|
||||
{
|
||||
zoomGraph = (evt) => {
|
||||
var value = Math.round(this.initialScale * evt.scale * 100) / 100;
|
||||
|
||||
if (this.minScale != null)
|
||||
{
|
||||
if (this.minScale != null) {
|
||||
value = Math.max(this.minScale, value);
|
||||
}
|
||||
|
||||
if (this.maxScale != null)
|
||||
{
|
||||
if (this.maxScale != null) {
|
||||
value = Math.min(this.maxScale, value);
|
||||
}
|
||||
|
||||
if (this.graph.view.scale != value)
|
||||
{
|
||||
if (this.graph.view.scale != value) {
|
||||
this.graph.zoomTo(value);
|
||||
mxEvent.consume(evt);
|
||||
}
|
||||
|
@ -461,8 +418,7 @@ zoomGraph = (evt)=>
|
|||
*
|
||||
* Resets the state of this handler.
|
||||
*/
|
||||
reset = ()=>
|
||||
{
|
||||
reset = () => {
|
||||
this.panningTrigger = false;
|
||||
this.mouseDownEvent = null;
|
||||
this.active = false;
|
||||
|
@ -475,8 +431,7 @@ reset = ()=>
|
|||
*
|
||||
* Pans <graph> by the given amount.
|
||||
*/
|
||||
panGraph = (dx, dy)=>
|
||||
{
|
||||
panGraph = (dx, dy) => {
|
||||
this.graph.getView().setTranslate(dx, dy);
|
||||
};
|
||||
|
||||
|
@ -485,10 +440,12 @@ panGraph = (dx, dy)=>
|
|||
*
|
||||
* 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;
|
||||
|
|
|
@ -2,58 +2,8 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
/**
|
||||
* Class: mxSelectionCellsHandler
|
||||
*
|
||||
* An event handler that manages cell handlers and invokes their mouse event
|
||||
* processing functions.
|
||||
*
|
||||
* Group: Events
|
||||
*
|
||||
* Event: mxEvent.ADD
|
||||
*
|
||||
* Fires if a cell has been added to the selection. The <code>state</code>
|
||||
* property contains the <mxCellState> that has been added.
|
||||
*
|
||||
* Event: mxEvent.REMOVE
|
||||
*
|
||||
* Fires if a cell has been remove from the selection. The <code>state</code>
|
||||
* property contains the <mxCellState> that has been removed.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* graph - Reference to the enclosing <mxGraph>.
|
||||
*/
|
||||
function mxSelectionCellsHandler(graph)
|
||||
{
|
||||
mxEventSource.call(this);
|
||||
|
||||
this.graph = graph;
|
||||
this.handlers = new mxDictionary();
|
||||
this.graph.addMouseListener(this);
|
||||
|
||||
this.refreshHandler = mxUtils.bind(this, (sender, evt)=>
|
||||
{
|
||||
if (this.isEnabled())
|
||||
{
|
||||
this.refresh();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.getSelectionModel().addListener(mxEvent.CHANGE, this.refreshHandler);
|
||||
this.graph.getModel().addListener(mxEvent.CHANGE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.SCALE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.TRANSLATE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.SCALE_AND_TRANSLATE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.DOWN, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.UP, this.refreshHandler);
|
||||
};
|
||||
|
||||
/**
|
||||
* Extends mxEventSource.
|
||||
*/
|
||||
mxUtils.extend(mxSelectionCellsHandler, mxEventSource);
|
||||
|
||||
class mxSelectionCellsHandler extends mxEventSource {
|
||||
/**
|
||||
* Variable: graph
|
||||
*
|
||||
|
@ -89,13 +39,56 @@ maxHandlers = 100;
|
|||
*/
|
||||
handlers = null;
|
||||
|
||||
/**
|
||||
* Class: mxSelectionCellsHandler
|
||||
*
|
||||
* An event handler that manages cell handlers and invokes their mouse event
|
||||
* processing functions.
|
||||
*
|
||||
* Group: Events
|
||||
*
|
||||
* Event: mxEvent.ADD
|
||||
*
|
||||
* Fires if a cell has been added to the selection. The <code>state</code>
|
||||
* property contains the <mxCellState> that has been added.
|
||||
*
|
||||
* Event: mxEvent.REMOVE
|
||||
*
|
||||
* Fires if a cell has been remove from the selection. The <code>state</code>
|
||||
* property contains the <mxCellState> that has been removed.
|
||||
*
|
||||
* Parameters:
|
||||
*
|
||||
* graph - Reference to the enclosing <mxGraph>.
|
||||
*/
|
||||
constructor(graph) {
|
||||
super();
|
||||
|
||||
this.graph = graph;
|
||||
this.handlers = new mxDictionary();
|
||||
this.graph.addMouseListener(this);
|
||||
|
||||
this.refreshHandler = mxUtils.bind(this, (sender, evt) => {
|
||||
if (this.isEnabled()) {
|
||||
this.refresh();
|
||||
}
|
||||
});
|
||||
|
||||
this.graph.getSelectionModel().addListener(mxEvent.CHANGE, this.refreshHandler);
|
||||
this.graph.getModel().addListener(mxEvent.CHANGE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.SCALE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.TRANSLATE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.SCALE_AND_TRANSLATE, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.DOWN, this.refreshHandler);
|
||||
this.graph.getView().addListener(mxEvent.UP, this.refreshHandler);
|
||||
};
|
||||
|
||||
/**
|
||||
* Function: isEnabled
|
||||
*
|
||||
* Returns <enabled>.
|
||||
*/
|
||||
isEnabled = ()=>
|
||||
{
|
||||
isEnabled = () => {
|
||||
return this.enabled;
|
||||
};
|
||||
|
||||
|
@ -104,8 +97,7 @@ isEnabled = ()=>
|
|||
*
|
||||
* Sets <enabled>.
|
||||
*/
|
||||
setEnabled = (value)=>
|
||||
{
|
||||
setEnabled = (value) => {
|
||||
this.enabled = value;
|
||||
};
|
||||
|
||||
|
@ -114,8 +106,7 @@ setEnabled = (value)=>
|
|||
*
|
||||
* Returns the handler for the given cell.
|
||||
*/
|
||||
getHandler = (cell)=>
|
||||
{
|
||||
getHandler = (cell) => {
|
||||
return this.handlers.get(cell);
|
||||
};
|
||||
|
||||
|
@ -124,8 +115,7 @@ getHandler = (cell)=>
|
|||
*
|
||||
* Returns true if the given cell has a handler.
|
||||
*/
|
||||
isHandled = (cell)=>
|
||||
{
|
||||
isHandled = (cell) => {
|
||||
return this.getHandler(cell) != null;
|
||||
};
|
||||
|
||||
|
@ -134,10 +124,8 @@ isHandled = (cell)=>
|
|||
*
|
||||
* Resets all handlers.
|
||||
*/
|
||||
reset = ()=>
|
||||
{
|
||||
this.handlers.visit((key, handler)=>
|
||||
{
|
||||
reset = () => {
|
||||
this.handlers.visit((key, handler) => {
|
||||
handler.reset.apply(handler);
|
||||
});
|
||||
};
|
||||
|
@ -147,8 +135,7 @@ reset = ()=>
|
|||
*
|
||||
* Reloads or updates all handlers.
|
||||
*/
|
||||
getHandledSelectionCells = ()=>
|
||||
{
|
||||
getHandledSelectionCells = () => {
|
||||
return this.graph.getSelectionCells();
|
||||
};
|
||||
|
||||
|
@ -157,8 +144,7 @@ getHandledSelectionCells = ()=>
|
|||
*
|
||||
* Reloads or updates all handlers.
|
||||
*/
|
||||
refresh = ()=>
|
||||
{
|
||||
refresh = () => {
|
||||
// Removes all existing handlers
|
||||
var oldHandlers = this.handlers;
|
||||
this.handlers = new mxDictionary();
|
||||
|
@ -167,25 +153,18 @@ refresh = ()=>
|
|||
var tmp = mxUtils.sortCells(this.getHandledSelectionCells(), false);
|
||||
|
||||
// Destroys or updates old handlers
|
||||
for (var i = 0; i < tmp.length; i++)
|
||||
{
|
||||
for (var i = 0; i < tmp.length; i++) {
|
||||
var state = this.graph.view.getState(tmp[i]);
|
||||
|
||||
if (state != null)
|
||||
{
|
||||
if (state != null) {
|
||||
var handler = oldHandlers.remove(tmp[i]);
|
||||
|
||||
if (handler != null)
|
||||
{
|
||||
if (handler.state != state)
|
||||
{
|
||||
if (handler != null) {
|
||||
if (handler.state != state) {
|
||||
handler.destroy();
|
||||
handler = null;
|
||||
}
|
||||
else if (!this.isHandlerActive(handler))
|
||||
{
|
||||
if (handler.refresh != null)
|
||||
{
|
||||
} else if (!this.isHandlerActive(handler)) {
|
||||
if (handler.refresh != null) {
|
||||
handler.refresh();
|
||||
}
|
||||
|
||||
|
@ -193,37 +172,30 @@ refresh = ()=>
|
|||
}
|
||||
}
|
||||
|
||||
if (handler != null)
|
||||
{
|
||||
if (handler != null) {
|
||||
this.handlers.put(tmp[i], handler);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Destroys unused handlers
|
||||
oldHandlers.visit(mxUtils.bind(this, (key, handler)=>
|
||||
{
|
||||
oldHandlers.visit(mxUtils.bind(this, (key, handler) => {
|
||||
this.fireEvent(new mxEventObject(mxEvent.REMOVE, 'state', handler.state));
|
||||
handler.destroy();
|
||||
}));
|
||||
|
||||
// Creates new handlers and updates parent highlight on existing handlers
|
||||
for (var i = 0; i < tmp.length; i++)
|
||||
{
|
||||
for (var i = 0; i < tmp.length; i++) {
|
||||
var state = this.graph.view.getState(tmp[i]);
|
||||
|
||||
if (state != null)
|
||||
{
|
||||
if (state != null) {
|
||||
var handler = this.handlers.get(tmp[i]);
|
||||
|
||||
if (handler == null)
|
||||
{
|
||||
if (handler == null) {
|
||||
handler = this.graph.createHandler(state);
|
||||
this.fireEvent(new mxEventObject(mxEvent.ADD, 'state', state));
|
||||
this.handlers.put(tmp[i], handler);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
handler.updateParentHighlight();
|
||||
}
|
||||
}
|
||||
|
@ -235,8 +207,7 @@ refresh = ()=>
|
|||
*
|
||||
* Returns true if the given handler is active and should not be redrawn.
|
||||
*/
|
||||
isHandlerActive = (handler)=>
|
||||
{
|
||||
isHandlerActive = (handler) => {
|
||||
return handler.index != null;
|
||||
};
|
||||
|
||||
|
@ -245,12 +216,10 @@ isHandlerActive = (handler)=>
|
|||
*
|
||||
* Updates the handler for the given shape if one exists.
|
||||
*/
|
||||
updateHandler = (state)=>
|
||||
{
|
||||
updateHandler = (state) => {
|
||||
var handler = this.handlers.remove(state.cell);
|
||||
|
||||
if (handler != null)
|
||||
{
|
||||
if (handler != null) {
|
||||
// Transfers the current state to the new handler
|
||||
var index = handler.index;
|
||||
var x = handler.startX;
|
||||
|
@ -259,12 +228,10 @@ updateHandler = (state)=>
|
|||
handler.destroy();
|
||||
handler = this.graph.createHandler(state);
|
||||
|
||||
if (handler != null)
|
||||
{
|
||||
if (handler != null) {
|
||||
this.handlers.put(state.cell, handler);
|
||||
|
||||
if (index != null && x != null && y != null)
|
||||
{
|
||||
if (index != null && x != null && y != null) {
|
||||
handler.start(x, y, index);
|
||||
}
|
||||
}
|
||||
|
@ -276,14 +243,11 @@ updateHandler = (state)=>
|
|||
*
|
||||
* Redirects the given event to the handlers.
|
||||
*/
|
||||
mouseDown = (sender, me)=>
|
||||
{
|
||||
if (this.graph.isEnabled() && this.isEnabled())
|
||||
{
|
||||
mouseDown = (sender, me) => {
|
||||
if (this.graph.isEnabled() && this.isEnabled()) {
|
||||
var args = [sender, me];
|
||||
|
||||
this.handlers.visit((key, handler)=>
|
||||
{
|
||||
this.handlers.visit((key, handler) => {
|
||||
handler.mouseDown.apply(handler, args);
|
||||
});
|
||||
}
|
||||
|
@ -294,14 +258,11 @@ mouseDown = (sender, me)=>
|
|||
*
|
||||
* Redirects the given event to the handlers.
|
||||
*/
|
||||
mouseMove = (sender, me)=>
|
||||
{
|
||||
if (this.graph.isEnabled() && this.isEnabled())
|
||||
{
|
||||
mouseMove = (sender, me) => {
|
||||
if (this.graph.isEnabled() && this.isEnabled()) {
|
||||
var args = [sender, me];
|
||||
|
||||
this.handlers.visit((key, handler)=>
|
||||
{
|
||||
this.handlers.visit((key, handler) => {
|
||||
handler.mouseMove.apply(handler, args);
|
||||
});
|
||||
}
|
||||
|
@ -312,14 +273,11 @@ mouseMove = (sender, me)=>
|
|||
*
|
||||
* Redirects the given event to the handlers.
|
||||
*/
|
||||
mouseUp = (sender, me)=>
|
||||
{
|
||||
if (this.graph.isEnabled() && this.isEnabled())
|
||||
{
|
||||
mouseUp = (sender, me) => {
|
||||
if (this.graph.isEnabled() && this.isEnabled()) {
|
||||
var args = [sender, me];
|
||||
|
||||
this.handlers.visit((key, handler)=>
|
||||
{
|
||||
this.handlers.visit((key, handler) => {
|
||||
handler.mouseUp.apply(handler, args);
|
||||
});
|
||||
}
|
||||
|
@ -330,15 +288,16 @@ mouseUp = (sender, me)=>
|
|||
*
|
||||
* Destroys the handler and all its resources and DOM nodes.
|
||||
*/
|
||||
destroy = ()=>
|
||||
{
|
||||
destroy = () => {
|
||||
this.graph.removeMouseListener(this);
|
||||
|
||||
if (this.refreshHandler != null)
|
||||
{
|
||||
if (this.refreshHandler != null) {
|
||||
this.graph.getSelectionModel().removeListener(this.refreshHandler);
|
||||
this.graph.getModel().removeListener(this.refreshHandler);
|
||||
this.graph.getView().removeListener(this.refreshHandler);
|
||||
this.refreshHandler = null;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxSelectionCellsHandler;
|
||||
|
|
|
@ -2,6 +2,8 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
class mxTooltipHandler {
|
||||
/**
|
||||
* Class: mxTooltipHandler
|
||||
*
|
||||
|
@ -26,10 +28,8 @@
|
|||
* graph - Reference to the enclosing <mxGraph>.
|
||||
* delay - Optional delay in milliseconds.
|
||||
*/
|
||||
function mxTooltipHandler(graph, delay)
|
||||
{
|
||||
if (graph != null)
|
||||
{
|
||||
constructor(graph, delay) {
|
||||
if (graph != null) {
|
||||
this.graph = graph;
|
||||
this.delay = delay || 500;
|
||||
this.graph.addMouseListener(this);
|
||||
|
@ -92,8 +92,7 @@ enabled = true;
|
|||
* Returns true if events are handled. This implementation
|
||||
* returns <enabled>.
|
||||
*/
|
||||
isEnabled = ()=>
|
||||
{
|
||||
isEnabled = () => {
|
||||
return this.enabled;
|
||||
};
|
||||
|
||||
|
@ -103,8 +102,7 @@ isEnabled = ()=>
|
|||
* Enables or disables event handling. This implementation
|
||||
* updates <enabled>.
|
||||
*/
|
||||
setEnabled = (enabled)=>
|
||||
{
|
||||
setEnabled = (enabled) => {
|
||||
this.enabled = enabled;
|
||||
};
|
||||
|
||||
|
@ -113,8 +111,7 @@ setEnabled = (enabled)=>
|
|||
*
|
||||
* Returns <hideOnHover>.
|
||||
*/
|
||||
isHideOnHover = ()=>
|
||||
{
|
||||
isHideOnHover = () => {
|
||||
return this.hideOnHover;
|
||||
};
|
||||
|
||||
|
@ -123,8 +120,7 @@ isHideOnHover = ()=>
|
|||
*
|
||||
* Sets <hideOnHover>.
|
||||
*/
|
||||
setHideOnHover = (value)=>
|
||||
{
|
||||
setHideOnHover = (value) => {
|
||||
this.hideOnHover = value;
|
||||
};
|
||||
|
||||
|
@ -133,22 +129,18 @@ setHideOnHover = (value)=>
|
|||
*
|
||||
* Initializes the DOM nodes required for this tooltip handler.
|
||||
*/
|
||||
init = ()=>
|
||||
{
|
||||
if (document.body != null)
|
||||
{
|
||||
init = () => {
|
||||
if (document.body != null) {
|
||||
this.div = document.createElement('div');
|
||||
this.div.className = 'mxTooltip';
|
||||
this.div.style.visibility = 'hidden';
|
||||
|
||||
document.body.appendChild(this.div);
|
||||
|
||||
mxEvent.addGestureListeners(this.div, mxUtils.bind(this, (evt)=>
|
||||
{
|
||||
mxEvent.addGestureListeners(this.div, mxUtils.bind(this, (evt) => {
|
||||
var source = mxEvent.getSource(evt);
|
||||
|
||||
if (source.nodeName != 'A')
|
||||
{
|
||||
if (source.nodeName != 'A') {
|
||||
this.hideTooltip();
|
||||
}
|
||||
}));
|
||||
|
@ -160,8 +152,7 @@ init = ()=>
|
|||
*
|
||||
* Returns the <mxCellState> to be used for showing a tooltip for this event.
|
||||
*/
|
||||
getStateForEvent = (me)=>
|
||||
{
|
||||
getStateForEvent = (me) => {
|
||||
return me.getState();
|
||||
};
|
||||
|
||||
|
@ -172,8 +163,7 @@ getStateForEvent = (me)=>
|
|||
* event all subsequent events of the gesture are redirected to this
|
||||
* handler.
|
||||
*/
|
||||
mouseDown = (sender, me)=>
|
||||
{
|
||||
mouseDown = (sender, me) => {
|
||||
this.reset(me, false);
|
||||
this.hideTooltip();
|
||||
};
|
||||
|
@ -183,17 +173,14 @@ mouseDown = (sender, me)=>
|
|||
*
|
||||
* Handles the event by updating the rubberband selection.
|
||||
*/
|
||||
mouseMove = (sender, me)=>
|
||||
{
|
||||
if (me.getX() != this.lastX || me.getY() != this.lastY)
|
||||
{
|
||||
mouseMove = (sender, me) => {
|
||||
if (me.getX() != this.lastX || me.getY() != this.lastY) {
|
||||
this.reset(me, true);
|
||||
var state = this.getStateForEvent(me);
|
||||
|
||||
if (this.isHideOnHover() || state != this.state || (me.getSource() != this.node &&
|
||||
(!this.stateSource || (state != null && this.stateSource ==
|
||||
(me.isSource(state.shape) || !me.isSource(state.text))))))
|
||||
{
|
||||
(me.isSource(state.shape) || !me.isSource(state.text)))))) {
|
||||
this.hideTooltip();
|
||||
}
|
||||
}
|
||||
|
@ -208,8 +195,7 @@ mouseMove = (sender, me)=>
|
|||
* 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();
|
||||
};
|
||||
|
@ -220,10 +206,8 @@ mouseUp = (sender, me)=>
|
|||
*
|
||||
* Resets the timer.
|
||||
*/
|
||||
resetTimer = ()=>
|
||||
{
|
||||
if (this.thread != null)
|
||||
{
|
||||
resetTimer = () => {
|
||||
if (this.thread != null) {
|
||||
window.clearTimeout(this.thread);
|
||||
this.thread = null;
|
||||
}
|
||||
|
@ -234,25 +218,20 @@ resetTimer = ()=>
|
|||
*
|
||||
* Resets and/or restarts the timer to trigger the display of the tooltip.
|
||||
*/
|
||||
reset = (me, restart, state)=>
|
||||
{
|
||||
if (!this.ignoreTouchEvents || mxEvent.isMouseEvent(me.getEvent()))
|
||||
{
|
||||
reset = (me, restart, state) => {
|
||||
if (!this.ignoreTouchEvents || mxEvent.isMouseEvent(me.getEvent())) {
|
||||
this.resetTimer();
|
||||
state = (state != null) ? state : this.getStateForEvent(me);
|
||||
|
||||
if (restart && this.isEnabled() && state != null && (this.div == null ||
|
||||
this.div.style.visibility == 'hidden'))
|
||||
{
|
||||
this.div.style.visibility == 'hidden')) {
|
||||
var node = me.getSource();
|
||||
var x = me.getX();
|
||||
var y = me.getY();
|
||||
var stateSource = me.isSource(state.shape) || me.isSource(state.text);
|
||||
|
||||
this.thread = window.setTimeout(mxUtils.bind(this, ()=>
|
||||
{
|
||||
if (!this.graph.isEditing() && !this.graph.popupMenuHandler.isMenuShowing() && !this.graph.isMouseDown)
|
||||
{
|
||||
this.thread = window.setTimeout(mxUtils.bind(this, () => {
|
||||
if (!this.graph.isEditing() && !this.graph.popupMenuHandler.isMenuShowing() && !this.graph.isMouseDown) {
|
||||
// Uses information from inside event cause using the event at
|
||||
// this (delayed) point in time is not possible in IE as it no
|
||||
// longer contains the required information (member not found)
|
||||
|
@ -272,8 +251,7 @@ reset = (me, restart, state)=>
|
|||
*
|
||||
* Hides the tooltip and resets the timer.
|
||||
*/
|
||||
hide = ()=>
|
||||
{
|
||||
hide = () => {
|
||||
this.resetTimer();
|
||||
this.hideTooltip();
|
||||
};
|
||||
|
@ -283,10 +261,8 @@ hide = ()=>
|
|||
*
|
||||
* Hides the tooltip.
|
||||
*/
|
||||
hideTooltip = ()=>
|
||||
{
|
||||
if (this.div != null)
|
||||
{
|
||||
hideTooltip = () => {
|
||||
if (this.div != null) {
|
||||
this.div.style.visibility = 'hidden';
|
||||
this.div.innerHTML = '';
|
||||
}
|
||||
|
@ -298,13 +274,10 @@ hideTooltip = ()=>
|
|||
* 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)=>
|
||||
{
|
||||
if (!this.destroyed && tip != null && tip.length > 0)
|
||||
{
|
||||
show = (tip, x, y) => {
|
||||
if (!this.destroyed && tip != null && tip.length > 0) {
|
||||
// Initializes the DOM nodes if required
|
||||
if (this.div == null)
|
||||
{
|
||||
if (this.div == null) {
|
||||
this.init();
|
||||
}
|
||||
|
||||
|
@ -315,12 +288,9 @@ show = (tip, x, y)=>
|
|||
this.div.style.top = (y + mxConstants.TOOLTIP_VERTICAL_OFFSET +
|
||||
origin.y) + 'px';
|
||||
|
||||
if (!mxUtils.isNode(tip))
|
||||
{
|
||||
if (!mxUtils.isNode(tip)) {
|
||||
this.div.innerHTML = tip.replace(/\n/g, '<br>');
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
this.div.innerHTML = '';
|
||||
this.div.appendChild(tip);
|
||||
}
|
||||
|
@ -335,15 +305,12 @@ show = (tip, x, y)=>
|
|||
*
|
||||
* Destroys the handler and all its resources and DOM nodes.
|
||||
*/
|
||||
destroy = ()=>
|
||||
{
|
||||
if (!this.destroyed)
|
||||
{
|
||||
destroy = () => {
|
||||
if (!this.destroyed) {
|
||||
this.graph.removeMouseListener(this);
|
||||
mxEvent.release(this.div);
|
||||
|
||||
if (this.div != null && this.div.parentNode != null)
|
||||
{
|
||||
if (this.div != null && this.div.parentNode != null) {
|
||||
this.div.parentNode.removeChild(this.div);
|
||||
}
|
||||
|
||||
|
@ -351,3 +318,6 @@ destroy = ()=>
|
|||
this.div = null;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxTooltipHandler;
|
||||
|
|
|
@ -3,7 +3,11 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxCell from "FIXME";
|
||||
import mxObjectCodec from "./mxObjectCodec";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxCellCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxCellCodec
|
||||
*
|
||||
|
@ -43,26 +47,27 @@
|
|||
* mxCodecRegistry.addAlias('CustomCell', 'mxCell');
|
||||
* (end)
|
||||
*/
|
||||
var codec = new mxObjectCodec(new mxCell(),
|
||||
constructor() {
|
||||
super(new mxCell(),
|
||||
['children', 'edges', 'overlays', 'mxTransient'],
|
||||
['parent', 'source', 'target']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Function: isCellCodec
|
||||
*
|
||||
* Returns true since this is a cell codec.
|
||||
*/
|
||||
codec.isCellCodec = ()=>
|
||||
{
|
||||
isCellCodec = () => {
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Overidden to disable conversion of value to number.
|
||||
*/
|
||||
codec.isNumericAttribute = (dec, attr, obj)=>
|
||||
{
|
||||
return attr.nodeName !== 'value' && isNumericAttribute.apply(this, arguments);
|
||||
isNumericAttribute = (dec, attr, obj) => {
|
||||
return attr.nodeName !== 'value' &&
|
||||
super.isNumericAttribute(dec, attr, obj);
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -70,11 +75,10 @@
|
|||
*
|
||||
* Excludes user objects that are XML nodes.
|
||||
*/
|
||||
codec.isExcluded = (obj, attr, value, isWrite)=>
|
||||
{
|
||||
return isExcluded.apply(this, arguments) ||
|
||||
(isWrite && attr == 'value' &&
|
||||
value.nodeType == mxConstants.NODETYPE_ELEMENT);
|
||||
isExcluded = (obj, attr, value, isWrite) => {
|
||||
return super.isExcluded(obj, attr, value, isWrite) ||
|
||||
(isWrite && attr === 'value' &&
|
||||
value.nodeType === mxConstants.NODETYPE_ELEMENT);
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -83,10 +87,8 @@
|
|||
* Encodes an <mxCell> and wraps the XML up inside the
|
||||
* XML of the user object (inversion).
|
||||
*/
|
||||
codec.afterEncode = (enc, obj, node)=>
|
||||
{
|
||||
if (obj.value != null && obj.value.nodeType == mxConstants.NODETYPE_ELEMENT)
|
||||
{
|
||||
afterEncode = (enc, obj, node) => {
|
||||
if (obj.value != null && obj.value.nodeType === mxConstants.NODETYPE_ELEMENT) {
|
||||
// Wraps the graphical annotation up in the user object (inversion)
|
||||
// by putting the result of the default encoding into a clone of the
|
||||
// user object (node type 1) and returning this cloned user object.
|
||||
|
@ -110,26 +112,21 @@
|
|||
* Decodes an <mxCell> and uses the enclosing XML node as
|
||||
* the user object for the cell (inversion).
|
||||
*/
|
||||
codec.beforeDecode = (dec, node, obj)=>
|
||||
{
|
||||
beforeDecode = (dec, node, obj) => {
|
||||
var inner = node.cloneNode(true);
|
||||
var classname = this.getName();
|
||||
|
||||
if (node.nodeName != classname)
|
||||
{
|
||||
if (node.nodeName !== classname) {
|
||||
// Passes the inner graphical annotation node to the
|
||||
// object codec for further processing of the cell.
|
||||
var tmp = node.getElementsByTagName(classname)[0];
|
||||
|
||||
if (tmp != null && tmp.parentNode == node)
|
||||
{
|
||||
if (tmp != null && tmp.parentNode === node) {
|
||||
mxUtils.removeWhitespace(tmp, true);
|
||||
mxUtils.removeWhitespace(tmp, false);
|
||||
tmp.parentNode.removeChild(tmp);
|
||||
inner = tmp;
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
inner = null;
|
||||
}
|
||||
|
||||
|
@ -137,39 +134,31 @@
|
|||
obj.value = node.cloneNode(true);
|
||||
var id = obj.value.getAttribute('id');
|
||||
|
||||
if (id != null)
|
||||
{
|
||||
if (id != null) {
|
||||
obj.setId(id);
|
||||
obj.value.removeAttribute('id');
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
// Uses ID from XML file as ID for cell in model
|
||||
obj.setId(node.getAttribute('id'));
|
||||
}
|
||||
|
||||
// Preprocesses and removes all Id-references in order to use the
|
||||
// correct encoder (this) for the known references to cells (all).
|
||||
if (inner != null)
|
||||
{
|
||||
for (var i = 0; i < this.idrefs.length; i++)
|
||||
{
|
||||
if (inner != null) {
|
||||
for (var i = 0; i < this.idrefs.length; i++) {
|
||||
var attr = this.idrefs[i];
|
||||
var ref = inner.getAttribute(attr);
|
||||
|
||||
if (ref != null)
|
||||
{
|
||||
if (ref != null) {
|
||||
inner.removeAttribute(attr);
|
||||
var object = dec.objects[ref] || dec.lookup(ref);
|
||||
|
||||
if (object == null)
|
||||
{
|
||||
if (object == null) {
|
||||
// Needs to decode forward reference
|
||||
var element = dec.getElementById(ref);
|
||||
|
||||
if (element != null)
|
||||
{
|
||||
if (element != null) {
|
||||
var decoder = mxCodecRegistry.codecs[element.nodeName] || this;
|
||||
object = decoder.decode(dec, element);
|
||||
}
|
||||
|
@ -182,6 +171,7 @@
|
|||
|
||||
return inner;
|
||||
};
|
||||
}
|
||||
|
||||
mxCodecRegistry.register(new mxCellCodec());
|
||||
export default mxCellCodec;
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxChildChange from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxChildChangeCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxChildChangeCodec
|
||||
|
@ -48,7 +52,7 @@ class mxChildChangeCodec extends mxObjectCodec {
|
|||
* Excludes references to parent or previous if not in the model.
|
||||
*/
|
||||
isExcluded = (obj, attr, value, write) => {
|
||||
return isExcluded.apply(this, arguments) ||
|
||||
return super.isExcluded(obj, attr, value, write) ||
|
||||
(write && value != null && (attr === 'previous' ||
|
||||
attr === 'parent') && !obj.model.contains(value));
|
||||
};
|
||||
|
|
|
@ -2,6 +2,38 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxUtils from "../util/mxUtils";
|
||||
|
||||
class mxCodec {
|
||||
/**
|
||||
* Variable: document
|
||||
*
|
||||
* The owner document of the codec.
|
||||
*/
|
||||
document = null;
|
||||
|
||||
/**
|
||||
* Variable: objects
|
||||
*
|
||||
* Maps from IDs to objects.
|
||||
*/
|
||||
objects = null;
|
||||
|
||||
/**
|
||||
* Variable: elements
|
||||
*
|
||||
* Lookup table for resolving IDs to elements.
|
||||
*/
|
||||
elements = null;
|
||||
|
||||
/**
|
||||
* Variable: encodeDefaults
|
||||
*
|
||||
* Specifies if default values should be encoded. Default is false.
|
||||
*/
|
||||
encodeDefaults = false;
|
||||
|
||||
/**
|
||||
* Class: mxCodec
|
||||
*
|
||||
|
@ -111,41 +143,11 @@
|
|||
* If no document is specified then a new document is created
|
||||
* using <mxUtils.createXmlDocument>.
|
||||
*/
|
||||
function mxCodec(document)
|
||||
{
|
||||
constructor(document) {
|
||||
this.document = document || mxUtils.createXmlDocument();
|
||||
this.objects = [];
|
||||
};
|
||||
|
||||
/**
|
||||
* Variable: document
|
||||
*
|
||||
* The owner document of the codec.
|
||||
*/
|
||||
document = null;
|
||||
|
||||
/**
|
||||
* Variable: objects
|
||||
*
|
||||
* Maps from IDs to objects.
|
||||
*/
|
||||
objects = null;
|
||||
|
||||
/**
|
||||
* Variable: elements
|
||||
*
|
||||
* Lookup table for resolving IDs to elements.
|
||||
*/
|
||||
elements = null;
|
||||
|
||||
/**
|
||||
* Variable: encodeDefaults
|
||||
*
|
||||
* Specifies if default values should be encoded. Default is false.
|
||||
*/
|
||||
encodeDefaults = false;
|
||||
|
||||
|
||||
/**
|
||||
* Function: putObject
|
||||
*
|
||||
|
@ -156,8 +158,7 @@ encodeDefaults = false;
|
|||
* 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;
|
||||
|
@ -171,24 +172,19 @@ putObject = (id, obj)=>
|
|||
* object. If no object is found, then the element with the respective ID
|
||||
* from the document is parsed using <decode>.
|
||||
*/
|
||||
getObject = (id)=>
|
||||
{
|
||||
getObject = (id) => {
|
||||
var obj = null;
|
||||
|
||||
if (id != null)
|
||||
{
|
||||
if (id != null) {
|
||||
obj = this.objects[id];
|
||||
|
||||
if (obj == null)
|
||||
{
|
||||
if (obj == null) {
|
||||
obj = this.lookup(id);
|
||||
|
||||
if (obj == null)
|
||||
{
|
||||
if (obj == null) {
|
||||
var node = this.getElementById(id);
|
||||
|
||||
if (node != null)
|
||||
{
|
||||
if (node != null) {
|
||||
obj = this.decode(node);
|
||||
}
|
||||
}
|
||||
|
@ -218,8 +214,7 @@ getObject = (id)=>
|
|||
*
|
||||
* id - ID of the object to be returned.
|
||||
*/
|
||||
lookup = (id)=>
|
||||
{
|
||||
lookup = (id) => {
|
||||
return null;
|
||||
};
|
||||
|
||||
|
@ -232,8 +227,7 @@ lookup = (id)=>
|
|||
*
|
||||
* id - String that contains the ID.
|
||||
*/
|
||||
getElementById = (id)=>
|
||||
{
|
||||
getElementById = (id) => {
|
||||
this.updateElements();
|
||||
|
||||
return this.elements[id];
|
||||
|
@ -248,14 +242,11 @@ getElementById = (id)=>
|
|||
*
|
||||
* id - String that contains the ID.
|
||||
*/
|
||||
updateElements = ()=>
|
||||
{
|
||||
if (this.elements == null)
|
||||
{
|
||||
this.elements = new Object();
|
||||
updateElements = () => {
|
||||
if (this.elements == null) {
|
||||
this.elements = {};
|
||||
|
||||
if (this.document.documentElement != null)
|
||||
{
|
||||
if (this.document.documentElement != null) {
|
||||
this.addElement(this.document.documentElement);
|
||||
}
|
||||
}
|
||||
|
@ -266,20 +257,14 @@ updateElements = ()=>
|
|||
*
|
||||
* Adds the given element to <elements> if it has an ID.
|
||||
*/
|
||||
addElement = (node)=>
|
||||
{
|
||||
if (node.nodeType == mxConstants.NODETYPE_ELEMENT)
|
||||
{
|
||||
addElement = (node) => {
|
||||
if (node.nodeType === mxConstants.NODETYPE_ELEMENT) {
|
||||
var id = node.getAttribute('id');
|
||||
|
||||
if (id != null)
|
||||
{
|
||||
if (this.elements[id] == null)
|
||||
{
|
||||
if (id != null) {
|
||||
if (this.elements[id] == null) {
|
||||
this.elements[id] = node;
|
||||
}
|
||||
else if (this.elements[id] != node)
|
||||
{
|
||||
} else if (this.elements[id] !== node) {
|
||||
throw new Error(id + ': Duplicate ID');
|
||||
}
|
||||
}
|
||||
|
@ -287,8 +272,7 @@ addElement = (node)=>
|
|||
|
||||
node = node.firstChild;
|
||||
|
||||
while (node != null)
|
||||
{
|
||||
while (node != null) {
|
||||
this.addElement(node);
|
||||
node = node.nextSibling;
|
||||
}
|
||||
|
@ -307,25 +291,20 @@ addElement = (node)=>
|
|||
*
|
||||
* obj - Object to return the ID for.
|
||||
*/
|
||||
getId = (obj)=>
|
||||
{
|
||||
getId = (obj) => {
|
||||
var id = null;
|
||||
|
||||
if (obj != null)
|
||||
{
|
||||
if (obj != null) {
|
||||
id = this.reference(obj);
|
||||
|
||||
if (id == null && obj instanceof mxCell)
|
||||
{
|
||||
if (id == null && obj instanceof mxCell) {
|
||||
id = obj.getId();
|
||||
|
||||
if (id == null)
|
||||
{
|
||||
if (id == null) {
|
||||
// Uses an on-the-fly Id
|
||||
id = mxCellPath.create(obj);
|
||||
|
||||
if (id.length == 0)
|
||||
{
|
||||
if (id.length === 0) {
|
||||
id = 'root';
|
||||
}
|
||||
}
|
||||
|
@ -356,8 +335,7 @@ getId = (obj)=>
|
|||
*
|
||||
* obj - Object whose ID should be returned.
|
||||
*/
|
||||
reference = (obj)=>
|
||||
{
|
||||
reference = (obj) => {
|
||||
return null;
|
||||
};
|
||||
|
||||
|
@ -371,26 +349,18 @@ reference = (obj)=>
|
|||
*
|
||||
* obj - Object to be encoded.
|
||||
*/
|
||||
encode = (obj)=>
|
||||
{
|
||||
encode = (obj) => {
|
||||
var node = null;
|
||||
|
||||
if (obj != null && obj.constructor != null)
|
||||
{
|
||||
if (obj != null && obj.constructor != null) {
|
||||
var enc = mxCodecRegistry.getCodec(obj.constructor);
|
||||
|
||||
if (enc != null)
|
||||
{
|
||||
if (enc != null) {
|
||||
node = enc.encode(this, obj);
|
||||
}
|
||||
else
|
||||
{
|
||||
if (mxUtils.isNode(obj))
|
||||
{
|
||||
} else {
|
||||
if (mxUtils.isNode(obj)) {
|
||||
node = mxUtils.importNode(this.document, obj, true);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
mxLog.warn('mxCodec.encode: No codec for ' + mxUtils.getFunctionName(obj.constructor));
|
||||
}
|
||||
}
|
||||
|
@ -415,32 +385,24 @@ encode = (obj)=>
|
|||
* node - XML node to be decoded.
|
||||
* into - Optional object to be decodec into.
|
||||
*/
|
||||
decode = (node, into)=>
|
||||
{
|
||||
decode = (node, into) => {
|
||||
this.updateElements();
|
||||
var obj = null;
|
||||
|
||||
if (node != null && node.nodeType == mxConstants.NODETYPE_ELEMENT)
|
||||
{
|
||||
if (node != null && node.nodeType === mxConstants.NODETYPE_ELEMENT) {
|
||||
var ctor = null;
|
||||
|
||||
try
|
||||
{
|
||||
try {
|
||||
ctor = window[node.nodeName];
|
||||
}
|
||||
catch (err)
|
||||
{
|
||||
} catch (err) {
|
||||
// ignore
|
||||
}
|
||||
|
||||
var dec = mxCodecRegistry.getCodec(ctor);
|
||||
|
||||
if (dec != null)
|
||||
{
|
||||
if (dec != null) {
|
||||
obj = dec.decode(this, node, into);
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
obj = node.cloneNode(true);
|
||||
obj.removeAttribute('as');
|
||||
}
|
||||
|
@ -469,16 +431,13 @@ decode = (node, into)=>
|
|||
* 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)
|
||||
{
|
||||
if (includeChildren == null || includeChildren) {
|
||||
var childCount = cell.getChildCount();
|
||||
|
||||
for (var i = 0; i < childCount; i++)
|
||||
{
|
||||
for (var i = 0; i < childCount; i++) {
|
||||
this.encodeCell(cell.getChildAt(i), node);
|
||||
}
|
||||
}
|
||||
|
@ -491,10 +450,8 @@ encodeCell = (cell, node, includeChildren)=>
|
|||
* <mxCellCodec.isCellCodec> to check if the codec is of the
|
||||
* given type.
|
||||
*/
|
||||
isCellCodec = (codec)=>
|
||||
{
|
||||
if (codec != null && typeof(codec.isCellCodec) == 'function')
|
||||
{
|
||||
isCellCodec = (codec) => {
|
||||
if (codec != null && typeof (codec.isCellCodec) == 'function') {
|
||||
return codec.isCellCodec();
|
||||
}
|
||||
|
||||
|
@ -518,13 +475,11 @@ isCellCodec = (codec)=>
|
|||
* and insertEdge on the parent and terminals, respectively.
|
||||
* Default is true.
|
||||
*/
|
||||
decodeCell = (node, restoreStructures)=>
|
||||
{
|
||||
decodeCell = (node, restoreStructures) => {
|
||||
restoreStructures = (restoreStructures != null) ? restoreStructures : true;
|
||||
var cell = null;
|
||||
|
||||
if (node != null && node.nodeType == mxConstants.NODETYPE_ELEMENT)
|
||||
{
|
||||
if (node != null && node.nodeType === mxConstants.NODETYPE_ELEMENT) {
|
||||
// Tries to find a codec for the given node name. If that does
|
||||
// not return a codec then the node is the user object (an XML node
|
||||
// that contains the mxCell, aka inversion).
|
||||
|
@ -533,26 +488,22 @@ decodeCell = (node, restoreStructures)=>
|
|||
// Tries to find the codec for the cell inside the user object.
|
||||
// This assumes all node names inside the user object are either
|
||||
// not registered or they correspond to a class for cells.
|
||||
if (!this.isCellCodec(decoder))
|
||||
{
|
||||
if (!this.isCellCodec(decoder)) {
|
||||
var child = node.firstChild;
|
||||
|
||||
while (child != null && !this.isCellCodec(decoder))
|
||||
{
|
||||
while (child != null && !this.isCellCodec(decoder)) {
|
||||
decoder = mxCodecRegistry.getCodec(child.nodeName);
|
||||
child = child.nextSibling;
|
||||
}
|
||||
}
|
||||
|
||||
if (!this.isCellCodec(decoder))
|
||||
{
|
||||
if (!this.isCellCodec(decoder)) {
|
||||
decoder = mxCodecRegistry.getCodec(mxCell);
|
||||
}
|
||||
|
||||
cell = decoder.decode(this, node);
|
||||
|
||||
if (restoreStructures)
|
||||
{
|
||||
if (restoreStructures) {
|
||||
this.insertIntoGraph(cell);
|
||||
}
|
||||
}
|
||||
|
@ -565,8 +516,7 @@ decodeCell = (node, restoreStructures)=>
|
|||
*
|
||||
* Inserts the given cell into its parent and terminal cells.
|
||||
*/
|
||||
insertIntoGraph = (cell)=>
|
||||
{
|
||||
insertIntoGraph = (cell) => {
|
||||
var parent = cell.parent;
|
||||
var source = cell.getTerminal(true);
|
||||
var target = cell.getTerminal(false);
|
||||
|
@ -576,25 +526,19 @@ insertIntoGraph = (cell)=>
|
|||
cell.setTerminal(null, true);
|
||||
cell.parent = null;
|
||||
|
||||
if (parent != null)
|
||||
{
|
||||
if (parent == cell)
|
||||
{
|
||||
if (parent != null) {
|
||||
if (parent === cell) {
|
||||
throw new Error(parent.id + ': Self Reference');
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
parent.insert(cell);
|
||||
}
|
||||
}
|
||||
|
||||
if (source != null)
|
||||
{
|
||||
if (source != null) {
|
||||
source.insertEdge(cell, true);
|
||||
}
|
||||
|
||||
if (target != null)
|
||||
{
|
||||
if (target != null) {
|
||||
target.insertEdge(cell, false);
|
||||
}
|
||||
};
|
||||
|
@ -612,10 +556,11 @@ insertIntoGraph = (cell)=>
|
|||
* attributes - Attributename to be set.
|
||||
* value - New value of the attribute.
|
||||
*/
|
||||
setAttribute = (node, attribute, value)=>
|
||||
{
|
||||
if (attribute != null && value != null)
|
||||
{
|
||||
setAttribute = (node, attribute, value) => {
|
||||
if (attribute != null && value != null) {
|
||||
node.setAttribute(attribute, value);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxCodec;
|
||||
|
|
|
@ -2,8 +2,11 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
var mxCodecRegistry =
|
||||
{
|
||||
|
||||
import mxUtils from "../util/mxUtils";
|
||||
import mxObjectCodec from "./mxObjectCodec";
|
||||
|
||||
var mxCodecRegistry = {
|
||||
/**
|
||||
* Class: mxCodecRegistry
|
||||
*
|
||||
|
@ -61,17 +64,14 @@ var mxCodecRegistry =
|
|||
*
|
||||
* codec - <mxObjectCodec> to be registered.
|
||||
*/
|
||||
register: (codec)=>
|
||||
{
|
||||
if (codec != null)
|
||||
{
|
||||
register: (codec) => {
|
||||
if (codec != null) {
|
||||
var name = codec.getName();
|
||||
mxCodecRegistry.codecs[name] = codec;
|
||||
|
||||
var classname = mxUtils.getFunctionName(codec.template.constructor);
|
||||
|
||||
if (classname != name)
|
||||
{
|
||||
if (classname !== name) {
|
||||
mxCodecRegistry.addAlias(classname, name);
|
||||
}
|
||||
}
|
||||
|
@ -84,8 +84,7 @@ var mxCodecRegistry =
|
|||
*
|
||||
* Adds an alias for mapping a classname to a codecname.
|
||||
*/
|
||||
addAlias: (classname, codecname)=>
|
||||
{
|
||||
addAlias: (classname, codecname) => {
|
||||
mxCodecRegistry.aliases[classname] = codecname;
|
||||
},
|
||||
|
||||
|
@ -99,17 +98,14 @@ var mxCodecRegistry =
|
|||
*
|
||||
* ctor - JavaScript constructor function.
|
||||
*/
|
||||
getCodec: (ctor)=>
|
||||
{
|
||||
getCodec: (ctor) => {
|
||||
var codec = null;
|
||||
|
||||
if (ctor != null)
|
||||
{
|
||||
if (ctor != null) {
|
||||
var name = mxUtils.getFunctionName(ctor);
|
||||
var tmp = mxCodecRegistry.aliases[name];
|
||||
|
||||
if (tmp != null)
|
||||
{
|
||||
if (tmp != null) {
|
||||
name = tmp;
|
||||
}
|
||||
|
||||
|
@ -117,15 +113,11 @@ var mxCodecRegistry =
|
|||
|
||||
// Registers a new default codec for the given constructor
|
||||
// if no codec has been previously defined.
|
||||
if (codec == null)
|
||||
{
|
||||
try
|
||||
{
|
||||
if (codec == null) {
|
||||
try {
|
||||
codec = new mxObjectCodec(new ctor());
|
||||
mxCodecRegistry.register(codec);
|
||||
}
|
||||
catch (e)
|
||||
{
|
||||
} catch (e) {
|
||||
// ignore
|
||||
}
|
||||
}
|
||||
|
@ -133,5 +125,6 @@ var mxCodecRegistry =
|
|||
|
||||
return codec;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
export default mxCodecRegistry;
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxDefaultKeyHandler from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxDefaultKeyHandlerCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxDefaultKeyHandlerCodec
|
||||
|
|
|
@ -3,6 +3,9 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxDefaultPopupMenu from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxDefaultPopupMenuCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxDefaultPopupMenuCodec
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxDefaultToolbar from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxDefaultToolbarCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxDefaultToolbarCodec
|
||||
|
|
|
@ -2,8 +2,13 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
mxCodecRegistry.register(()=>
|
||||
{
|
||||
|
||||
import mxEditor from "FIXME";
|
||||
import mxWindow from "FIXME";
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxEditorCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxEditorCodec
|
||||
*
|
||||
|
@ -20,9 +25,11 @@ mxCodecRegistry.register(()=>
|
|||
* - graphContainer
|
||||
* - toolbarContainer
|
||||
*/
|
||||
var codec = new mxObjectCodec(new mxEditor(),
|
||||
constructor() {
|
||||
super(new mxEditor(),
|
||||
['modified', 'lastSnapshot', 'ignoredChanges',
|
||||
'undoManager', 'graphContainer', 'toolbarContainer']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Function: beforeDecode
|
||||
|
@ -78,13 +85,11 @@ mxCodecRegistry.register(()=>
|
|||
* </ui>
|
||||
* (end)
|
||||
*/
|
||||
codec.afterDecode = (dec, node, obj)=>
|
||||
{
|
||||
afterDecode = (dec, node, obj) => {
|
||||
// Assigns the specified templates for edges
|
||||
var defaultEdge = node.getAttribute('defaultEdge');
|
||||
|
||||
if (defaultEdge != null)
|
||||
{
|
||||
if (defaultEdge != null) {
|
||||
node.removeAttribute('defaultEdge');
|
||||
obj.defaultEdge = obj.templates[defaultEdge];
|
||||
}
|
||||
|
@ -92,8 +97,7 @@ mxCodecRegistry.register(()=>
|
|||
// Assigns the specified templates for groups
|
||||
var defaultGroup = node.getAttribute('defaultGroup');
|
||||
|
||||
if (defaultGroup != null)
|
||||
{
|
||||
if (defaultGroup != null) {
|
||||
node.removeAttribute('defaultGroup');
|
||||
obj.defaultGroup = obj.templates[defaultGroup];
|
||||
}
|
||||
|
@ -106,20 +110,15 @@ mxCodecRegistry.register(()=>
|
|||
*
|
||||
* Overrides decode child to handle special child nodes.
|
||||
*/
|
||||
codec.decodeChild = (dec, child, obj)=>
|
||||
{
|
||||
if (child.nodeName == 'Array')
|
||||
{
|
||||
decodeChild = (dec, child, obj) => {
|
||||
if (child.nodeName === 'Array') {
|
||||
var role = child.getAttribute('as');
|
||||
|
||||
if (role == 'templates')
|
||||
{
|
||||
if (role === 'templates') {
|
||||
this.decodeTemplates(dec, child, obj);
|
||||
return;
|
||||
}
|
||||
}
|
||||
else if (child.nodeName == 'ui')
|
||||
{
|
||||
} else if (child.nodeName === 'ui') {
|
||||
this.decodeUi(dec, child, obj);
|
||||
return;
|
||||
}
|
||||
|
@ -132,29 +131,22 @@ mxCodecRegistry.register(()=>
|
|||
*
|
||||
* Decodes the ui elements from the given node.
|
||||
*/
|
||||
codec.decodeUi = (dec, node, editor)=>
|
||||
{
|
||||
decodeUi = (dec, node, editor) => {
|
||||
var tmp = node.firstChild;
|
||||
while (tmp != null)
|
||||
{
|
||||
if (tmp.nodeName == 'add')
|
||||
{
|
||||
while (tmp != null) {
|
||||
if (tmp.nodeName === 'add') {
|
||||
var as = tmp.getAttribute('as');
|
||||
var elt = tmp.getAttribute('element');
|
||||
var style = tmp.getAttribute('style');
|
||||
var element = null;
|
||||
|
||||
if (elt != null)
|
||||
{
|
||||
if (elt != null) {
|
||||
element = document.getElementById(elt);
|
||||
|
||||
if (element != null && style != null)
|
||||
{
|
||||
if (element != null && style != null) {
|
||||
element.style.cssText += ';' + style;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
} else {
|
||||
var x = parseInt(tmp.getAttribute('x'));
|
||||
var y = parseInt(tmp.getAttribute('y'));
|
||||
var width = tmp.getAttribute('width');
|
||||
|
@ -170,33 +162,20 @@ mxCodecRegistry.register(()=>
|
|||
}
|
||||
|
||||
// TODO: Make more generic
|
||||
if (as == 'graph')
|
||||
{
|
||||
if (as === 'graph') {
|
||||
editor.setGraphContainer(element);
|
||||
}
|
||||
else if (as == 'toolbar')
|
||||
{
|
||||
} else if (as === 'toolbar') {
|
||||
editor.setToolbarContainer(element);
|
||||
}
|
||||
else if (as == 'title')
|
||||
{
|
||||
} else if (as === 'title') {
|
||||
editor.setTitleContainer(element);
|
||||
}
|
||||
else if (as == 'status')
|
||||
{
|
||||
} else if (as === 'status') {
|
||||
editor.setStatusContainer(element);
|
||||
}
|
||||
else if (as == 'map')
|
||||
{
|
||||
} else if (as === 'map') {
|
||||
editor.setMapContainer(element);
|
||||
}
|
||||
}
|
||||
else if (tmp.nodeName == 'resource')
|
||||
{
|
||||
} else if (tmp.nodeName === 'resource') {
|
||||
mxResources.add(tmp.getAttribute('basename'));
|
||||
}
|
||||
else if (tmp.nodeName == 'stylesheet')
|
||||
{
|
||||
} else if (tmp.nodeName === 'stylesheet') {
|
||||
mxClient.link('stylesheet', tmp.getAttribute('name'));
|
||||
}
|
||||
|
||||
|
@ -209,26 +188,21 @@ mxCodecRegistry.register(()=>
|
|||
*
|
||||
* Decodes the cells from the given node as templates.
|
||||
*/
|
||||
codec.decodeTemplates = (dec, node, editor)=>
|
||||
{
|
||||
if (editor.templates == null)
|
||||
{
|
||||
decodeTemplates = (dec, node, editor) => {
|
||||
if (editor.templates == null) {
|
||||
editor.templates = [];
|
||||
}
|
||||
|
||||
var children = mxUtils.getChildNodes(node);
|
||||
for (var j=0; j<children.length; j++)
|
||||
{
|
||||
for (var j = 0; j < children.length; j++) {
|
||||
var name = children[j].getAttribute('as');
|
||||
var child = children[j].firstChild;
|
||||
|
||||
while (child != null && child.nodeType != 1)
|
||||
{
|
||||
while (child != null && child.nodeType !== 1) {
|
||||
child = child.nextSibling;
|
||||
}
|
||||
|
||||
if (child != null)
|
||||
{
|
||||
if (child != null) {
|
||||
// LATER: Only single cells means you need
|
||||
// to group multiple cells within another
|
||||
// cell. This should be changed to support
|
||||
|
@ -238,8 +212,7 @@ mxCodecRegistry.register(()=>
|
|||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// Returns the codec into the registry
|
||||
return codec;
|
||||
|
||||
}());
|
||||
mxCodecRegistry.register(new mxEditorCodec());
|
||||
export default mxEditorCodec;
|
||||
|
|
|
@ -2,6 +2,17 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxValueChange from "FIXME";
|
||||
import mxStyleChange from "FIXME";
|
||||
import mxGeometryChange from "FIXME";
|
||||
import mxCollapseChange from "FIXME";
|
||||
import mxVisibleChange from "FIXME";
|
||||
import mxCellAttributeChange from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxGenericChangeCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxGenericChangeCodec
|
||||
*
|
||||
|
@ -29,31 +40,27 @@
|
|||
* obj - An instance of the change object.
|
||||
* variable - The fieldname for the change data.
|
||||
*/
|
||||
var mxGenericChangeCodec = (obj, variable)=>
|
||||
{
|
||||
var codec = new mxObjectCodec(obj, ['model', 'previous'], ['cell']);
|
||||
constructor(obj, variable) {
|
||||
super(obj, ['model', 'previous'], ['cell']);
|
||||
this.variable = variable;
|
||||
}
|
||||
|
||||
/**
|
||||
* Function: afterDecode
|
||||
*
|
||||
* Restores the state by assigning the previous value.
|
||||
*/
|
||||
codec.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))
|
||||
{
|
||||
if (mxUtils.isNode(obj.cell)) {
|
||||
obj.cell = dec.decodeCell(obj.cell, false);
|
||||
}
|
||||
|
||||
obj.previous = obj[variable];
|
||||
|
||||
obj.previous = obj[this.variable];
|
||||
return obj;
|
||||
};
|
||||
|
||||
return codec;
|
||||
};
|
||||
}
|
||||
|
||||
// Registers the codecs
|
||||
mxCodecRegistry.register(mxGenericChangeCodec(new mxValueChange(), 'value'));
|
||||
|
|
|
@ -2,8 +2,11 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
mxCodecRegistry.register(()=>
|
||||
{
|
||||
|
||||
import mxGraph from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxGraphCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxGraphCodec
|
||||
*
|
||||
|
@ -21,8 +24,11 @@ mxCodecRegistry.register(()=>
|
|||
* - editor
|
||||
* - selection
|
||||
*/
|
||||
return new mxObjectCodec(new mxGraph(),
|
||||
['graphListeners', 'eventListeners', 'view', 'container',
|
||||
constructor() {
|
||||
super(new mxGraph(), ['graphListeners', 'eventListeners', 'view', 'container',
|
||||
'cellRenderer', 'editor', 'selection']);
|
||||
}
|
||||
}
|
||||
|
||||
}());
|
||||
mxCodecRegistry.register(new mxGraphCodec());
|
||||
export default mxGraphCodec;
|
||||
|
|
|
@ -2,8 +2,12 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
mxCodecRegistry.register(()=>
|
||||
{
|
||||
|
||||
import mxGraphView from "FIXME";
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxGraphViewCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxGraphViewCodec
|
||||
*
|
||||
|
@ -14,7 +18,9 @@ mxCodecRegistry.register(()=>
|
|||
* the graph, that is, it contains absolute coordinates with
|
||||
* computed perimeters, edge styles and cell styles.
|
||||
*/
|
||||
var codec = new mxObjectCodec(new mxGraphView());
|
||||
constructor() {
|
||||
super(new mxGraphView())
|
||||
}
|
||||
|
||||
/**
|
||||
* Function: encode
|
||||
|
@ -23,8 +29,7 @@ mxCodecRegistry.register(()=>
|
|||
* starting at the model's root. This returns the
|
||||
* top-level graph node of the recursive encoding.
|
||||
*/
|
||||
codec.encode = (enc, view)=>
|
||||
{
|
||||
encode = (enc, view) => {
|
||||
return this.encodeCell(enc, view,
|
||||
view.graph.getModel().getRoot());
|
||||
};
|
||||
|
@ -49,60 +54,44 @@ mxCodecRegistry.register(()=>
|
|||
* values from the cell style are added as attribute
|
||||
* values to the node.
|
||||
*/
|
||||
codec.encodeCell = (enc, view, cell)=>
|
||||
{
|
||||
encodeCell = (enc, view, cell) => {
|
||||
var model = view.graph.getModel();
|
||||
var state = view.getState(cell);
|
||||
var parent = model.getParent(cell);
|
||||
|
||||
if (parent == null || state != null)
|
||||
{
|
||||
if (parent == null || state != null) {
|
||||
var childCount = model.getChildCount(cell);
|
||||
var geo = view.graph.getCellGeometry(cell);
|
||||
var name = null;
|
||||
|
||||
if (parent == model.getRoot())
|
||||
{
|
||||
if (parent === model.getRoot()) {
|
||||
name = 'layer';
|
||||
}
|
||||
else if (parent == null)
|
||||
{
|
||||
} else if (parent == null) {
|
||||
name = 'graph';
|
||||
}
|
||||
else if (model.isEdge(cell))
|
||||
{
|
||||
} else if (model.isEdge(cell)) {
|
||||
name = 'edge';
|
||||
}
|
||||
else if (childCount > 0 && geo != null)
|
||||
{
|
||||
} else if (childCount > 0 && geo != null) {
|
||||
name = 'group';
|
||||
}
|
||||
else if (model.isVertex(cell))
|
||||
{
|
||||
} else if (model.isVertex(cell)) {
|
||||
name = 'vertex';
|
||||
}
|
||||
|
||||
if (name != null)
|
||||
{
|
||||
if (name != null) {
|
||||
var node = enc.document.createElement(name);
|
||||
var lab = view.graph.getLabel(cell);
|
||||
|
||||
if (lab != null)
|
||||
{
|
||||
if (lab != null) {
|
||||
node.setAttribute('label', view.graph.getLabel(cell));
|
||||
|
||||
if (view.graph.isHtmlLabel(cell))
|
||||
{
|
||||
if (view.graph.isHtmlLabel(cell)) {
|
||||
node.setAttribute('html', true);
|
||||
}
|
||||
}
|
||||
|
||||
if (parent == null)
|
||||
{
|
||||
if (parent == null) {
|
||||
var bounds = view.getGraphBounds();
|
||||
|
||||
if (bounds != null)
|
||||
{
|
||||
if (bounds != null) {
|
||||
node.setAttribute('x', Math.round(bounds.x));
|
||||
node.setAttribute('y', Math.round(bounds.y));
|
||||
node.setAttribute('width', Math.round(bounds.width));
|
||||
|
@ -110,25 +99,20 @@ mxCodecRegistry.register(()=>
|
|||
}
|
||||
|
||||
node.setAttribute('scale', view.scale);
|
||||
}
|
||||
else if (state != null && geo != null)
|
||||
{
|
||||
} else if (state != null && geo != null) {
|
||||
// Writes each key, value in the style pair to an attribute
|
||||
for (var i in state.style)
|
||||
{
|
||||
for (var i in state.style) {
|
||||
var value = state.style[i];
|
||||
|
||||
// Tries to turn objects and functions into strings
|
||||
if (typeof (value) == 'function' &&
|
||||
typeof(value) == 'object')
|
||||
{
|
||||
typeof (value) == 'object') {
|
||||
value = mxStyleRegistry.getName(value);
|
||||
}
|
||||
|
||||
if (value != null &&
|
||||
typeof (value) != 'function' &&
|
||||
typeof(value) != 'object')
|
||||
{
|
||||
typeof (value) != 'object') {
|
||||
node.setAttribute(i, value);
|
||||
}
|
||||
}
|
||||
|
@ -136,12 +120,10 @@ mxCodecRegistry.register(()=>
|
|||
var abs = state.absolutePoints;
|
||||
|
||||
// Writes the list of points into one attribute
|
||||
if (abs != null && abs.length > 0)
|
||||
{
|
||||
if (abs != null && abs.length > 0) {
|
||||
var pts = Math.round(abs[0].x) + ',' + Math.round(abs[0].y);
|
||||
|
||||
for (var i=1; i<abs.length; i++)
|
||||
{
|
||||
for (var i = 1; i < abs.length; i++) {
|
||||
pts += ' ' + Math.round(abs[i].x) + ',' +
|
||||
Math.round(abs[i].y);
|
||||
}
|
||||
|
@ -150,8 +132,7 @@ mxCodecRegistry.register(()=>
|
|||
}
|
||||
|
||||
// Writes the bounds into 4 attributes
|
||||
else
|
||||
{
|
||||
else {
|
||||
node.setAttribute('x', Math.round(state.x));
|
||||
node.setAttribute('y', Math.round(state.y));
|
||||
node.setAttribute('width', Math.round(state.width));
|
||||
|
@ -161,37 +142,30 @@ mxCodecRegistry.register(()=>
|
|||
var offset = state.absoluteOffset;
|
||||
|
||||
// Writes the offset into 2 attributes
|
||||
if (offset != null)
|
||||
{
|
||||
if (offset.x != 0)
|
||||
{
|
||||
if (offset != null) {
|
||||
if (offset.x !== 0) {
|
||||
node.setAttribute('dx', Math.round(offset.x));
|
||||
}
|
||||
|
||||
if (offset.y != 0)
|
||||
{
|
||||
if (offset.y !== 0) {
|
||||
node.setAttribute('dy', Math.round(offset.y));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (var i=0; i<childCount; i++)
|
||||
{
|
||||
for (var i = 0; i < childCount; i++) {
|
||||
var childNode = this.encodeCell(enc,
|
||||
view, model.getChildAt(cell, i));
|
||||
|
||||
if (childNode != null)
|
||||
{
|
||||
if (childNode != null) {
|
||||
node.appendChild(childNode);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return node;
|
||||
};
|
||||
}
|
||||
|
||||
// Returns the codec into the registry
|
||||
return codec;
|
||||
|
||||
}());
|
||||
mxCodecRegistry.register(new mxGraphViewCodec());
|
||||
export default mxGraphViewCodec;
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxGraphModel from "FIXME";
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxModelCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxModelCodec
|
||||
|
@ -70,4 +74,3 @@ class mxModelCodec extends mxObjectCodec {
|
|||
|
||||
mxCodecRegistry.register(new mxModelCodec());
|
||||
export default mxModelCodec;
|
||||
|
||||
|
|
|
@ -62,7 +62,7 @@ class mxObjectCodec {
|
|||
* Consider the following example.
|
||||
*
|
||||
* (code)
|
||||
* var obj = new Object();
|
||||
* var obj = {};
|
||||
* obj.foo = "Foo";
|
||||
* obj.bar = "Bar";
|
||||
* (end)
|
||||
|
@ -232,7 +232,7 @@ class mxObjectCodec {
|
|||
* The argument is created as follows:
|
||||
*
|
||||
* (code)
|
||||
* var mapping = new Object();
|
||||
* var mapping = {};
|
||||
* mapping['variableName'] = 'attribute-name';
|
||||
* (end)
|
||||
*
|
||||
|
@ -252,7 +252,7 @@ class mxObjectCodec {
|
|||
this.idrefs = (idrefs != null) ? idrefs : [];
|
||||
this.mapping = (mapping != null) ? mapping : [];
|
||||
|
||||
this.reverse = new Object();
|
||||
this.reverse = {};
|
||||
|
||||
for (var i in this.mapping) {
|
||||
this.reverse[this.mapping[i]] = i;
|
||||
|
@ -616,11 +616,11 @@ class mxObjectCodec {
|
|||
*/
|
||||
isNumericAttribute = (dec, attr, obj) => {
|
||||
// Handles known numeric attributes for generic objects
|
||||
var result = (obj.constructor == mxGeometry &&
|
||||
(attr.name == 'x' || attr.name == 'y' ||
|
||||
attr.name == 'width' || attr.name == 'height')) ||
|
||||
(obj.constructor == mxPoint &&
|
||||
(attr.name == 'x' || attr.name == 'y')) ||
|
||||
var result = (obj.constructor === mxGeometry &&
|
||||
(attr.name === 'x' || attr.name === 'y' ||
|
||||
attr.name === 'width' || attr.name === 'height')) ||
|
||||
(obj.constructor === mxPoint &&
|
||||
(attr.name === 'x' || attr.name === 'y')) ||
|
||||
mxUtils.isNumeric(attr.value);
|
||||
|
||||
return result;
|
||||
|
@ -787,7 +787,7 @@ class mxObjectCodec {
|
|||
* obj - Objec to encode the attribute into.
|
||||
*/
|
||||
isIgnoredAttribute = (dec, attr, obj) => {
|
||||
return attr.nodeName == 'as' || attr.nodeName == 'id';
|
||||
return attr.nodeName === 'as' || attr.nodeName === 'id';
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -875,7 +875,7 @@ class mxObjectCodec {
|
|||
var template = this.getFieldTemplate(obj, fieldname, child);
|
||||
var value = null;
|
||||
|
||||
if (child.nodeName == 'add') {
|
||||
if (child.nodeName === 'add') {
|
||||
value = child.getAttribute('value');
|
||||
|
||||
if (value == null && mxObjectCodec.allowEval) {
|
||||
|
@ -925,7 +925,7 @@ class mxObjectCodec {
|
|||
* override this with the correct code to add an entry to an object.
|
||||
*/
|
||||
addObjectValue = (obj, fieldname, value, template) => {
|
||||
if (value != null && value != template) {
|
||||
if (value != null && value !== template) {
|
||||
if (fieldname != null && fieldname.length > 0) {
|
||||
obj[fieldname] = value;
|
||||
} else {
|
||||
|
@ -949,7 +949,7 @@ class mxObjectCodec {
|
|||
* into - Optional object to pass-thru to the codec.
|
||||
*/
|
||||
processInclude = (dec, node, into) => {
|
||||
if (node.nodeName == 'include') {
|
||||
if (node.nodeName === 'include') {
|
||||
var name = node.getAttribute('name');
|
||||
|
||||
if (name != null) {
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
*/
|
||||
|
||||
import mxRootChange from "FIXME";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
|
||||
class mxRootChangeCodec extends mxObjectCodec {
|
||||
/**
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
|
||||
import mxUtils from "../util/mxUtils";
|
||||
import mxCodecRegistry from "./mxCodecRegistry";
|
||||
import mxStylesheet from "FIXME";
|
||||
|
||||
class mxStylesheetCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Variable: allowEval
|
||||
|
@ -142,7 +146,7 @@ class mxStylesheetCodec extends mxObjectCodec {
|
|||
extend + ' not found to extend');
|
||||
}
|
||||
|
||||
style = new Object();
|
||||
style = {};
|
||||
}
|
||||
|
||||
var entry = node.firstChild;
|
||||
|
|
|
@ -2,8 +2,11 @@
|
|||
* Copyright (c) 2006-2015, JGraph Ltd
|
||||
* Copyright (c) 2006-2015, Gaudenz Alder
|
||||
*/
|
||||
mxCodecRegistry.register(()=>
|
||||
{
|
||||
|
||||
import mxObjectCodec from "FIXME";
|
||||
import mxTerminalChange from "FIXME";
|
||||
|
||||
class mxTerminalChangeCodec extends mxObjectCodec {
|
||||
/**
|
||||
* Class: mxTerminalChangeCodec
|
||||
*
|
||||
|
@ -21,22 +24,21 @@ mxCodecRegistry.register(()=>
|
|||
* - cell
|
||||
* - terminal
|
||||
*/
|
||||
var codec = new mxObjectCodec(new mxTerminalChange(),
|
||||
['model', 'previous'], ['cell', 'terminal']);
|
||||
constructor() {
|
||||
super(new mxTerminalChange(), ['model', 'previous'], ['cell', 'terminal']);
|
||||
}
|
||||
|
||||
/**
|
||||
* Function: afterDecode
|
||||
*
|
||||
* Restores the state by assigning the previous value.
|
||||
*/
|
||||
codec.afterDecode = (dec, node, obj)=>
|
||||
{
|
||||
afterDecode = (dec, node, obj) => {
|
||||
obj.previous = obj.terminal;
|
||||
|
||||
return obj;
|
||||
};
|
||||
}
|
||||
|
||||
// Returns the codec into the registry
|
||||
return codec;
|
||||
|
||||
}());
|
||||
mxCodecRegistry.register(new mxTerminalChangeCodec());
|
||||
export default mxTerminalChangeCodec;
|
||||
|
|
|
@ -472,7 +472,7 @@ class mxGraphHierarchyModel {
|
|||
|
||||
if (internalNode != null) {
|
||||
if (seenNodes == null) {
|
||||
seenNodes = new Object();
|
||||
seenNodes = {};
|
||||
}
|
||||
|
||||
if (trackAncestors) {
|
||||
|
|
|
@ -279,7 +279,7 @@ class mxSwimlaneModel {
|
|||
this.ranksPerGroup = [];
|
||||
|
||||
var startNodes = [];
|
||||
var seen = new Object();
|
||||
var seen = {};
|
||||
|
||||
if (this.roots != null) {
|
||||
for (var i = 0; i < this.roots.length; i++) {
|
||||
|
@ -559,7 +559,7 @@ class mxSwimlaneModel {
|
|||
|
||||
if (internalNode != null) {
|
||||
if (seenNodes == null) {
|
||||
seenNodes = new Object();
|
||||
seenNodes = {};
|
||||
}
|
||||
|
||||
if (trackAncestors) {
|
||||
|
|
|
@ -492,7 +492,7 @@ class mxCoordinateAssignment extends mxHierarchicalLayoutStage {
|
|||
// , the order is given by the weighted sum of the in or out edges,
|
||||
// depending on whether we're traveling up or down the hierarchy.
|
||||
var weightedValues = [];
|
||||
var cellMap = new Object();
|
||||
var cellMap = {};
|
||||
|
||||
for (var i = 0; i < rank.length; i++) {
|
||||
var currentCell = rank[i];
|
||||
|
|
|
@ -35,9 +35,9 @@ class mxMinimumCycleRemover extends mxHierarchicalLayoutStage {
|
|||
*/
|
||||
execute = (parent) => {
|
||||
var model = this.layout.getModel();
|
||||
var seenNodes = new Object();
|
||||
var seenNodes = {};
|
||||
var unseenNodesArray = model.vertexMapper.getValues();
|
||||
var unseenNodes = new Object();
|
||||
var unseenNodes = {};
|
||||
|
||||
for (var i = 0; i < unseenNodesArray.length; i++) {
|
||||
unseenNodes[unseenNodesArray[i].id] = unseenNodesArray[i];
|
||||
|
|
|
@ -35,7 +35,7 @@ class mxSwimlaneOrdering extends mxHierarchicalLayoutStage {
|
|||
*/
|
||||
execute = (parent) => {
|
||||
var model = this.layout.getModel();
|
||||
var seenNodes = new Object();
|
||||
var seenNodes = {};
|
||||
var unseenNodes = mxUtils.clone(model.vertexMapper, null, true);
|
||||
|
||||
// Perform a dfs through the internal model. If a cycle is found,
|
||||
|
|
|
@ -291,7 +291,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
|
|||
|
||||
if (this.root != null) {
|
||||
if (this.resizeParent) {
|
||||
this.parentsChanged = new Object();
|
||||
this.parentsChanged = {};
|
||||
} else {
|
||||
this.parentsChanged = null;
|
||||
}
|
||||
|
@ -312,7 +312,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
|
|||
model.beginUpdate();
|
||||
|
||||
try {
|
||||
this.visited = new Object();
|
||||
this.visited = {};
|
||||
this.node = this.dfs(this.root, parent);
|
||||
|
||||
if (this.alignRanks) {
|
||||
|
@ -768,7 +768,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
|
|||
* Function: createNode
|
||||
*/
|
||||
createNode = (cell) => {
|
||||
var node = new Object();
|
||||
var node = {};
|
||||
node.cell = cell;
|
||||
node.x = 0;
|
||||
node.y = 0;
|
||||
|
@ -789,7 +789,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
|
|||
|
||||
node.offsetX = 0;
|
||||
node.offsetY = 0;
|
||||
node.contour = new Object();
|
||||
node.contour = {};
|
||||
|
||||
return node;
|
||||
};
|
||||
|
@ -834,7 +834,7 @@ class mxCompactTreeLayout extends mxGraphLayout {
|
|||
* Function: createLine
|
||||
*/
|
||||
createLine = (dx, dy, next) => {
|
||||
var line = new Object();
|
||||
var line = {};
|
||||
line.dx = dx;
|
||||
line.dy = dy;
|
||||
line.next = next;
|
||||
|
|
|
@ -646,7 +646,7 @@ class mxGraphModel extends mxEventSource {
|
|||
|
||||
// Lazily creates the cells dictionary
|
||||
if (this.cells == null) {
|
||||
this.cells = new Object();
|
||||
this.cells = {};
|
||||
}
|
||||
|
||||
this.cells[cell.getId()] = cell;
|
||||
|
@ -1853,7 +1853,7 @@ class mxGraphModel extends mxEventSource {
|
|||
|
||||
this.beginUpdate();
|
||||
try {
|
||||
var mapping = new Object();
|
||||
var mapping = {};
|
||||
this.mergeChildrenImpl(from, to, cloneAllEdges, mapping);
|
||||
|
||||
// Post-processes all edges in the mapping and
|
||||
|
@ -2000,7 +2000,7 @@ class mxGraphModel extends mxEventSource {
|
|||
*/
|
||||
cloneCells = (cells, includeChildren, mapping) => {
|
||||
includeChildren = (includeChildren != null) ? includeChildren : true;
|
||||
mapping = (mapping != null) ? mapping : new Object();
|
||||
mapping = (mapping != null) ? mapping : {};
|
||||
var clones = [];
|
||||
|
||||
for (var i = 0; i < cells.length; i++) {
|
||||
|
|
|
@ -31,7 +31,7 @@ var mxClipboard =
|
|||
* cells = cells || graph.getSelectionCells();
|
||||
* var result = graph.getExportableCells(cells);
|
||||
*
|
||||
* mxClipboard.parents = new Object();
|
||||
* mxClipboard.parents = {};
|
||||
*
|
||||
* for (var i = 0; i < result.length; i++)
|
||||
* {
|
||||
|
|
|
@ -2,6 +2,84 @@
|
|||
* Copyright (c) 2006-2020, JGraph Ltd
|
||||
* Copyright (c) 2006-2020, draw.io AG
|
||||
*/
|
||||
|
||||
class mxXmlRequest {
|
||||
/**
|
||||
* Variable: url
|
||||
*
|
||||
* Holds the target URL of the request.
|
||||
*/
|
||||
url = null;
|
||||
|
||||
/**
|
||||
* Variable: params
|
||||
*
|
||||
* Holds the form encoded data for the POST request.
|
||||
*/
|
||||
params = null;
|
||||
|
||||
/**
|
||||
* Variable: method
|
||||
*
|
||||
* Specifies the request method. Possible values are POST and GET. Default
|
||||
* is POST.
|
||||
*/
|
||||
method = null;
|
||||
|
||||
/**
|
||||
* Variable: async
|
||||
*
|
||||
* Boolean indicating if the request is asynchronous.
|
||||
*/
|
||||
async = null;
|
||||
|
||||
/**
|
||||
* Variable: binary
|
||||
*
|
||||
* Boolean indicating if the request is binary. This option is ignored in IE.
|
||||
* In all other browsers the requested mime type is set to
|
||||
* text/plain; charset=x-user-defined. Default is false.
|
||||
*/
|
||||
binary = false;
|
||||
|
||||
/**
|
||||
* Variable: withCredentials
|
||||
*
|
||||
* Specifies if withCredentials should be used in HTML5-compliant browsers. Default is
|
||||
* false.
|
||||
*/
|
||||
withCredentials = false;
|
||||
|
||||
/**
|
||||
* Variable: username
|
||||
*
|
||||
* Specifies the username to be used for authentication.
|
||||
*/
|
||||
username = null;
|
||||
|
||||
/**
|
||||
* Variable: password
|
||||
*
|
||||
* Specifies the password to be used for authentication.
|
||||
*/
|
||||
password = null;
|
||||
|
||||
/**
|
||||
* Variable: request
|
||||
*
|
||||
* Holds the inner, browser-specific request object.
|
||||
*/
|
||||
request = null;
|
||||
|
||||
/**
|
||||
* Variable: decodeSimulateValues
|
||||
*
|
||||
* Specifies if request values should be decoded as URIs before setting the
|
||||
* textarea value in <simulate>. Defaults to false for backwards compatibility,
|
||||
* to avoid another decode on the server this should be set to true.
|
||||
*/
|
||||
decodeSimulateValues = false;
|
||||
|
||||
/**
|
||||
* Class: mxXmlRequest
|
||||
*
|
||||
|
@ -85,8 +163,7 @@
|
|||
* username - String specifying the username to be used for the request.
|
||||
* password - String specifying the password to be used for the request.
|
||||
*/
|
||||
function mxXmlRequest(url, params, method, async, username, password)
|
||||
{
|
||||
constructor(url, params, method, async, username, password) {
|
||||
this.url = url;
|
||||
this.params = params;
|
||||
this.method = method || 'POST';
|
||||
|
@ -95,89 +172,12 @@ function mxXmlRequest(url, params, method, async, username, password)
|
|||
this.password = password;
|
||||
};
|
||||
|
||||
/**
|
||||
* Variable: url
|
||||
*
|
||||
* Holds the target URL of the request.
|
||||
*/
|
||||
url = null;
|
||||
|
||||
/**
|
||||
* Variable: params
|
||||
*
|
||||
* Holds the form encoded data for the POST request.
|
||||
*/
|
||||
params = null;
|
||||
|
||||
/**
|
||||
* Variable: method
|
||||
*
|
||||
* Specifies the request method. Possible values are POST and GET. Default
|
||||
* is POST.
|
||||
*/
|
||||
method = null;
|
||||
|
||||
/**
|
||||
* Variable: async
|
||||
*
|
||||
* Boolean indicating if the request is asynchronous.
|
||||
*/
|
||||
async = null;
|
||||
|
||||
/**
|
||||
* Variable: binary
|
||||
*
|
||||
* Boolean indicating if the request is binary. This option is ignored in IE.
|
||||
* In all other browsers the requested mime type is set to
|
||||
* text/plain; charset=x-user-defined. Default is false.
|
||||
*/
|
||||
binary = false;
|
||||
|
||||
/**
|
||||
* Variable: withCredentials
|
||||
*
|
||||
* Specifies if withCredentials should be used in HTML5-compliant browsers. Default is
|
||||
* false.
|
||||
*/
|
||||
withCredentials = false;
|
||||
|
||||
/**
|
||||
* Variable: username
|
||||
*
|
||||
* Specifies the username to be used for authentication.
|
||||
*/
|
||||
username = null;
|
||||
|
||||
/**
|
||||
* Variable: password
|
||||
*
|
||||
* Specifies the password to be used for authentication.
|
||||
*/
|
||||
password = null;
|
||||
|
||||
/**
|
||||
* Variable: request
|
||||
*
|
||||
* Holds the inner, browser-specific request object.
|
||||
*/
|
||||
request = null;
|
||||
|
||||
/**
|
||||
* Variable: decodeSimulateValues
|
||||
*
|
||||
* Specifies if request values should be decoded as URIs before setting the
|
||||
* textarea value in <simulate>. Defaults to false for backwards compatibility,
|
||||
* to avoid another decode on the server this should be set to true.
|
||||
*/
|
||||
decodeSimulateValues = false;
|
||||
|
||||
/**
|
||||
* Function: isBinary
|
||||
*
|
||||
* Returns <binary>.
|
||||
*/
|
||||
isBinary = ()=>
|
||||
{
|
||||
isBinary = () => {
|
||||
return this.binary;
|
||||
};
|
||||
|
||||
|
@ -186,8 +186,7 @@ isBinary = ()=>
|
|||
*
|
||||
* Sets <binary>.
|
||||
*/
|
||||
setBinary = (value)=>
|
||||
{
|
||||
setBinary = (value) => {
|
||||
this.binary = value;
|
||||
};
|
||||
|
||||
|
@ -196,8 +195,7 @@ setBinary = (value)=>
|
|||
*
|
||||
* Returns the response as a string.
|
||||
*/
|
||||
getText = ()=>
|
||||
{
|
||||
getText = () => {
|
||||
return this.request.responseText;
|
||||
};
|
||||
|
||||
|
@ -206,8 +204,7 @@ getText = ()=>
|
|||
*
|
||||
* Returns true if the response is ready.
|
||||
*/
|
||||
isReady = ()=>
|
||||
{
|
||||
isReady = () => {
|
||||
return this.request.readyState == 4;
|
||||
};
|
||||
|
||||
|
@ -216,12 +213,10 @@ isReady = ()=>
|
|||
*
|
||||
* Returns the document element of the response XML document.
|
||||
*/
|
||||
getDocumentElement = ()=>
|
||||
{
|
||||
getDocumentElement = () => {
|
||||
var doc = this.getXml();
|
||||
|
||||
if (doc != null)
|
||||
{
|
||||
if (doc != null) {
|
||||
return doc.documentElement;
|
||||
}
|
||||
|
||||
|
@ -234,8 +229,7 @@ getDocumentElement = ()=>
|
|||
* Returns the response as an XML document. Use <getDocumentElement> to get
|
||||
* the document element of the XML document.
|
||||
*/
|
||||
getXml = ()=>
|
||||
{
|
||||
getXml = () => {
|
||||
var xml = this.request.responseXML;
|
||||
|
||||
// Handles missing response headers in IE, the first condition handles
|
||||
|
@ -243,8 +237,7 @@ getXml = ()=>
|
|||
// type errors in the mxCellCodec when putting the nodes into a new
|
||||
// document. This happens in IE9 standards mode and with XML user
|
||||
// objects only, as they are used directly as values in cells.
|
||||
if (xml == null || xml.documentElement == null)
|
||||
{
|
||||
if (xml == null || xml.documentElement == null) {
|
||||
xml = mxUtils.parseXml(this.request.responseText);
|
||||
}
|
||||
|
||||
|
@ -257,8 +250,7 @@ getXml = ()=>
|
|||
* Returns the status as a number, eg. 404 for "Not found" or 200 for "OK".
|
||||
* Note: The NS_ERROR_NOT_AVAILABLE for invalid responses cannot be cought.
|
||||
*/
|
||||
getStatus = ()=>
|
||||
{
|
||||
getStatus = () => {
|
||||
return (this.request != null) ? this.request.status : null;
|
||||
};
|
||||
|
||||
|
@ -267,32 +259,27 @@ getStatus = ()=>
|
|||
*
|
||||
* Creates and returns the inner <request> object.
|
||||
*/
|
||||
create = ()=>
|
||||
{
|
||||
if (window.XMLHttpRequest)
|
||||
{
|
||||
return ()=>
|
||||
{
|
||||
create = () => {
|
||||
if (window.XMLHttpRequest) {
|
||||
return () => {
|
||||
var req = new XMLHttpRequest();
|
||||
|
||||
// TODO: Check for overrideMimeType required here?
|
||||
if (this.isBinary() && req.overrideMimeType)
|
||||
{
|
||||
if (this.isBinary() && req.overrideMimeType) {
|
||||
req.overrideMimeType('text/plain; charset=x-user-defined');
|
||||
}
|
||||
|
||||
return req;
|
||||
};
|
||||
}
|
||||
else if (typeof(ActiveXObject) != 'undefined')
|
||||
{
|
||||
return ()=>
|
||||
{
|
||||
} else if (typeof (ActiveXObject) != 'undefined') {
|
||||
return () => {
|
||||
// TODO: Implement binary option
|
||||
return new ActiveXObject('Microsoft.XMLHTTP');
|
||||
};
|
||||
}
|
||||
}();
|
||||
}
|
||||
()
|
||||
;
|
||||
|
||||
/**
|
||||
* Function: send
|
||||
|
@ -309,18 +296,13 @@ create = ()=>
|
|||
* timeout - Optional timeout in ms before calling ontimeout.
|
||||
* ontimeout - Optional function to execute on timeout.
|
||||
*/
|
||||
send = (onload, onerror, timeout, ontimeout)=>
|
||||
{
|
||||
send = (onload, onerror, timeout, ontimeout) => {
|
||||
this.request = this.create();
|
||||
|
||||
if (this.request != null)
|
||||
{
|
||||
if (onload != null)
|
||||
{
|
||||
this.request.onreadystatechange = mxUtils.bind(this, ()=>
|
||||
{
|
||||
if (this.isReady())
|
||||
{
|
||||
if (this.request != null) {
|
||||
if (onload != null) {
|
||||
this.request.onreadystatechange = mxUtils.bind(this, () => {
|
||||
if (this.isReady()) {
|
||||
onload(this);
|
||||
this.request.onreadystatechange = null;
|
||||
}
|
||||
|
@ -331,14 +313,12 @@ send = (onload, onerror, timeout, ontimeout)=>
|
|||
this.username, this.password);
|
||||
this.setRequestHeaders(this.request, this.params);
|
||||
|
||||
if (window.XMLHttpRequest && this.withCredentials)
|
||||
{
|
||||
if (window.XMLHttpRequest && this.withCredentials) {
|
||||
this.request.withCredentials = 'true';
|
||||
}
|
||||
|
||||
if ((document.documentMode == null) &&
|
||||
window.XMLHttpRequest && timeout != null && ontimeout != null)
|
||||
{
|
||||
window.XMLHttpRequest && timeout != null && ontimeout != null) {
|
||||
this.request.timeout = timeout;
|
||||
this.request.ontimeout = ontimeout;
|
||||
}
|
||||
|
@ -371,10 +351,8 @@ send = (onload, onerror, timeout, ontimeout)=>
|
|||
* Use the code above before calling <send> if you require a
|
||||
* multipart/form-data request.
|
||||
*/
|
||||
setRequestHeaders = (request, params)=>
|
||||
{
|
||||
if (params != null)
|
||||
{
|
||||
setRequestHeaders = (request, params) => {
|
||||
if (params != null) {
|
||||
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
|
||||
}
|
||||
};
|
||||
|
@ -390,13 +368,11 @@ setRequestHeaders = (request, params)=>
|
|||
* docs - Document that contains the form element.
|
||||
* target - Target to send the form result to.
|
||||
*/
|
||||
simulate = (doc, target)=>
|
||||
{
|
||||
simulate = (doc, target) => {
|
||||
doc = doc || document;
|
||||
var old = null;
|
||||
|
||||
if (doc == document)
|
||||
{
|
||||
if (doc == document) {
|
||||
old = window.onbeforeunload;
|
||||
window.onbeforeunload = null;
|
||||
}
|
||||
|
@ -405,8 +381,7 @@ simulate = (doc, target)=>
|
|||
form.setAttribute('method', this.method);
|
||||
form.setAttribute('action', this.url);
|
||||
|
||||
if (target != null)
|
||||
{
|
||||
if (target != null) {
|
||||
form.setAttribute('target', target);
|
||||
}
|
||||
|
||||
|
@ -418,17 +393,14 @@ simulate = (doc, target)=>
|
|||
this.params.split();
|
||||
|
||||
// Adds the parameters as textareas to the form
|
||||
for (var i=0; i<pars.length; i++)
|
||||
{
|
||||
for (var i = 0; i < pars.length; i++) {
|
||||
var pos = pars[i].indexOf('=');
|
||||
|
||||
if (pos > 0)
|
||||
{
|
||||
if (pos > 0) {
|
||||
var name = pars[i].substring(0, pos);
|
||||
var value = pars[i].substring(pos + 1);
|
||||
|
||||
if (this.decodeSimulateValues)
|
||||
{
|
||||
if (this.decodeSimulateValues) {
|
||||
value = decodeURIComponent(value);
|
||||
}
|
||||
|
||||
|
@ -443,13 +415,14 @@ simulate = (doc, target)=>
|
|||
doc.body.appendChild(form);
|
||||
form.submit();
|
||||
|
||||
if (form.parentNode != null)
|
||||
{
|
||||
if (form.parentNode != null) {
|
||||
form.parentNode.removeChild(form);
|
||||
}
|
||||
|
||||
if (old != null)
|
||||
{
|
||||
if (old != null) {
|
||||
window.onbeforeunload = old;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default mxXmlRequest;
|
||||
|
|
|
@ -41,7 +41,7 @@ function mxCellRenderer() { };
|
|||
* known to all instances of this class. For adding new shapes you should
|
||||
* use the static <mxCellRenderer.registerShape> function.
|
||||
*/
|
||||
mxCellRenderer.defaultShapes = new Object();
|
||||
mxCellRenderer.defaultShapes = {};
|
||||
|
||||
/**
|
||||
* Variable: defaultEdgeShape
|
||||
|
|
|
@ -199,7 +199,7 @@
|
|||
* shapename and the stylename we'll use boxstyle for the stylename:
|
||||
*
|
||||
* (code)
|
||||
* var style = new Object();
|
||||
* var style = {};
|
||||
* style[mxConstants.STYLE_SHAPE] = 'box';
|
||||
* style[mxConstants.STYLE_STROKECOLOR] = '#000000';
|
||||
* style[mxConstants.STYLE_FONTCOLOR] = '#000000';
|
||||
|
@ -3325,7 +3325,7 @@ getCellStyle = (cell)=>
|
|||
// Returns a non-null value if no style can be found
|
||||
if (style == null)
|
||||
{
|
||||
style = new Object();
|
||||
style = {};
|
||||
}
|
||||
|
||||
return style;
|
||||
|
@ -8690,7 +8690,7 @@ validateEdge = (edge, source, target)=>
|
|||
validateGraph = (cell, context)=>
|
||||
{
|
||||
cell = (cell != null) ? cell : this.model.getRoot();
|
||||
context = (context != null) ? context : new Object();
|
||||
context = (context != null) ? context : {};
|
||||
|
||||
var isValid = true;
|
||||
var childCount = this.model.getChildCount(cell);
|
||||
|
@ -8702,7 +8702,7 @@ validateGraph = (cell, context)=>
|
|||
|
||||
if (this.isValidRoot(tmp))
|
||||
{
|
||||
ctx = new Object();
|
||||
ctx = {};
|
||||
}
|
||||
|
||||
var warn = this.validateGraph(tmp, ctx);
|
||||
|
|
|
@ -53,7 +53,7 @@
|
|||
*/
|
||||
function mxStylesheet()
|
||||
{
|
||||
this.styles = new Object();
|
||||
this.styles = {};
|
||||
|
||||
this.putDefaultVertexStyle(this.createDefaultVertexStyle());
|
||||
this.putDefaultEdgeStyle(this.createDefaultEdgeStyle());
|
||||
|
@ -75,7 +75,7 @@ FIXME;
|
|||
*/
|
||||
createDefaultVertexStyle = ()=>
|
||||
{
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
|
@ -95,7 +95,7 @@ createDefaultVertexStyle = ()=>
|
|||
*/
|
||||
createDefaultEdgeStyle = ()=>
|
||||
{
|
||||
var style = new Object();
|
||||
var style = {};
|
||||
|
||||
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_CONNECTOR;
|
||||
style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_CLASSIC;
|
||||
|
@ -163,7 +163,7 @@ getDefaultEdgeStyle = ()=>
|
|||
* existing stylesheet:
|
||||
*
|
||||
* (code)
|
||||
* var style = new Object();
|
||||
* var style = {};
|
||||
* style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
|
||||
* style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
|
||||
* style[mxConstants.STYLE_ROUNDED] = true;
|
||||
|
@ -220,7 +220,7 @@ getCellStyle = (name, defaultStyle)=>
|
|||
}
|
||||
else
|
||||
{
|
||||
style = new Object();
|
||||
style = {};
|
||||
}
|
||||
|
||||
// Parses each key, value pair into the existing style
|
||||
|
|
Loading…
Reference in New Issue