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

replaced references to `bind` with arrow functions

development
mcyph 2021-07-31 20:00:28 +10:00
parent 62c9dd8e34
commit 7cc56f30e9
11 changed files with 352 additions and 352 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/stashed/Scrollbars.js
View File

@ -246,7 +246,7 @@ export default Scrollbars;
{ {
div.scrollHandler = true; div.scrollHandler = true;
let updateEdges = this.bind(function() let updateEdges = () =>
{ {
let edgeCount = state.cell.getEdgeCount(); let edgeCount = state.cell.getEdgeCount();
@ -258,7 +258,7 @@ export default Scrollbars;
graph.view.invalidate(edge, true, false); graph.view.invalidate(edge, true, false);
graph.view.validate(edge); graph.view.validate(edge);
} }
}); };
mxEvent.addListener(div, 'scroll', updateEdges); mxEvent.addListener(div, 'scroll', updateEdges);
mxEvent.addListener(div, 'mouseup', updateEdges); mxEvent.addListener(div, 'mouseup', updateEdges);

14
docs/stashed/ServerView.js
View File

@ -73,7 +73,7 @@ export default MYNAMEHERE;
if (container != null) if (container != null)
{ {
mxEvent.addGestureListeners(container, mxEvent.addGestureListeners(container,
this.bind(function(evt) (evt) =>
{ {
let pt = convertPoint(graph.container, let pt = convertPoint(graph.container,
mxEvent.getClientX(evt), mxEvent.getClientY(evt)); mxEvent.getClientX(evt), mxEvent.getClientY(evt));
@ -95,7 +95,7 @@ export default MYNAMEHERE;
new InternalMouseEvent(evt)); new InternalMouseEvent(evt));
} }
}), }),
this.bind(function(evt) ((evt) =>
{ {
let pt = convertPoint(graph.container, let pt = convertPoint(graph.container,
mxEvent.getClientX(evt), mxEvent.getClientY(evt)); mxEvent.getClientX(evt), mxEvent.getClientY(evt));
@ -113,7 +113,7 @@ export default MYNAMEHERE;
new InternalMouseEvent(evt)); new InternalMouseEvent(evt));
} }
}), }),
this.bind(function(evt) ((evt) =>
{ {
let pt = convertPoint(graph.container, let pt = convertPoint(graph.container,
mxEvent.getClientX(evt), mxEvent.getClientY(evt)); mxEvent.getClientX(evt), mxEvent.getClientY(evt));
@ -134,7 +134,7 @@ export default MYNAMEHERE;
// Adds listener for double click handling on background // Adds listener for double click handling on background
mxEvent.addListener(container, 'dblclick', mxEvent.addListener(container, 'dblclick',
this.bind(function(evt) ((evt) =>
{ {
let pt = convertPoint(graph.container, let pt = convertPoint(graph.container,
mxEvent.getClientX(evt), mxEvent.getClientY(evt)); mxEvent.getClientX(evt), mxEvent.getClientY(evt));
@ -147,14 +147,14 @@ export default MYNAMEHERE;
// Adds basic listeners for graph event dispatching outside of the // Adds basic listeners for graph event dispatching outside of the
// container and finishing the handling of a single gesture // container and finishing the handling of a single gesture
mxEvent.addGestureListeners(document, mxEvent.addGestureListeners(document,
this.bind(function(evt) ((evt) =>
{ {
if (this.isContainerEvent(evt)) if (this.isContainerEvent(evt))
{ {
graph.popupMenuHandler.hideMenu(); graph.popupMenuHandler.hideMenu();
} }
}), }),
this.bind(function(evt) ((evt) =>
{ {
// Hides the tooltip if mouse is outside container // Hides the tooltip if mouse is outside container
if (graph.tooltipHandler != null && if (graph.tooltipHandler != null &&
@ -171,7 +171,7 @@ export default MYNAMEHERE;
new InternalMouseEvent(evt)); new InternalMouseEvent(evt));
} }
}), }),
this.bind(function(evt) ((evt) =>
{ {
if (this.captureDocumentGesture) if (this.captureDocumentGesture)
{ {

4
docs/stashed/Touch.js
View File

@ -89,7 +89,7 @@ export default Touch;
// mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0 // mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0
// Disables built-in text selection and context menu while not editing text // Disables built-in text selection and context menu while not editing text
let textEditing = this.bind(function(evt) let textEditing = ((evt) =>
{ {
return graph.isEditing(); return graph.isEditing();
}); });
@ -376,7 +376,7 @@ export default Touch;
// Starts connecting on touch/mouse down // Starts connecting on touch/mouse down
mxEvent.addGestureListeners(this.connectorImg, mxEvent.addGestureListeners(this.connectorImg,
this.bind(function(evt) ((evt) =>
{ {
this.graph.popupMenuHandler.hideMenu(); this.graph.popupMenuHandler.hideMenu();
this.graph.stopEditing(false); this.graph.stopEditing(false);

44
docs/stashed/grapheditor/www/js/Actions.js
View File

@ -44,7 +44,7 @@ Actions.prototype.init = function()
window.openKey = 'import'; window.openKey = 'import';
// Closes dialog after open // Closes dialog after open
window.openFile = new OpenFile(this.bind(function() window.openFile = new OpenFile((() =>
{ {
ui.hideDialog(); ui.hideDialog();
})); }));
@ -529,7 +529,7 @@ Actions.prototype.init = function()
}); });
} }
})).isEnabled = isGraphEnabled; })).isEnabled = isGraphEnabled;
this.addAction('link...', this.bind(function() this.addAction('link...', (() =>
{ {
if (graph.isEnabled()) if (graph.isEnabled())
{ {
@ -564,7 +564,7 @@ Actions.prototype.init = function()
let selState = graph.cellEditor.saveSelection(); let selState = graph.cellEditor.saveSelection();
ui.showLinkDialog(oldValue, Resources.get('apply'), this.bind(function(value) ui.showLinkDialog(oldValue, Resources.get('apply'), ((value) =>
{ {
graph.cellEditor.restoreSelection(selState); graph.cellEditor.restoreSelection(selState);
@ -784,7 +784,7 @@ Actions.prototype.init = function()
graph.fitWindow(bounds); graph.fitWindow(bounds);
} }
}, null, null, Editor.ctrlKey + '+Shift+H'); }, null, null, Editor.ctrlKey + '+Shift+H');
this.addAction('fitPage', this.bind(function() this.addAction('fitPage', (() =>
{ {
if (!graph.pageVisible) if (!graph.pageVisible)
{ {
@ -805,7 +805,7 @@ Actions.prototype.init = function()
graph.container.scrollLeft = Math.min(pad.x * graph.view.scale, (graph.container.scrollWidth - graph.container.clientWidth) / 2) - 1; graph.container.scrollLeft = Math.min(pad.x * graph.view.scale, (graph.container.scrollWidth - graph.container.clientWidth) / 2) - 1;
} }
}), null, null, Editor.ctrlKey + '+J'); }), null, null, Editor.ctrlKey + '+J');
this.addAction('fitTwoPages', this.bind(function() this.addAction('fitTwoPages', (() =>
{ {
if (!graph.pageVisible) if (!graph.pageVisible)
{ {
@ -827,7 +827,7 @@ Actions.prototype.init = function()
graph.container.scrollLeft = Math.min(pad.x, (graph.container.scrollWidth - graph.container.clientWidth) / 2); graph.container.scrollLeft = Math.min(pad.x, (graph.container.scrollWidth - graph.container.clientWidth) / 2);
} }
}), null, null, Editor.ctrlKey + '+Shift+J'); }), null, null, Editor.ctrlKey + '+Shift+J');
this.addAction('fitPageWidth', this.bind(function() this.addAction('fitPageWidth', (() =>
{ {
if (!graph.pageVisible) if (!graph.pageVisible)
{ {
@ -848,9 +848,9 @@ Actions.prototype.init = function()
(graph.container.scrollWidth - graph.container.clientWidth) / 2); (graph.container.scrollWidth - graph.container.clientWidth) / 2);
} }
})); }));
this.put('customZoom', new Action(Resources.get('custom') + '...', this.bind(function() this.put('customZoom', new Action(Resources.get('custom') + '...', (() =>
{ {
let dlg = new FilenameDialog(this.editorUi, parseInt(graph.getView().getScale() * 100), Resources.get('apply'), this.bind(function(newValue) let dlg = new FilenameDialog(this.editorUi, parseInt(graph.getView().getScale() * 100), Resources.get('apply'), ((newValue) =>
{ {
let val = parseInt(newValue); let val = parseInt(newValue);
@ -862,9 +862,9 @@ Actions.prototype.init = function()
this.editorUi.showDialog(dlg.container, 300, 80, true, true); this.editorUi.showDialog(dlg.container, 300, 80, true, true);
dlg.init(); dlg.init();
}), null, null, Editor.ctrlKey + '+0')); }), null, null, Editor.ctrlKey + '+0'));
this.addAction('pageScale...', this.bind(function() this.addAction('pageScale...', (() =>
{ {
let dlg = new FilenameDialog(this.editorUi, parseInt(graph.pageScale * 100), Resources.get('apply'), this.bind(function(newValue) let dlg = new FilenameDialog(this.editorUi, parseInt(graph.pageScale * 100), Resources.get('apply'), ((newValue) =>
{ {
let val = parseInt(newValue); let val = parseInt(newValue);
@ -927,7 +927,7 @@ Actions.prototype.init = function()
}); });
action.setToggleAction(true); action.setToggleAction(true);
action.setSelectedCallback(function() { return graph.scrollbars; }); action.setSelectedCallback(function() { return graph.scrollbars; });
action = this.addAction('pageView', this.bind(function() action = this.addAction('pageView', (() =>
{ {
ui.setPageVisible(!graph.pageVisible); ui.setPageVisible(!graph.pageVisible);
})); }));
@ -993,7 +993,7 @@ Actions.prototype.init = function()
})); }));
// Font style actions // Font style actions
let toggleFontStyle = this.bind(function(key, style, fn, shortcut) let toggleFontStyle = ((key, style, fn, shortcut) =>
{ {
return this.addAction(key, function() return this.addAction(key, function()
{ {
@ -1206,7 +1206,7 @@ Actions.prototype.init = function()
ui.fireEvent(new EventObject('styleChanged', 'keys', ['collapsible'], ui.fireEvent(new EventObject('styleChanged', 'keys', ['collapsible'],
'values', [value], 'cells', graph.getSelectionCells())); 'values', [value], 'cells', graph.getSelectionCells()));
}); });
this.addAction('editStyle...', this.bind(function() this.addAction('editStyle...', (() =>
{ {
let cells = graph.getSelectionCells(); let cells = graph.getSelectionCells();
@ -1319,21 +1319,21 @@ Actions.prototype.init = function()
} }
} }
}, null, null, 'Alt+Shift+C'); }, null, null, 'Alt+Shift+C');
action = this.addAction('subscript', this.bind(function() action = this.addAction('subscript', (() =>
{ {
if (graph.cellEditor.isContentEditing()) if (graph.cellEditor.isContentEditing())
{ {
document.execCommand('subscript', false, null); document.execCommand('subscript', false, null);
} }
}), null, null, Editor.ctrlKey + '+,'); }), null, null, Editor.ctrlKey + '+,');
action = this.addAction('superscript', this.bind(function() action = this.addAction('superscript', (() =>
{ {
if (graph.cellEditor.isContentEditing()) if (graph.cellEditor.isContentEditing())
{ {
document.execCommand('superscript', false, null); document.execCommand('superscript', false, null);
} }
}), null, null, Editor.ctrlKey + '+.'); }), null, null, Editor.ctrlKey + '+.');
action = this.addAction('indent', this.bind(function() action = this.addAction('indent', (() =>
{ {
// NOTE: Alt+Tab for outdent implemented via special code in // NOTE: Alt+Tab for outdent implemented via special code in
// keyHandler.getFunction in EditorUi.js. Ctrl+Tab is reserved. // keyHandler.getFunction in EditorUi.js. Ctrl+Tab is reserved.
@ -1435,7 +1435,7 @@ Actions.prototype.init = function()
}, graph.cellEditor.isContentEditing(), !graph.cellEditor.isContentEditing()); }, graph.cellEditor.isContentEditing(), !graph.cellEditor.isContentEditing());
} }
}).isEnabled = isGraphEnabled; }).isEnabled = isGraphEnabled;
action = this.addAction('layers', this.bind(function() action = this.addAction('layers', (() =>
{ {
if (this.layersWindow == null) if (this.layersWindow == null)
{ {
@ -1460,14 +1460,14 @@ Actions.prototype.init = function()
} }
}), null, null, Editor.ctrlKey + '+Shift+L'); }), null, null, Editor.ctrlKey + '+Shift+L');
action.setToggleAction(true); action.setToggleAction(true);
action.setSelectedCallback(this.bind(function() { return this.layersWindow != null && this.layersWindow.window.isVisible(); })); action.setSelectedCallback((() => { return this.layersWindow != null && this.layersWindow.window.isVisible(); }));
action = this.addAction('formatPanel', this.bind(function() action = this.addAction('formatPanel', (() =>
{ {
ui.toggleFormatPanel(); ui.toggleFormatPanel();
}), null, null, Editor.ctrlKey + '+Shift+P'); }), null, null, Editor.ctrlKey + '+Shift+P');
action.setToggleAction(true); action.setToggleAction(true);
action.setSelectedCallback(this.bind(function() { return ui.formatWidth > 0; })); action.setSelectedCallback((() => { return ui.formatWidth > 0; }));
action = this.addAction('outline', this.bind(function() action = this.addAction('outline', (() =>
{ {
if (this.outlineWindow == null) if (this.outlineWindow == null)
{ {
@ -1491,7 +1491,7 @@ Actions.prototype.init = function()
}), null, null, Editor.ctrlKey + '+Shift+O'); }), null, null, Editor.ctrlKey + '+Shift+O');
action.setToggleAction(true); action.setToggleAction(true);
action.setSelectedCallback(this.bind(function() { return this.outlineWindow != null && this.outlineWindow.window.isVisible(); })); action.setSelectedCallback((() => { return this.outlineWindow != null && this.outlineWindow.window.isVisible(); }));
}; };
/** /**

30
docs/stashed/grapheditor/www/js/Dialogs.js
View File

@ -296,7 +296,7 @@ ColorDialog.prototype.defaultColors = ['none', 'FFFFFF', 'E6E6E6', 'CCCCCC', 'B3
*/ */
ColorDialog.prototype.createApplyFunction = function() ColorDialog.prototype.createApplyFunction = function()
{ {
return this.bind(function(color) return ((color) =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
@ -1118,7 +1118,7 @@ let ExportDialog = function(editorUi)
td.style.paddingTop = '22px'; td.style.paddingTop = '22px';
td.colSpan = 2; td.colSpan = 2;
let saveBtn = button(Resources.get('export'), this.bind(function() let saveBtn = button(Resources.get('export'), (() =>
{ {
if (parseInt(zoomInput.value) <= 0) if (parseInt(zoomInput.value) <= 0)
{ {
@ -1829,7 +1829,7 @@ let OutlineWindow = function(editorUi, x, y, w, h)
} }
}; };
let resizeListener = this.bind(function() let resizeListener = (() =>
{ {
let x = this.window.getX(); let x = this.window.getX();
let y = this.window.getY(); let y = this.window.getY();
@ -1848,13 +1848,13 @@ let OutlineWindow = function(editorUi, x, y, w, h)
outline.destroy(); outline.destroy();
} }
this.window.addListener(mxEvent.RESIZE, this.bind(function() this.window.addListener(mxEvent.RESIZE, (() =>
{ {
outline.update(false); outline.update(false);
outline.outline.sizeDidChange(); outline.outline.sizeDidChange();
})); }));
this.window.addListener(mxEvent.SHOW, this.bind(function() this.window.addListener(mxEvent.SHOW, (() =>
{ {
this.window.fit(); this.window.fit();
outline.suspended = false; outline.suspended = false;
@ -1862,18 +1862,18 @@ let OutlineWindow = function(editorUi, x, y, w, h)
outline.update(); outline.update();
})); }));
this.window.addListener(mxEvent.HIDE, this.bind(function() this.window.addListener(mxEvent.HIDE, (() =>
{ {
outline.suspended = true; outline.suspended = true;
})); }));
this.window.addListener(mxEvent.NORMALIZE, this.bind(function() this.window.addListener(mxEvent.NORMALIZE, (() =>
{ {
outline.suspended = false; outline.suspended = false;
outline.update(); outline.update();
})); }));
this.window.addListener(mxEvent.MINIMIZE, this.bind(function() this.window.addListener(mxEvent.MINIMIZE, (() =>
{ {
outline.suspended = true; outline.suspended = true;
})); }));
@ -2081,14 +2081,14 @@ let LayersWindow = function(editorUi, x, y, w, h)
{ {
let offset = getOffset(insertLink); let offset = getOffset(insertLink);
editorUi.showPopupMenu(this.bind(function(menu, parent) editorUi.showPopupMenu(((menu, parent) =>
{ {
for (let i = layerCount - 1; i >= 0; i--) for (let i = layerCount - 1; i >= 0; i--)
{ {
(this.bind(function(child) (((child) =>
{ {
let item = menu.addItem(graph.convertValueToString(child) || let item = menu.addItem(graph.convertValueToString(child) ||
Resources.get('background'), null, this.bind(function() Resources.get('background'), null, (() =>
{ {
graph.moveCells(graph.getSelectionCells(), 0, 0, false, child); graph.moveCells(graph.getSelectionCells(), 0, 0, false, child);
}), parent); }), parent);
@ -2132,7 +2132,7 @@ let LayersWindow = function(editorUi, x, y, w, h)
if (graph.isEnabled() && layer != null) if (graph.isEnabled() && layer != null)
{ {
let label = graph.convertValueToString(layer); let label = graph.convertValueToString(layer);
let dlg = new FilenameDialog(editorUi, label || Resources.get('background'), Resources.get('rename'), this.bind(function(newValue) let dlg = new FilenameDialog(editorUi, label || Resources.get('background'), Resources.get('rename'), ((newValue) =>
{ {
if (newValue != null) if (newValue != null)
{ {
@ -2460,7 +2460,7 @@ let LayersWindow = function(editorUi, x, y, w, h)
// Cannot be moved or deleted // Cannot be moved or deleted
for (let i = layerCount - 1; i >= 0; i--) for (let i = layerCount - 1; i >= 0; i--)
{ {
(this.bind(function(child) (((child) =>
{ {
addLayer(i, graph.convertValueToString(child) || addLayer(i, graph.convertValueToString(child) ||
Resources.get('background'), child, child); Resources.get('background'), child, child);
@ -2507,7 +2507,7 @@ let LayersWindow = function(editorUi, x, y, w, h)
listDiv.scrollTop = listDiv.scrollHeight - listDiv.clientHeight; listDiv.scrollTop = listDiv.scrollHeight - listDiv.clientHeight;
}; };
this.window.addListener(mxEvent.SHOW, this.bind(function() this.window.addListener(mxEvent.SHOW, (() =>
{ {
this.window.fit(); this.window.fit();
})); }));
@ -2529,7 +2529,7 @@ let LayersWindow = function(editorUi, x, y, w, h)
} }
}; };
let resizeListener = this.bind(function() let resizeListener = (() =>
{ {
let x = this.window.getX(); let x = this.window.getX();
let y = this.window.getY(); let y = this.window.getY();

30
docs/stashed/grapheditor/www/js/Editor.js
View File

@ -57,7 +57,7 @@ Editor = function(chromeless, themes, model, graph, editable)
} }
}; };
this.graph.getModel().addListener(mxEvent.CHANGE, this.bind(function() this.graph.getModel().addListener(mxEvent.CHANGE, (() =>
{ {
this.graphChangeListener.apply(this, arguments); this.graphChangeListener.apply(this, arguments);
})); }));
@ -379,7 +379,7 @@ Editor.prototype.editAsNew = function(xml, title)
{ {
let wnd = null; let wnd = null;
let l = this.bind(function(evt) let l = ((evt) =>
{ {
if (evt.data == 'ready' && evt.source == wnd) if (evt.data == 'ready' && evt.source == wnd)
{ {
@ -659,7 +659,7 @@ Editor.prototype.createUndoManager = function()
}; };
// Installs the command history // Installs the command history
let listener = this.bind(function(sender, evt) let listener = ((sender, evt) =>
{ {
this.undoListener.apply(this, arguments); this.undoListener.apply(this, arguments);
}); });
@ -867,7 +867,7 @@ function Dialog(editorUi, elt, w, h, modal, closable, onClose, noScroll, transpa
img.style.left = (left + w + 38 - dx) + 'px'; img.style.left = (left + w + 38 - dx) + 'px';
img.style.zIndex = this.zIndex; img.style.zIndex = this.zIndex;
mxEvent.addListener(img, 'click', this.bind(function() mxEvent.addListener(img, 'click', (() =>
{ {
editorUi.hideDialog(true); editorUi.hideDialog(true);
})); }));
@ -879,10 +879,10 @@ function Dialog(editorUi, elt, w, h, modal, closable, onClose, noScroll, transpa
{ {
let mouseDownSeen = false; let mouseDownSeen = false;
mxEvent.addGestureListeners(this.bg, this.bind(function(evt) mxEvent.addGestureListeners(this.bg, ((evt) =>
{ {
mouseDownSeen = true; mouseDownSeen = true;
}), null, this.bind(function(evt) }), null, ((evt) =>
{ {
if (mouseDownSeen) if (mouseDownSeen)
{ {
@ -893,7 +893,7 @@ function Dialog(editorUi, elt, w, h, modal, closable, onClose, noScroll, transpa
} }
} }
this.resizeListener = this.bind(function() this.resizeListener = (() =>
{ {
if (onResize != null) if (onResize != null)
{ {
@ -2025,7 +2025,7 @@ let FilenameDialog = function(editorUi, filename, buttonText, fn, label, validat
evt.preventDefault(); evt.preventDefault();
}); });
mxEvent.addListener(dlg, 'dragover', this.bind(function(evt) mxEvent.addListener(dlg, 'dragover', ((evt) =>
{ {
if (dropElt == null) if (dropElt == null)
{ {
@ -2037,7 +2037,7 @@ let FilenameDialog = function(editorUi, filename, buttonText, fn, label, validat
evt.preventDefault(); evt.preventDefault();
})); }));
mxEvent.addListener(dlg, 'drop', this.bind(function(evt) mxEvent.addListener(dlg, 'drop', ((evt) =>
{ {
if (dropElt != null) if (dropElt != null)
{ {
@ -2325,7 +2325,7 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
// Adds listener for double click handling on background // Adds listener for double click handling on background
mxEvent.addListener(this.backgroundPageShape.node, 'dblclick', mxEvent.addListener(this.backgroundPageShape.node, 'dblclick',
this.bind(function(evt) ((evt) =>
{ {
graph.dblClick(evt); graph.dblClick(evt);
}) })
@ -2334,11 +2334,11 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
// Adds basic listeners for graph event dispatching outside of the // Adds basic listeners for graph event dispatching outside of the
// container and finishing the handling of a single gesture // container and finishing the handling of a single gesture
mxEvent.addGestureListeners(this.backgroundPageShape.node, mxEvent.addGestureListeners(this.backgroundPageShape.node,
this.bind(function(evt) ((evt) =>
{ {
graph.fireMouseEvent(mxEvent.MOUSE_DOWN, new InternalMouseEvent(evt)); graph.fireMouseEvent(mxEvent.MOUSE_DOWN, new InternalMouseEvent(evt));
}), }),
this.bind(function(evt) ((evt) =>
{ {
// Hides the tooltip if mouse is outside container // Hides the tooltip if mouse is outside container
if (graph.tooltipHandler != null && graph.tooltipHandler.isHideOnHover()) if (graph.tooltipHandler != null && graph.tooltipHandler.isHideOnHover())
@ -2351,7 +2351,7 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
graph.fireMouseEvent(mxEvent.MOUSE_MOVE, new InternalMouseEvent(evt)); graph.fireMouseEvent(mxEvent.MOUSE_MOVE, new InternalMouseEvent(evt));
} }
}), }),
this.bind(function(evt) ((evt) =>
{ {
graph.fireMouseEvent(mxEvent.MOUSE_UP, new InternalMouseEvent(evt)); graph.fireMouseEvent(mxEvent.MOUSE_UP, new InternalMouseEvent(evt));
}) })
@ -2530,7 +2530,7 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
this.verticalPageBreaks = []; this.verticalPageBreaks = [];
} }
let drawPageBreaks = this.bind(function(breaks) let drawPageBreaks = ((breaks) =>
{ {
if (breaks != null) if (breaks != null)
{ {
@ -2605,7 +2605,7 @@ FilenameDialog.createFileTypes = function(editorUi, nameInput, types)
{ {
let marker = mxConnectionHandlerCreateMarker.apply(this, arguments); let marker = mxConnectionHandlerCreateMarker.apply(this, arguments);
marker.intersects = this.bind(function(state, evt) marker.intersects = ((state, evt) =>
{ {
if (this.isConnecting()) if (this.isConnecting())
{ {

162
docs/stashed/grapheditor/www/js/EditorUi.js
View File

@ -75,7 +75,7 @@ EditorUi = function(editor, container, lightbox)
this.refresh(); this.refresh();
// Disables HTML and text selection // Disables HTML and text selection
let textEditing = this.bind(function(evt) let textEditing = ((evt) =>
{ {
if (evt == null) if (evt == null)
{ {
@ -177,7 +177,7 @@ EditorUi = function(editor, container, lightbox)
} }
// Adds tooltip when mouse is over scrollbars to show space-drag panning option // Adds tooltip when mouse is over scrollbars to show space-drag panning option
mxEvent.addListener(this.diagramContainer, 'mousemove', this.bind(function(evt) mxEvent.addListener(this.diagramContainer, 'mousemove', ((evt) =>
{ {
let off = getOffset(this.diagramContainer); let off = getOffset(this.diagramContainer);
@ -203,7 +203,7 @@ EditorUi = function(editor, container, lightbox)
return spaceKeyPressed || hoverIconsIsResetEvent.apply(this, arguments); return spaceKeyPressed || hoverIconsIsResetEvent.apply(this, arguments);
}; };
this.keydownHandler = this.bind(function(evt) this.keydownHandler = ((evt) =>
{ {
if (evt.which == 32 /* Space */ && !graph.isEditing()) if (evt.which == 32 /* Space */ && !graph.isEditing())
{ {
@ -225,7 +225,7 @@ EditorUi = function(editor, container, lightbox)
mxEvent.addListener(document, 'keydown', this.keydownHandler); mxEvent.addListener(document, 'keydown', this.keydownHandler);
this.keyupHandler = this.bind(function(evt) this.keyupHandler = ((evt) =>
{ {
graph.container.style.cursor = ''; graph.container.style.cursor = '';
spaceKeyPressed = false; spaceKeyPressed = false;
@ -271,7 +271,7 @@ EditorUi = function(editor, container, lightbox)
let sizeMenu = null; let sizeMenu = null;
let nodes = null; let nodes = null;
let updateToolbar = this.bind(function() let updateToolbar = (() =>
{ {
if (this.toolbar != null && textMode != graph.cellEditor.isContentEditing()) if (this.toolbar != null && textMode != graph.cellEditor.isContentEditing())
{ {
@ -415,14 +415,14 @@ EditorUi = function(editor, container, lightbox)
// Installs context menu // Installs context menu
if (this.menus != null) if (this.menus != null)
{ {
graph.popupMenuHandler.factoryMethod = this.bind(function(menu, cell, evt) graph.popupMenuHandler.factoryMethod = ((menu, cell, evt) =>
{ {
this.menus.createPopupMenu(menu, cell, evt); this.menus.createPopupMenu(menu, cell, evt);
}); });
} }
// Hides context menu // Hides context menu
mxEvent.addGestureListeners(document, this.bind(function(evt) mxEvent.addGestureListeners(document, ((evt) =>
{ {
graph.popupMenuHandler.hideMenu(); graph.popupMenuHandler.hideMenu();
})); }));
@ -672,7 +672,7 @@ EditorUi = function(editor, container, lightbox)
insertHandler(cells); insertHandler(cells);
}); });
this.addListener('styleChanged', this.bind(function(sender, evt) this.addListener('styleChanged', ((sender, evt) =>
{ {
// Checks if edges and/or vertices were modified // Checks if edges and/or vertices were modified
let cells = evt.getProperty('cells'); let cells = evt.getProperty('cells');
@ -851,7 +851,7 @@ EditorUi = function(editor, container, lightbox)
// Update font size and font family labels // Update font size and font family labels
if (this.toolbar != null) if (this.toolbar != null)
{ {
let update = this.bind(function() let update = (() =>
{ {
let ff = graph.currentVertexStyle['fontFamily'] || 'Helvetica'; let ff = graph.currentVertexStyle['fontFamily'] || 'Helvetica';
let fs = String(graph.currentVertexStyle['fontSize'] || '12'); let fs = String(graph.currentVertexStyle['fontSize'] || '12');
@ -889,7 +889,7 @@ EditorUi = function(editor, container, lightbox)
}); });
// Global handler to hide the current menu // Global handler to hide the current menu
this.gestureHandler = this.bind(function(evt) this.gestureHandler = ((evt) =>
{ {
if (this.currentMenu != null && mxEvent.getSource(evt) != this.currentMenu.div) if (this.currentMenu != null && mxEvent.getSource(evt) != this.currentMenu.div)
{ {
@ -902,9 +902,9 @@ EditorUi = function(editor, container, lightbox)
// Updates the editor UI after the window has been resized or the orientation changes // Updates the editor UI after the window has been resized or the orientation changes
// Timeout is workaround for old IE versions which have a delay for DOM client sizes. // Timeout is workaround for old IE versions which have a delay for DOM client sizes.
// Should not use delay > 0 to avoid handle multiple repaints during window resize // Should not use delay > 0 to avoid handle multiple repaints during window resize
this.resizeHandler = this.bind(function() this.resizeHandler = (() =>
{ {
window.setTimeout(this.bind(function() window.setTimeout((() =>
{ {
if (this.editor.graph != null) if (this.editor.graph != null)
{ {
@ -915,7 +915,7 @@ EditorUi = function(editor, container, lightbox)
mxEvent.addListener(window, 'resize', this.resizeHandler); mxEvent.addListener(window, 'resize', this.resizeHandler);
this.orientationChangeHandler = this.bind(function() this.orientationChangeHandler = (() =>
{ {
this.refresh(); this.refresh();
}); });
@ -926,7 +926,7 @@ EditorUi = function(editor, container, lightbox)
// http://stackoverflow.com/questions/19012135/ios-7-ipad-safari-landscape-innerheight-outerheight-layout-issue // http://stackoverflow.com/questions/19012135/ios-7-ipad-safari-landscape-innerheight-outerheight-layout-issue
if (mxClient.IS_IOS && !window.navigator.standalone) if (mxClient.IS_IOS && !window.navigator.standalone)
{ {
this.scrollHandler = this.bind(function() this.scrollHandler = (() =>
{ {
window.scrollTo(0, 0); window.scrollTo(0, 0);
}); });
@ -937,7 +937,7 @@ EditorUi = function(editor, container, lightbox)
/** /**
* Sets the initial scrollbar locations after a file was loaded. * Sets the initial scrollbar locations after a file was loaded.
*/ */
this.editor.addListener('resetGraphView', this.bind(function() this.editor.addListener('resetGraphView', (() =>
{ {
this.resetScrollbars(); this.resetScrollbars();
})); }));
@ -945,12 +945,12 @@ EditorUi = function(editor, container, lightbox)
/** /**
* Repaints the grid. * Repaints the grid.
*/ */
this.addListener('gridEnabledChanged', this.bind(function() this.addListener('gridEnabledChanged', (() =>
{ {
graph.view.validateBackground(); graph.view.validateBackground();
})); }));
this.addListener('backgroundColorChanged', this.bind(function() this.addListener('backgroundColorChanged', (() =>
{ {
graph.view.validateBackground(); graph.view.validateBackground();
})); }));
@ -958,7 +958,7 @@ EditorUi = function(editor, container, lightbox)
/** /**
* Repaints the grid. * Repaints the grid.
*/ */
graph.addListener('gridSizeChanged', this.bind(function() graph.addListener('gridSizeChanged', (() =>
{ {
if (graph.isGridEnabled()) if (graph.isGridEnabled())
{ {
@ -1062,7 +1062,7 @@ EditorUi.prototype.init = function()
} }
// Hides tooltips and connection points when scrolling // Hides tooltips and connection points when scrolling
mxEvent.addListener(graph.container, 'scroll', this.bind(function() mxEvent.addListener(graph.container, 'scroll', (() =>
{ {
graph.tooltipHandler.hide(); graph.tooltipHandler.hide();
@ -1073,7 +1073,7 @@ EditorUi.prototype.init = function()
})); }));
// Hides tooltip on escape // Hides tooltip on escape
graph.addListener(mxEvent.ESCAPE, this.bind(function() graph.addListener(mxEvent.ESCAPE, (() =>
{ {
graph.tooltipHandler.hide(); graph.tooltipHandler.hide();
let rb = graph.getRubberband(); let rb = graph.getRubberband();
@ -1084,12 +1084,12 @@ EditorUi.prototype.init = function()
} }
})); }));
mxEvent.addListener(graph.container, 'keydown', this.bind(function(evt) mxEvent.addListener(graph.container, 'keydown', ((evt) =>
{ {
this.onKeyDown(evt); this.onKeyDown(evt);
})); }));
mxEvent.addListener(graph.container, 'keypress', this.bind(function(evt) mxEvent.addListener(graph.container, 'keypress', ((evt) =>
{ {
this.onKeyPress(evt); this.onKeyPress(evt);
})); }));
@ -1098,12 +1098,12 @@ EditorUi.prototype.init = function()
this.addUndoListener(); this.addUndoListener();
this.addBeforeUnloadListener(); this.addBeforeUnloadListener();
graph.getSelectionModel().addListener(mxEvent.CHANGE, this.bind(function() graph.getSelectionModel().addListener(mxEvent.CHANGE, (() =>
{ {
this.updateActionStates(); this.updateActionStates();
})); }));
graph.getModel().addListener(mxEvent.CHANGE, this.bind(function() graph.getModel().addListener(mxEvent.CHANGE, (() =>
{ {
this.updateActionStates(); this.updateActionStates();
})); }));
@ -1141,7 +1141,7 @@ EditorUi.prototype.installShapePicker = function()
let ui = this; let ui = this;
// Uses this event to process mouseDown to check the selection state before it is changed // Uses this event to process mouseDown to check the selection state before it is changed
graph.addListener(mxEvent.FIRE_MOUSE_EVENT, this.bind(function(sender, evt) graph.addListener(mxEvent.FIRE_MOUSE_EVENT, ((sender, evt) =>
{ {
if (evt.getProperty('eventName') == 'mouseDown') if (evt.getProperty('eventName') == 'mouseDown')
{ {
@ -1149,17 +1149,17 @@ EditorUi.prototype.installShapePicker = function()
} }
})); }));
graph.addListener(mxEvent.ESCAPE, this.bind(function() graph.addListener(mxEvent.ESCAPE, (() =>
{ {
ui.hideShapePicker(true); ui.hideShapePicker(true);
})); }));
graph.getSelectionModel().addListener(mxEvent.CHANGE, this.bind(function() graph.getSelectionModel().addListener(mxEvent.CHANGE, (() =>
{ {
ui.hideShapePicker(true); ui.hideShapePicker(true);
})); }));
graph.getModel().addListener(mxEvent.CHANGE, this.bind(function() graph.getModel().addListener(mxEvent.CHANGE, (() =>
{ {
ui.hideShapePicker(true); ui.hideShapePicker(true);
})); }));
@ -1185,7 +1185,7 @@ EditorUi.prototype.installShapePicker = function()
let pt = convertPoint(this.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt)); let pt = convertPoint(this.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt));
// Asynchronous to avoid direct insert after double tap // Asynchronous to avoid direct insert after double tap
window.setTimeout(this.bind(function() window.setTimeout((() =>
{ {
ui.showShapePicker(pt.x, pt.y); ui.showShapePicker(pt.x, pt.y);
}), 30); }), 30);
@ -1215,7 +1215,7 @@ EditorUi.prototype.installShapePicker = function()
if (!this.graph.isCloneEvent(evt) && !mxEvent.isShiftDown(evt)) if (!this.graph.isCloneEvent(evt) && !mxEvent.isShiftDown(evt))
{ {
this.graph.connectVertex(state.cell, dir, this.graph.defaultEdgeLength, evt, null, null, this.bind(function(x, y, execute) this.graph.connectVertex(state.cell, dir, this.graph.defaultEdgeLength, evt, null, null, ((x, y, execute) =>
{ {
let temp = graph.getCompositeParent(state.cell); let temp = graph.getCompositeParent(state.cell);
let geo = temp.getGeometry(); let geo = temp.getGeometry();
@ -1229,14 +1229,14 @@ EditorUi.prototype.installShapePicker = function()
} }
// Asynchronous to avoid direct insert after double tap // Asynchronous to avoid direct insert after double tap
window.setTimeout(this.bind(function() window.setTimeout((() =>
{ {
ui.showShapePicker(me.getGraphX(), me.getGraphY(), temp, this.bind(function(cell) ui.showShapePicker(me.getGraphX(), me.getGraphY(), temp, ((cell) =>
{ {
execute(cell); execute(cell);
}), dir); }), dir);
}), 30); }), 30);
}), this.bind(function(result) }), ((result) =>
{ {
this.graph.selectCellsForConnectVertex(result, evt, this); this.graph.selectCellsForConnectVertex(result, evt, this);
})); }));
@ -1280,7 +1280,7 @@ EditorUi.prototype.showShapePicker = function(x, y, source, callback, direction)
graph.container.appendChild(div); graph.container.appendChild(div);
let addCell = this.bind(function(cell) let addCell = ((cell) =>
{ {
// Wrapper needed to catch events // Wrapper needed to catch events
let node = document.createElement('a'); let node = document.createElement('a');
@ -1364,7 +1364,7 @@ EditorUi.prototype.showShapePicker = function(x, y, source, callback, direction)
*/ */
EditorUi.prototype.getCellsForShapePicker = function(cell) EditorUi.prototype.getCellsForShapePicker = function(cell)
{ {
let createVertex = this.bind(function(style, w, h, value) let createVertex = ((style, w, h, value) =>
{ {
return this.editor.graph.createVertex(null, null, value || '', 0, 0, w || 120, h || 60, style, false); return this.editor.graph.createVertex(null, null, value || '', 0, 0, w || 120, h || 60, style, false);
}); });
@ -1781,7 +1781,7 @@ EditorUi.prototype.initCanvas = function()
if (this.editor.isChromelessView()) if (this.editor.isChromelessView())
{ {
resize = this.bind(function(autoscale, maxScale, cx, cy) resize = ((autoscale, maxScale, cx, cy) =>
{ {
if (graph.container != null && !graph.isViewer()) if (graph.container != null && !graph.isViewer())
{ {
@ -1835,13 +1835,13 @@ EditorUi.prototype.initCanvas = function()
this.chromelessResize = resize; this.chromelessResize = resize;
// Hook for subclassers for override // Hook for subclassers for override
this.chromelessWindowResize = this.bind(function() this.chromelessWindowResize = (() =>
{ {
this.chromelessResize(false); this.chromelessResize(false);
}); });
// Removable resize listener // Removable resize listener
let autoscaleResize = this.bind(function() let autoscaleResize = (() =>
{ {
this.chromelessWindowResize(false); this.chromelessWindowResize(false);
}); });
@ -1853,17 +1853,17 @@ EditorUi.prototype.initCanvas = function()
mxEvent.removeListener(window, 'resize', autoscaleResize); mxEvent.removeListener(window, 'resize', autoscaleResize);
}); });
this.editor.addListener('resetGraphView', this.bind(function() this.editor.addListener('resetGraphView', (() =>
{ {
this.chromelessResize(true); this.chromelessResize(true);
})); }));
this.actions.get('zoomIn').funct = this.bind(function(evt) this.actions.get('zoomIn').funct = ((evt) =>
{ {
graph.zoomIn(); graph.zoomIn();
this.chromelessResize(false); this.chromelessResize(false);
}); });
this.actions.get('zoomOut').funct = this.bind(function(evt) this.actions.get('zoomOut').funct = ((evt) =>
{ {
graph.zoomOut(); graph.zoomOut();
this.chromelessResize(false); this.chromelessResize(false);
@ -1887,7 +1887,7 @@ EditorUi.prototype.initCanvas = function()
setPrefixedStyle(this.chromelessToolbar.style, 'borderRadius', '20px'); setPrefixedStyle(this.chromelessToolbar.style, 'borderRadius', '20px');
setPrefixedStyle(this.chromelessToolbar.style, 'transition', 'opacity 600ms ease-in-out'); setPrefixedStyle(this.chromelessToolbar.style, 'transition', 'opacity 600ms ease-in-out');
let updateChromelessToolbarPosition = this.bind(function() let updateChromelessToolbarPosition = (() =>
{ {
let css = getCurrentStyle(graph.container); let css = getCurrentStyle(graph.container);
@ -1907,7 +1907,7 @@ EditorUi.prototype.initCanvas = function()
let btnCount = 0; let btnCount = 0;
let addButton = this.bind(function(fn, imgSrc, tip) let addButton = ((fn, imgSrc, tip) =>
{ {
btnCount++; btnCount++;
@ -1934,7 +1934,7 @@ EditorUi.prototype.initCanvas = function()
if (toolbarConfig.backBtn != null) if (toolbarConfig.backBtn != null)
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
window.location.href = toolbarConfig.backBtn.url; window.location.href = toolbarConfig.backBtn.url;
mxEvent.consume(evt); mxEvent.consume(evt);
@ -1943,7 +1943,7 @@ EditorUi.prototype.initCanvas = function()
if (this.isPagesEnabled()) if (this.isPagesEnabled())
{ {
let prevButton = addButton(this.bind(function(evt) let prevButton = addButton(((evt) =>
{ {
this.actions.get('previousPage').funct(); this.actions.get('previousPage').funct();
mxEvent.consume(evt); mxEvent.consume(evt);
@ -1958,13 +1958,13 @@ EditorUi.prototype.initCanvas = function()
pageInfo.style.color = '#ffffff'; pageInfo.style.color = '#ffffff';
this.chromelessToolbar.appendChild(pageInfo); this.chromelessToolbar.appendChild(pageInfo);
let nextButton = addButton(this.bind(function(evt) let nextButton = addButton(((evt) =>
{ {
this.actions.get('nextPage').funct(); this.actions.get('nextPage').funct();
mxEvent.consume(evt); mxEvent.consume(evt);
}), Editor.nextLargeImage, Resources.get('nextPage')); }), Editor.nextLargeImage, Resources.get('nextPage'));
let updatePageInfo = this.bind(function() let updatePageInfo = (() =>
{ {
if (this.pages != null && this.pages.length > 1 && this.currentPage != null) if (this.pages != null && this.pages.length > 1 && this.currentPage != null)
{ {
@ -1978,7 +1978,7 @@ EditorUi.prototype.initCanvas = function()
nextButton.style.paddingLeft = '4px'; nextButton.style.paddingLeft = '4px';
nextButton.style.paddingRight = '0px'; nextButton.style.paddingRight = '0px';
let updatePageButtons = this.bind(function() let updatePageButtons = (() =>
{ {
if (this.pages != null && this.pages.length > 1 && this.currentPage != null) if (this.pages != null && this.pages.length > 1 && this.currentPage != null)
{ {
@ -2000,19 +2000,19 @@ EditorUi.prototype.initCanvas = function()
this.editor.addListener('pageSelected', updatePageInfo); this.editor.addListener('pageSelected', updatePageInfo);
} }
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
this.actions.get('zoomOut').funct(); this.actions.get('zoomOut').funct();
mxEvent.consume(evt); mxEvent.consume(evt);
}), Editor.zoomOutLargeImage, Resources.get('zoomOut') + ' (Alt+Mousewheel)'); }), Editor.zoomOutLargeImage, Resources.get('zoomOut') + ' (Alt+Mousewheel)');
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
this.actions.get('zoomIn').funct(); this.actions.get('zoomIn').funct();
mxEvent.consume(evt); mxEvent.consume(evt);
}), Editor.zoomInLargeImage, Resources.get('zoomIn') + ' (Alt+Mousewheel)'); }), Editor.zoomInLargeImage, Resources.get('zoomIn') + ' (Alt+Mousewheel)');
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
if (graph.isLightboxView()) if (graph.isLightboxView())
{ {
@ -2039,7 +2039,7 @@ EditorUi.prototype.initCanvas = function()
let fadeThread = null; let fadeThread = null;
var fadeThread2 = null; var fadeThread2 = null;
let fadeOut = this.bind(function(delay) let fadeOut = ((delay) =>
{ {
if (fadeThread != null) if (fadeThread != null)
{ {
@ -2053,12 +2053,12 @@ EditorUi.prototype.initCanvas = function()
fadeThread2 = null; fadeThread2 = null;
} }
fadeThread = window.setTimeout(this.bind(function() fadeThread = window.setTimeout((() =>
{ {
setOpacity(this.chromelessToolbar, 0); setOpacity(this.chromelessToolbar, 0);
fadeThread = null; fadeThread = null;
fadeThread2 = window.setTimeout(this.bind(function() fadeThread2 = window.setTimeout((() =>
{ {
this.chromelessToolbar.style.display = 'none'; this.chromelessToolbar.style.display = 'none';
fadeThread2 = null; fadeThread2 = null;
@ -2066,7 +2066,7 @@ EditorUi.prototype.initCanvas = function()
}), delay || 200); }), delay || 200);
}); });
let fadeIn = this.bind(function(opacity) let fadeIn = ((opacity) =>
{ {
if (fadeThread != null) if (fadeThread != null)
{ {
@ -2088,7 +2088,7 @@ EditorUi.prototype.initCanvas = function()
{ {
this.layersDialog = null; this.layersDialog = null;
let layersButton = addButton(this.bind(function(evt) let layersButton = addButton(((evt) =>
{ {
if (this.layersDialog != null) if (this.layersDialog != null)
{ {
@ -2099,7 +2099,7 @@ EditorUi.prototype.initCanvas = function()
{ {
this.layersDialog = graph.createLayersDialog(); this.layersDialog = graph.createLayersDialog();
mxEvent.addListener(this.layersDialog, 'mouseleave', this.bind(function() mxEvent.addListener(this.layersDialog, 'mouseleave', (() =>
{ {
this.layersDialog.parentNode.removeChild(this.layersDialog); this.layersDialog.parentNode.removeChild(this.layersDialog);
this.layersDialog = null; this.layersDialog = null;
@ -2145,7 +2145,7 @@ EditorUi.prototype.initCanvas = function()
if (this.editor.editButtonLink != null || this.editor.editButtonFunc != null) if (this.editor.editButtonLink != null || this.editor.editButtonFunc != null)
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
if (this.editor.editButtonFunc != null) if (this.editor.editButtonFunc != null)
{ {
@ -2175,7 +2175,7 @@ EditorUi.prototype.initCanvas = function()
if (toolbarConfig.refreshBtn != null) if (toolbarConfig.refreshBtn != null)
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
if (toolbarConfig.refreshBtn.url) if (toolbarConfig.refreshBtn.url)
{ {
@ -2192,7 +2192,7 @@ EditorUi.prototype.initCanvas = function()
if (toolbarConfig.fullscreenBtn != null && window.self !== window.top) if (toolbarConfig.fullscreenBtn != null && window.self !== window.top)
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
if (toolbarConfig.fullscreenBtn.url) if (toolbarConfig.fullscreenBtn.url)
{ {
@ -2211,7 +2211,7 @@ EditorUi.prototype.initCanvas = function()
(graph.lightbox && (urlParams['close'] == '1' || this.container != document.body))) (graph.lightbox && (urlParams['close'] == '1' || this.container != document.body)))
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
if (urlParams['close'] == '1' || toolbarConfig.closeBtn) if (urlParams['close'] == '1' || toolbarConfig.closeBtn)
{ {
@ -2235,7 +2235,7 @@ EditorUi.prototype.initCanvas = function()
graph.container.appendChild(this.chromelessToolbar); graph.container.appendChild(this.chromelessToolbar);
mxEvent.addListener(graph.container, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', this.bind(function(evt) mxEvent.addListener(graph.container, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', ((evt) =>
{ {
if (!mxEvent.isTouchEvent(evt)) if (!mxEvent.isTouchEvent(evt))
{ {
@ -2253,7 +2253,7 @@ EditorUi.prototype.initCanvas = function()
mxEvent.consume(evt); mxEvent.consume(evt);
}); });
mxEvent.addListener(this.chromelessToolbar, 'mouseenter', this.bind(function(evt) mxEvent.addListener(this.chromelessToolbar, 'mouseenter', ((evt) =>
{ {
if (!mxEvent.isShiftDown(evt)) if (!mxEvent.isShiftDown(evt))
{ {
@ -2443,7 +2443,7 @@ EditorUi.prototype.initCanvas = function()
{ {
if (!graph.isMouseDown || forcedZoom) if (!graph.isMouseDown || forcedZoom)
{ {
updateZoomTimeout = window.setTimeout(this.bind(function() updateZoomTimeout = window.setTimeout((() =>
{ {
if (graph.isFastZoomEnabled()) if (graph.isFastZoomEnabled())
{ {
@ -2647,7 +2647,7 @@ EditorUi.prototype.initCanvas = function()
} }
}); });
mxEvent.addMouseWheelListener(this.bind(function(evt, up, force, cx, cy) mxEvent.addMouseWheelListener(((evt, up, force, cx, cy) =>
{ {
if (this.dialogs == null || this.dialogs.length == 0) if (this.dialogs == null || this.dialogs.length == 0)
{ {
@ -2704,7 +2704,7 @@ EditorUi.prototype.initCanvas = function()
*/ */
EditorUi.prototype.addChromelessToolbarItems = function(addButton) EditorUi.prototype.addChromelessToolbarItems = function(addButton)
{ {
addButton(this.bind(function(evt) addButton(((evt) =>
{ {
this.actions.get('print').funct(); this.actions.get('print').funct();
mxEvent.consume(evt); mxEvent.consume(evt);
@ -2832,7 +2832,7 @@ EditorUi.prototype.addBeforeUnloadListener = function()
{ {
// Installs dialog if browser window is closed without saving // Installs dialog if browser window is closed without saving
// This must be disabled during save and image export // This must be disabled during save and image export
window.onbeforeunload = this.bind(function() window.onbeforeunload = (() =>
{ {
if (!this.editor.isChromelessView()) if (!this.editor.isChromelessView())
{ {
@ -2863,7 +2863,7 @@ EditorUi.prototype.open = function()
{ {
if (window.opener != null && window.opener.openFile != null) if (window.opener != null && window.opener.openFile != null)
{ {
window.opener.openFile.setConsumer(this.bind(function(xml, filename) window.opener.openFile.setConsumer(((xml, filename) =>
{ {
try try
{ {
@ -2915,7 +2915,7 @@ EditorUi.prototype.showPopupMenu = function(fn, x, y, evt)
menu.autoExpand = true; menu.autoExpand = true;
// Disables autoexpand and destroys menu when hidden // Disables autoexpand and destroys menu when hidden
menu.hideMenu = this.bind(function() menu.hideMenu = (() =>
{ {
mxPopupMenu.prototype.hideMenu.apply(menu, arguments); mxPopupMenu.prototype.hideMenu.apply(menu, arguments);
menu.destroy(); menu.destroy();
@ -3438,7 +3438,7 @@ EditorUi.prototype.addUndoListener = function()
let undoMgr = this.editor.undoManager; let undoMgr = this.editor.undoManager;
let undoListener = this.bind(function() let undoListener = (() =>
{ {
undo.setEnabled(this.canUndo()); undo.setEnabled(this.canUndo());
redo.setEnabled(this.canRedo()); redo.setEnabled(this.canRedo());
@ -3792,7 +3792,7 @@ EditorUi.prototype.createUi = function()
this.statusContainer = this.createStatusContainer(); this.statusContainer = this.createStatusContainer();
// Connects the status bar to the editor status // Connects the status bar to the editor status
this.editor.addListener('statusChanged', this.bind(function() this.editor.addListener('statusChanged', (() =>
{ {
this.setStatusText(this.editor.getStatus()); this.setStatusText(this.editor.getStatus());
})); }));
@ -3855,7 +3855,7 @@ EditorUi.prototype.createUi = function()
{ {
this.container.appendChild(this.hsplit); this.container.appendChild(this.hsplit);
this.addSplitHandler(this.hsplit, true, 0, this.bind(function(value) this.addSplitHandler(this.hsplit, true, 0, ((value) =>
{ {
this.hsplitPosition = value; this.hsplitPosition = value;
this.refresh(); this.refresh();
@ -3941,7 +3941,7 @@ EditorUi.prototype.addSplitHandler = function(elt, horizontal, dx, onChange)
elt.style.touchAction = 'none'; elt.style.touchAction = 'none';
} }
let getValue = this.bind(function() let getValue = (() =>
{ {
let result = parseInt(((horizontal) ? elt.style.left : elt.style.bottom)); let result = parseInt(((horizontal) ? elt.style.left : elt.style.bottom));
@ -3985,7 +3985,7 @@ EditorUi.prototype.addSplitHandler = function(elt, horizontal, dx, onChange)
mxEvent.consume(evt); mxEvent.consume(evt);
}); });
mxEvent.addListener(elt, 'click', this.bind(function(evt) mxEvent.addListener(elt, 'click', ((evt) =>
{ {
if (!ignoreClick && this.hsplitClickEnabled) if (!ignoreClick && this.hsplitClickEnabled)
{ {
@ -4086,7 +4086,7 @@ EditorUi.prototype.hideDialog = function(cancel, isEsc)
if (this.dialog == null && this.editor.graph.container.style.visibility != 'hidden') if (this.dialog == null && this.editor.graph.container.style.visibility != 'hidden')
{ {
window.setTimeout(this.bind(function() window.setTimeout((() =>
{ {
if (this.editor.graph.isEditing() && this.editor.graph.cellEditor.textarea != null) if (this.editor.graph.isEditing() && this.editor.graph.cellEditor.textarea != null)
{ {
@ -4166,7 +4166,7 @@ EditorUi.prototype.pickColor = function(color, apply)
EditorUi.prototype.openFile = function() EditorUi.prototype.openFile = function()
{ {
// Closes dialog after open // Closes dialog after open
window.openFile = new OpenFile(this.bind(function(cancel) window.openFile = new OpenFile(((cancel) =>
{ {
this.hideDialog(cancel); this.hideDialog(cancel);
})); }));
@ -4273,10 +4273,10 @@ EditorUi.prototype.saveFile = function(forceDialog)
} }
else else
{ {
let dlg = new FilenameDialog(this, this.editor.getOrCreateFilename(), Resources.get('save'), this.bind(function(name) let dlg = new FilenameDialog(this, this.editor.getOrCreateFilename(), Resources.get('save'), ((name) =>
{ {
this.save(name); this.save(name);
}), null, this.bind(function(name) }), null, ((name) =>
{ {
if (name != null && name.length > 0) if (name != null && name.length > 0)
{ {
@ -4373,7 +4373,7 @@ EditorUi.prototype.executeLayout = function(exec, animate, post)
{ {
// New API for animating graph layout results asynchronously // New API for animating graph layout results asynchronously
let morph = new mxMorphing(graph); let morph = new mxMorphing(graph);
morph.addListener(mxEvent.DONE, this.bind(function() morph.addListener(mxEvent.DONE, (() =>
{ {
graph.getModel().endUpdate(); graph.getModel().endUpdate();
@ -4458,7 +4458,7 @@ EditorUi.prototype.showDataDialog = function(cell)
*/ */
EditorUi.prototype.showBackgroundImageDialog = function(apply, img) EditorUi.prototype.showBackgroundImageDialog = function(apply, img)
{ {
apply = (apply != null) ? apply : this.bind(function(image) apply = (apply != null) ? apply : ((image) =>
{ {
let change = new ChangePageSetup(this, null, image); let change = new ChangePageSetup(this, null, image);
change.ignoreColor = true; change.ignoreColor = true;
@ -4858,7 +4858,7 @@ EditorUi.prototype.createKeyHandler = function(editor)
}; };
// Binds keystrokes to actions // Binds keystrokes to actions
keyHandler.bindAction = this.bind(function(code, control, key, shift) keyHandler.bindAction = ((code, control, key, shift) =>
{ {
let action = this.actions.get(key); let action = this.actions.get(key);

144
docs/stashed/grapheditor/www/js/Format.js
View File

@ -62,7 +62,7 @@ Format.prototype.init = function()
let editor = ui.editor; let editor = ui.editor;
let graph = editor.graph; let graph = editor.graph;
this.update = this.bind(function(sender, evt) this.update = ((sender, evt) =>
{ {
this.clearSelectionState(); this.clearSelectionState();
this.refresh(); this.refresh();
@ -72,17 +72,17 @@ Format.prototype.init = function()
graph.addListener(mxEvent.EDITING_STARTED, this.update); graph.addListener(mxEvent.EDITING_STARTED, this.update);
graph.addListener(mxEvent.EDITING_STOPPED, this.update); graph.addListener(mxEvent.EDITING_STOPPED, this.update);
graph.getModel().addListener(mxEvent.CHANGE, this.update); graph.getModel().addListener(mxEvent.CHANGE, this.update);
graph.addListener(mxEvent.ROOT, this.bind(function() graph.addListener(mxEvent.ROOT, (() =>
{ {
this.refresh(); this.refresh();
})); }));
ui.addListener('styleChanged', this.bind(function(sender, evt) ui.addListener('styleChanged', ((sender, evt) =>
{ {
this.refresh(); this.refresh();
})); }));
editor.addListener('autosaveChanged', this.bind(function() editor.addListener('autosaveChanged', (() =>
{ {
this.refresh(); this.refresh();
})); }));
@ -406,7 +406,7 @@ Format.prototype.refresh = function()
// Prevents text selection // Prevents text selection
mxEvent.addListener(label, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', mxEvent.addListener(label, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
this.bind(function(evt) ((evt) =>
{ {
evt.preventDefault(); evt.preventDefault();
})); }));
@ -415,9 +415,9 @@ Format.prototype.refresh = function()
let currentLabel = null; let currentLabel = null;
let currentPanel = null; let currentPanel = null;
let addClickHandler = this.bind(function(elt, panel, index) let addClickHandler = ((elt, panel, index) =>
{ {
let clickHandler = this.bind(function(evt) let clickHandler = ((evt) =>
{ {
if (currentLabel != elt) if (currentLabel != elt)
{ {
@ -461,7 +461,7 @@ Format.prototype.refresh = function()
// Prevents text selection // Prevents text selection
mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
this.bind(function(evt) ((evt) =>
{ {
evt.preventDefault(); evt.preventDefault();
})); }));
@ -678,7 +678,7 @@ BaseFormatPanel.prototype.installInputHandler = function(input, key, defaultValu
let selState = null; let selState = null;
let updating = false; let updating = false;
let update = this.bind(function(evt) let update = ((evt) =>
{ {
let value = (isFloat) ? parseFloat(input.value) : parseInt(input.value); let value = (isFloat) ? parseFloat(input.value) : parseInt(input.value);
@ -1167,7 +1167,7 @@ BaseFormatPanel.prototype.createColorOption = function(label, getColorFn, setCol
} }
}; };
btn = button('', this.bind(function(evt) btn = button('', ((evt) =>
{ {
this.editorUi.pickColor(value, function(color) this.editorUi.pickColor(value, function(color)
{ {
@ -1376,7 +1376,7 @@ BaseFormatPanel.prototype.createRelativeOption = function(label, key, width, han
write(div, label); write(div, label);
div.style.fontWeight = 'bold'; div.style.fontWeight = 'bold';
let update = this.bind(function(evt) let update = ((evt) =>
{ {
if (handler != null) if (handler != null)
{ {
@ -1411,7 +1411,7 @@ BaseFormatPanel.prototype.createRelativeOption = function(label, key, width, han
if (key != null) if (key != null)
{ {
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
if (force || input != document.activeElement) if (force || input != document.activeElement)
{ {
@ -1474,7 +1474,7 @@ BaseFormatPanel.prototype.addLabel = function(div, title, right, width)
*/ */
BaseFormatPanel.prototype.addKeyHandler = function(input, listener) BaseFormatPanel.prototype.addKeyHandler = function(input, listener)
{ {
mxEvent.addListener(input, 'keydown', this.bind(function(e) mxEvent.addListener(input, 'keydown', ((e) =>
{ {
if (e.keyCode == 13) if (e.keyCode == 13)
{ {
@ -1623,7 +1623,7 @@ ArrangePanel.prototype.addTable = function(div)
let btns = [ let btns = [
ui.toolbar.addButton('geSprite-insertcolumnbefore', Resources.get('insertColumnBefore'), ui.toolbar.addButton('geSprite-insertcolumnbefore', Resources.get('insertColumnBefore'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1635,7 +1635,7 @@ ArrangePanel.prototype.addTable = function(div)
} }
}), panel), }), panel),
ui.toolbar.addButton('geSprite-insertcolumnafter', Resources.get('insertColumnAfter'), ui.toolbar.addButton('geSprite-insertcolumnafter', Resources.get('insertColumnAfter'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1647,7 +1647,7 @@ ArrangePanel.prototype.addTable = function(div)
} }
}), panel), }), panel),
ui.toolbar.addButton('geSprite-deletecolumn', Resources.get('deleteColumn'), ui.toolbar.addButton('geSprite-deletecolumn', Resources.get('deleteColumn'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1659,7 +1659,7 @@ ArrangePanel.prototype.addTable = function(div)
} }
}), panel), }), panel),
ui.toolbar.addButton('geSprite-insertrowbefore', Resources.get('insertRowBefore'), ui.toolbar.addButton('geSprite-insertrowbefore', Resources.get('insertRowBefore'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1671,7 +1671,7 @@ ArrangePanel.prototype.addTable = function(div)
} }
}), panel), }), panel),
ui.toolbar.addButton('geSprite-insertrowafter', Resources.get('insertRowAfter'), ui.toolbar.addButton('geSprite-insertrowafter', Resources.get('insertRowAfter'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1683,7 +1683,7 @@ ArrangePanel.prototype.addTable = function(div)
} }
}), panel), }), panel),
ui.toolbar.addButton('geSprite-deleterow', Resources.get('deleteRow'), ui.toolbar.addButton('geSprite-deleterow', Resources.get('deleteRow'),
this.bind(function() (() =>
{ {
try try
{ {
@ -1841,7 +1841,7 @@ ArrangePanel.prototype.addGroupOps = function(div)
br(div); br(div);
} }
btn = button(Resources.get('clearWaypoints'), this.bind(function(evt) btn = button(Resources.get('clearWaypoints'), ((evt) =>
{ {
this.editorUi.actions.get('clearWaypoints').funct(); this.editorUi.actions.get('clearWaypoints').funct();
})); }));
@ -1861,7 +1861,7 @@ ArrangePanel.prototype.addGroupOps = function(div)
br(div); br(div);
} }
btn = button(Resources.get('editData'), this.bind(function(evt) btn = button(Resources.get('editData'), ((evt) =>
{ {
this.editorUi.actions.get('editData').funct(); this.editorUi.actions.get('editData').funct();
})); }));
@ -1872,7 +1872,7 @@ ArrangePanel.prototype.addGroupOps = function(div)
div.appendChild(btn); div.appendChild(btn);
count++; count++;
btn = button(Resources.get('editLink'), this.bind(function(evt) btn = button(Resources.get('editLink'), ((evt) =>
{ {
this.editorUi.actions.get('editLink').funct(); this.editorUi.actions.get('editLink').funct();
})); }));
@ -2075,7 +2075,7 @@ ArrangePanel.prototype.addAngle = function(div)
if (input != null) if (input != null)
{ {
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
if (force || document.activeElement != input) if (force || document.activeElement != input)
{ {
@ -2323,7 +2323,7 @@ ArrangePanel.prototype.addGeometry = function(container)
this.addLabel(div2, Resources.get('left'), 84); this.addLabel(div2, Resources.get('left'), 84);
this.addLabel(div2, Resources.get('top'), 20); this.addLabel(div2, Resources.get('top'), 20);
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
rect = this.format.getSelectionState(); rect = this.format.getSelectionState();
@ -2650,7 +2650,7 @@ ArrangePanel.prototype.addEdgeGeometry = function(container)
this.addKeyHandler(xt, listener); this.addKeyHandler(xt, listener);
this.addKeyHandler(yt, listener); this.addKeyHandler(yt, listener);
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
rect = this.format.getSelectionState(); rect = this.format.getSelectionState();
let cell = graph.getSelectionCell(); let cell = graph.getSelectionCell();
@ -3522,7 +3522,7 @@ TextFormatPanel.prototype.addFont = function(container)
{ {
document.execCommand('inserthorizontalrule', false); document.execCommand('inserthorizontalrule', false);
}, insertPanel), }, insertPanel),
this.editorUi.toolbar.addMenuFunctionInContainer(insertPanel, 'geSprite-table', Resources.get('table'), false, this.bind(function(menu) this.editorUi.toolbar.addMenuFunctionInContainer(insertPanel, 'geSprite-table', Resources.get('table'), false, ((menu) =>
{ {
this.editorUi.menus.addInsertTableItem(menu); this.editorUi.menus.addInsertTableItem(menu);
}))]; }))];
@ -3541,7 +3541,7 @@ TextFormatPanel.prototype.addFont = function(container)
let btns = [ let btns = [
this.editorUi.toolbar.addButton('geSprite-insertcolumnbefore', Resources.get('insertColumnBefore'), this.editorUi.toolbar.addButton('geSprite-insertcolumnbefore', Resources.get('insertColumnBefore'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3556,7 +3556,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel), }), tablePanel),
this.editorUi.toolbar.addButton('geSprite-insertcolumnafter', Resources.get('insertColumnAfter'), this.editorUi.toolbar.addButton('geSprite-insertcolumnafter', Resources.get('insertColumnAfter'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3571,7 +3571,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel), }), tablePanel),
this.editorUi.toolbar.addButton('geSprite-deletecolumn', Resources.get('deleteColumn'), this.editorUi.toolbar.addButton('geSprite-deletecolumn', Resources.get('deleteColumn'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3586,7 +3586,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel), }), tablePanel),
this.editorUi.toolbar.addButton('geSprite-insertrowbefore', Resources.get('insertRowBefore'), this.editorUi.toolbar.addButton('geSprite-insertrowbefore', Resources.get('insertRowBefore'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3601,7 +3601,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel), }), tablePanel),
this.editorUi.toolbar.addButton('geSprite-insertrowafter', Resources.get('insertRowAfter'), this.editorUi.toolbar.addButton('geSprite-insertrowafter', Resources.get('insertRowAfter'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3616,7 +3616,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel), }), tablePanel),
this.editorUi.toolbar.addButton('geSprite-deleterow', Resources.get('deleteRow'), this.editorUi.toolbar.addButton('geSprite-deleterow', Resources.get('deleteRow'),
this.bind(function() (() =>
{ {
try try
{ {
@ -3644,7 +3644,7 @@ TextFormatPanel.prototype.addFont = function(container)
let btns = [ let btns = [
this.editorUi.toolbar.addButton('geSprite-strokecolor', Resources.get('borderColor'), this.editorUi.toolbar.addButton('geSprite-strokecolor', Resources.get('borderColor'),
this.bind(function(evt) ((evt) =>
{ {
if (currentTable != null) if (currentTable != null)
{ {
@ -3679,7 +3679,7 @@ TextFormatPanel.prototype.addFont = function(container)
} }
}), tablePanel2), }), tablePanel2),
this.editorUi.toolbar.addButton('geSprite-fillcolor', Resources.get('backgroundColor'), this.editorUi.toolbar.addButton('geSprite-fillcolor', Resources.get('backgroundColor'),
this.bind(function(evt) ((evt) =>
{ {
// Converts rgb(r,g,b) values // Converts rgb(r,g,b) values
if (currentTable != null) if (currentTable != null)
@ -3716,7 +3716,7 @@ TextFormatPanel.prototype.addFont = function(container)
{ {
let value = currentTable.getAttribute('cellPadding') || 0; let value = currentTable.getAttribute('cellPadding') || 0;
let dlg = new FilenameDialog(ui, value, Resources.get('apply'), this.bind(function(newValue) let dlg = new FilenameDialog(ui, value, Resources.get('apply'), ((newValue) =>
{ {
if (newValue != null && newValue.length > 0) if (newValue != null && newValue.length > 0)
{ {
@ -3769,7 +3769,7 @@ TextFormatPanel.prototype.addFont = function(container)
elt.style.backgroundImage = (selected) ? 'linear-gradient(#c5ecff 0px,#87d4fb 100%)' : ''; elt.style.backgroundImage = (selected) ? 'linear-gradient(#c5ecff 0px,#87d4fb 100%)' : '';
}; };
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
ss = this.format.getSelectionState(); ss = this.format.getSelectionState();
let fontStyle = getValue(ss.style, 'fontStyle', 0); let fontStyle = getValue(ss.style, 'fontStyle', 0);
@ -4304,7 +4304,7 @@ StyleFormatPanel.prototype.addSvgRule = function(container, rule, svg, styleElem
("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : ''; ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
}; };
let addStyleRule = this.bind(function(rule, key, label) let addStyleRule = ((rule, key, label) =>
{ {
let value = trim(rule.style[key]); let value = trim(rule.style[key]);
@ -4364,7 +4364,7 @@ StyleFormatPanel.prototype.addEditOps = function(div)
if (this.editorUi.editor.graph.getSelectionCount() == 1) if (this.editorUi.editor.graph.getSelectionCount() == 1)
{ {
btn = button(Resources.get('editStyle'), this.bind(function(evt) btn = button(Resources.get('editStyle'), ((evt) =>
{ {
this.editorUi.actions.get('editStyle').funct(); this.editorUi.actions.get('editStyle').funct();
})); }));
@ -4378,7 +4378,7 @@ StyleFormatPanel.prototype.addEditOps = function(div)
if (ss.image) if (ss.image)
{ {
var btn2 = button(Resources.get('editImage'), this.bind(function(evt) var btn2 = button(Resources.get('editImage'), ((evt) =>
{ {
this.editorUi.actions.get('image').funct(); this.editorUi.actions.get('image').funct();
})); }));
@ -4454,7 +4454,7 @@ StyleFormatPanel.prototype.addFill = function(container)
let label = (ss.style.shape == 'image') ? Resources.get('background') : Resources.get('fill'); let label = (ss.style.shape == 'image') ? Resources.get('background') : Resources.get('fill');
let defs = (ss.vertices.length >= 1) ? graph.stylesheet.getDefaultVertexStyle() : graph.stylesheet.getDefaultEdgeStyle(); let defs = (ss.vertices.length >= 1) ? graph.stylesheet.getDefaultVertexStyle() : graph.stylesheet.getDefaultEdgeStyle();
let fillPanel = this.createCellColorOption(label, fillKey, (defs[fillKey] != null) ? defs[fillKey] : '#ffffff', null, this.bind(function(color) let fillPanel = this.createCellColorOption(label, fillKey, (defs[fillKey] != null) ? defs[fillKey] : '#ffffff', null, ((color) =>
{ {
graph.updateCellStyles(fillKey, color, graph.getSelectionCells()); graph.updateCellStyles(fillKey, color, graph.getSelectionCells());
})); }));
@ -4487,7 +4487,7 @@ StyleFormatPanel.prototype.addFill = function(container)
fillPanel.appendChild(fillStyleSelect); fillPanel.appendChild(fillStyleSelect);
let listener = this.bind(function() let listener = (() =>
{ {
ss = this.format.getSelectionState(); ss = this.format.getSelectionState();
let value = getValue(ss.style, 'gradientDirection', mxConstants.DIRECTION_SOUTH); let value = getValue(ss.style, 'gradientDirection', mxConstants.DIRECTION_SOUTH);
@ -4645,7 +4645,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
let label = (ss.style.shape == 'image') ? Resources.get('border') : Resources.get('line'); let label = (ss.style.shape == 'image') ? Resources.get('border') : Resources.get('line');
let defs = (ss.vertices.length >= 1) ? graph.stylesheet.getDefaultVertexStyle() : graph.stylesheet.getDefaultEdgeStyle(); let defs = (ss.vertices.length >= 1) ? graph.stylesheet.getDefaultVertexStyle() : graph.stylesheet.getDefaultEdgeStyle();
let lineColor = this.createCellColorOption(label, strokeKey, (defs[strokeKey] != null) ? defs[strokeKey] : '#000000', null, this.bind(function(color) let lineColor = this.createCellColorOption(label, strokeKey, (defs[strokeKey] != null) ? defs[strokeKey] : '#000000', null, ((color) =>
{ {
graph.updateCellStyles(strokeKey, color, graph.getSelectionCells()); graph.updateCellStyles(strokeKey, color, graph.getSelectionCells());
})); }));
@ -4663,7 +4663,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
stylePanel.style.marginTop = '2px'; stylePanel.style.marginTop = '2px';
stylePanel.className = 'geToolbarContainer'; stylePanel.className = 'geToolbarContainer';
let addItem = this.bind(function(menu, width, cssName, keys, values) let addItem = ((menu, width, cssName, keys, values) =>
{ {
let item = this.editorUi.menus.styleChange(menu, '', keys, values, 'geIcon', null); let item = this.editorUi.menus.styleChange(menu, '', keys, values, 'geIcon', null);
@ -4680,7 +4680,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
return item; return item;
}); });
let pattern = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel, 'geSprite-orthogonal', Resources.get('pattern'), false, this.bind(function(menu) let pattern = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel, 'geSprite-orthogonal', Resources.get('pattern'), false, ((menu) =>
{ {
addItem(menu, 75, 'solid', ['dashed', 'dashPattern'], [null, null]).setAttribute('title', Resources.get('solid')); addItem(menu, 75, 'solid', ['dashed', 'dashPattern'], [null, null]).setAttribute('title', Resources.get('solid'));
addItem(menu, 75, 'dashed', ['dashed', 'dashPattern'], ['1', null]).setAttribute('title', Resources.get('dashed')); addItem(menu, 75, 'dashed', ['dashed', 'dashPattern'], ['1', null]).setAttribute('title', Resources.get('dashed'));
@ -4692,7 +4692,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
// Used for mixed selection (vertices and edges) // Used for mixed selection (vertices and edges)
let altStylePanel = stylePanel.cloneNode(false); let altStylePanel = stylePanel.cloneNode(false);
let edgeShape = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-connection', Resources.get('connection'), false, this.bind(function(menu) let edgeShape = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-connection', Resources.get('connection'), false, ((menu) =>
{ {
this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], [null, null, null, null], 'geIcon geSprite geSprite-connection', null, true).setAttribute('title', Resources.get('line')); this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], [null, null, null, null], 'geIcon geSprite geSprite-connection', null, true).setAttribute('title', Resources.get('line'));
this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], ['link', null, null, null], 'geIcon geSprite geSprite-linkedge', null, true).setAttribute('title', Resources.get('link')); this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], ['link', null, null, null], 'geIcon geSprite geSprite-linkedge', null, true).setAttribute('title', Resources.get('link'));
@ -4700,7 +4700,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], ['arrow', null, null, null], 'geIcon geSprite geSprite-simplearrow', null, true).setAttribute('title', Resources.get('simpleArrow')); this.editorUi.menus.styleChange(menu, '', ['shape', 'startSize', 'endSize', 'width'], ['arrow', null, null, null], 'geIcon geSprite geSprite-simplearrow', null, true).setAttribute('title', Resources.get('simpleArrow'));
})); }));
let altPattern = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-orthogonal', Resources.get('pattern'), false, this.bind(function(menu) let altPattern = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-orthogonal', Resources.get('pattern'), false, ((menu) =>
{ {
addItem(menu, 33, 'solid', ['dashed', 'dashPattern'], [null, null]).setAttribute('title', Resources.get('solid')); addItem(menu, 33, 'solid', ['dashed', 'dashPattern'], [null, null]).setAttribute('title', Resources.get('solid'));
addItem(menu, 33, 'dashed', ['dashed', 'dashPattern'], ['1', null]).setAttribute('title', Resources.get('dashed')); addItem(menu, 33, 'dashed', ['dashed', 'dashPattern'], ['1', null]).setAttribute('title', Resources.get('dashed'));
@ -4783,7 +4783,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
mxEvent.addListener(altInput, 'blur', altUpdate); mxEvent.addListener(altInput, 'blur', altUpdate);
mxEvent.addListener(altInput, 'change', altUpdate); mxEvent.addListener(altInput, 'change', altUpdate);
let edgeStyle = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-orthogonal', Resources.get('waypoints'), false, this.bind(function(menu) let edgeStyle = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-orthogonal', Resources.get('waypoints'), false, ((menu) =>
{ {
if (ss.style.shape != 'arrow') if (ss.style.shape != 'arrow')
{ {
@ -4803,7 +4803,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
} }
})); }));
let lineStart = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-startclassic', Resources.get('linestart'), false, this.bind(function(menu) let lineStart = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-startclassic', Resources.get('linestart'), false, ((menu) =>
{ {
if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge') if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge')
{ {
@ -4852,7 +4852,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
} }
})); }));
let lineEnd = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-endclassic', Resources.get('lineend'), false, this.bind(function(menu) let lineEnd = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-endclassic', Resources.get('lineend'), false, ((menu) =>
{ {
if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge') if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge')
{ {
@ -5027,7 +5027,7 @@ StyleFormatPanel.prototype.addStroke = function(container)
container.appendChild(perimeterPanel); container.appendChild(perimeterPanel);
} }
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
ss = this.format.getSelectionState(); ss = this.format.getSelectionState();
let color = getValue(ss.style, strokeKey, null); let color = getValue(ss.style, strokeKey, null);
@ -5332,7 +5332,7 @@ StyleFormatPanel.prototype.addLineJumps = function(container)
jumpSizeUpdate = this.installInputHandler(jumpSize, 'jumpSize', jumpSizeUpdate = this.installInputHandler(jumpSize, 'jumpSize',
Graph.defaultJumpSize, 0, 999, ' pt'); Graph.defaultJumpSize, 0, 999, ' pt');
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
ss = this.format.getSelectionState(); ss = this.format.getSelectionState();
styleSelect.value = getValue(ss.style, 'jumpStyle', 'none'); styleSelect.value = getValue(ss.style, 'jumpStyle', 'none');
@ -5395,7 +5395,7 @@ StyleFormatPanel.prototype.addEffects = function(div)
let current = left; let current = left;
let count = 0; let count = 0;
let addOption = this.bind(function(label, key, defaultValue) let addOption = ((label, key, defaultValue) =>
{ {
let opt = this.createCellOption(label, key, defaultValue); let opt = this.createCellOption(label, key, defaultValue);
opt.style.width = '100%'; opt.style.width = '100%';
@ -5404,7 +5404,7 @@ StyleFormatPanel.prototype.addEffects = function(div)
count++; count++;
}); });
let listener = this.bind(function(sender, evt, force) let listener = ((sender, evt, force) =>
{ {
ss = this.format.getSelectionState(); ss = this.format.getSelectionState();
@ -5450,7 +5450,7 @@ StyleFormatPanel.prototype.addStyleOps = function(div)
div.style.paddingTop = '10px'; div.style.paddingTop = '10px';
div.style.paddingBottom = '10px'; div.style.paddingBottom = '10px';
let btn = button(Resources.get('setAsDefaultStyle'), this.bind(function(evt) let btn = button(Resources.get('setAsDefaultStyle'), ((evt) =>
{ {
this.editorUi.actions.get('setAsDefaultStyle').funct(); this.editorUi.actions.get('setAsDefaultStyle').funct();
})); }));
@ -5609,7 +5609,7 @@ DiagramStylePanel.prototype.addView = function(div)
let defaultStyles = ['fillColor', 'strokeColor', 'fontColor', 'gradientColor']; let defaultStyles = ['fillColor', 'strokeColor', 'fontColor', 'gradientColor'];
let updateCells = this.bind(function(styles, graphStyle) let updateCells = ((styles, graphStyle) =>
{ {
let cells = graph.getVerticesAndEdges(); let cells = graph.getVerticesAndEdges();
@ -5650,7 +5650,7 @@ DiagramStylePanel.prototype.addView = function(div)
} }
}); });
let removeStyles = this.bind(function(style, styles, defaultStyle) let removeStyles = ((style, styles, defaultStyle) =>
{ {
if (style != null) if (style != null)
{ {
@ -5667,7 +5667,7 @@ DiagramStylePanel.prototype.addView = function(div)
} }
}); });
let applyStyle = this.bind(function(style, result, cell, graphStyle, theGraph) let applyStyle = ((style, result, cell, graphStyle, theGraph) =>
{ {
if (style != null) if (style != null)
{ {
@ -5706,7 +5706,7 @@ DiagramStylePanel.prototype.addView = function(div)
} }
}); });
let btn = button(Resources.get('reset'), this.bind(function(evt) let btn = button(Resources.get('reset'), ((evt) =>
{ {
let all = graph.getVerticesAndEdges(true, true); let all = graph.getVerticesAndEdges(true, true);
@ -5735,7 +5735,7 @@ DiagramStylePanel.prototype.addView = function(div)
btn.style.maxWidth = '90px'; btn.style.maxWidth = '90px';
right.appendChild(btn); right.appendChild(btn);
let createPreview = this.bind(function(commonStyle, vertexStyle, edgeStyle, graphStyle, container) let createPreview = ((commonStyle, vertexStyle, edgeStyle, graphStyle, container) =>
{ {
// Wrapper needed to catch events // Wrapper needed to catch events
let div = document.createElement('div'); let div = document.createElement('div');
@ -5798,7 +5798,7 @@ DiagramStylePanel.prototype.addView = function(div)
this.format.cachedStyleEntries = []; this.format.cachedStyleEntries = [];
} }
let addEntry = this.bind(function(commonStyle, vertexStyle, edgeStyle, graphStyle, index) let addEntry = ((commonStyle, vertexStyle, edgeStyle, graphStyle, index) =>
{ {
let panel = this.format.cachedStyleEntries[index]; let panel = this.format.cachedStyleEntries[index];
@ -5815,10 +5815,10 @@ DiagramStylePanel.prototype.addView = function(div)
createPreview(commonStyle, vertexStyle, edgeStyle, graphStyle, panel); createPreview(commonStyle, vertexStyle, edgeStyle, graphStyle, panel);
mxEvent.addGestureListeners(panel, this.bind(function(evt) mxEvent.addGestureListeners(panel, ((evt) =>
{ {
panel.style.opacity = 0.5; panel.style.opacity = 0.5;
}), null, this.bind(function(evt) }), null, ((evt) =>
{ {
panel.style.opacity = 1; panel.style.opacity = 1;
graph.defaultVertexStyle = clone(ui.initialDefaultVertexStyle); graph.defaultVertexStyle = clone(ui.initialDefaultVertexStyle);
@ -5879,7 +5879,7 @@ DiagramStylePanel.prototype.addView = function(div)
} }
})); }));
mxEvent.addListener(panel, 'mouseenter', this.bind(function(evt) mxEvent.addListener(panel, 'mouseenter', ((evt) =>
{ {
let prev = graph.getCellStyle; let prev = graph.getCellStyle;
let prevBg = graph.background; let prevBg = graph.background;
@ -5915,7 +5915,7 @@ DiagramStylePanel.prototype.addView = function(div)
graph.view.gridColor = prevGrid; graph.view.gridColor = prevGrid;
})); }));
mxEvent.addListener(panel, 'mouseleave', this.bind(function(evt) mxEvent.addListener(panel, 'mouseleave', ((evt) =>
{ {
graph.refresh(); graph.refresh();
})); }));
@ -5932,7 +5932,7 @@ DiagramStylePanel.prototype.addView = function(div)
this.format.currentStylePage = (this.format.currentStylePage != null) ? this.format.currentStylePage : 0; this.format.currentStylePage = (this.format.currentStylePage != null) ? this.format.currentStylePage : 0;
let dots = []; let dots = [];
let addEntries = this.bind(function() let addEntries = (() =>
{ {
if (dots.length > 0) if (dots.length > 0)
{ {
@ -5948,7 +5948,7 @@ DiagramStylePanel.prototype.addView = function(div)
} }
}); });
let selectPage = this.bind(function(index) let selectPage = ((index) =>
{ {
if (index >= 0 && index < pageCount) if (index >= 0 && index < pageCount)
{ {
@ -5984,9 +5984,9 @@ DiagramStylePanel.prototype.addView = function(div)
dot.style.background = 'transparent'; dot.style.background = 'transparent';
dot.style.border = '1px solid #b5b6b7'; dot.style.border = '1px solid #b5b6b7';
(this.bind(function(index, elt) (((index, elt) =>
{ {
mxEvent.addListener(dot, 'click', this.bind(function() mxEvent.addListener(dot, 'click', (() =>
{ {
selectPage(index); selectPage(index);
})); }));
@ -6005,7 +6005,7 @@ DiagramStylePanel.prototype.addView = function(div)
left.style.cssText = 'position:absolute;left:0px;top:4px;bottom:0px;width:20px;margin:0px;opacity:0.5;' + left.style.cssText = 'position:absolute;left:0px;top:4px;bottom:0px;width:20px;margin:0px;opacity:0.5;' +
'background-repeat:no-repeat;background-position:center center;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQBAMAAADQT4M0AAAAIVBMVEUAAAB2dnZ4eHh3d3d1dXVxcXF2dnZ2dnZ2dnZxcXF2dnYmb3w1AAAACnRSTlMAfCTkhhvb7cQSPH2JPgAAADRJREFUCNdjwACMAmBKaiGYs2oJmLPKAZ3DabU8AMRTXpUKopislqFyVzCAuUZgikkBZjoAcMYLnp53P/UAAAAASUVORK5CYII=);'; 'background-repeat:no-repeat;background-position:center center;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQBAMAAADQT4M0AAAAIVBMVEUAAAB2dnZ4eHh3d3d1dXVxcXF2dnZ2dnZ2dnZxcXF2dnYmb3w1AAAACnRSTlMAfCTkhhvb7cQSPH2JPgAAADRJREFUCNdjwACMAmBKaiGYs2oJmLPKAZ3DabU8AMRTXpUKopislqFyVzCAuUZgikkBZjoAcMYLnp53P/UAAAAASUVORK5CYII=);';
mxEvent.addListener(left, 'click', this.bind(function() mxEvent.addListener(left, 'click', (() =>
{ {
selectPage(mod(this.format.currentStylePage - 1, pageCount)); selectPage(mod(this.format.currentStylePage - 1, pageCount));
})); }));
@ -6016,7 +6016,7 @@ DiagramStylePanel.prototype.addView = function(div)
switcher.appendChild(left); switcher.appendChild(left);
switcher.appendChild(right); switcher.appendChild(right);
mxEvent.addListener(right, 'click', this.bind(function() mxEvent.addListener(right, 'click', (() =>
{ {
selectPage(mod(this.format.currentStylePage + 1, pageCount)); selectPage(mod(this.format.currentStylePage + 1, pageCount));
})); }));
@ -6497,7 +6497,7 @@ DiagramFormatPanel.prototype.addPaperSize = function(div)
*/ */
DiagramFormatPanel.prototype.addStyleOps = function(div) DiagramFormatPanel.prototype.addStyleOps = function(div)
{ {
let btn = button(Resources.get('editData'), this.bind(function(evt) let btn = button(Resources.get('editData'), ((evt) =>
{ {
this.editorUi.actions.get('editData').funct(); this.editorUi.actions.get('editData').funct();
})); }));
@ -6509,7 +6509,7 @@ DiagramFormatPanel.prototype.addStyleOps = function(div)
br(div); br(div);
btn = button(Resources.get('clearDefaultStyle'), this.bind(function(evt) btn = button(Resources.get('clearDefaultStyle'), ((evt) =>
{ {
this.editorUi.actions.get('clearDefaultStyle').funct(); this.editorUi.actions.get('clearDefaultStyle').funct();
})); }));

104
docs/stashed/grapheditor/www/js/Menus.js
View File

@ -52,9 +52,9 @@ Menus.prototype.init = function()
this.customFonts = []; this.customFonts = [];
this.customFontSizes = []; this.customFontSizes = [];
this.put('fontFamily', new Menu(this.bind(function(menu, parent) this.put('fontFamily', new Menu(((menu, parent) =>
{ {
let addItem = this.bind(function(fontname) let addItem = ((fontname) =>
{ {
let tr = this.styleChange(menu, fontname, .fontFamily, [fontname], null, parent, function() let tr = this.styleChange(menu, fontname, .fontFamily, [fontname], null, parent, function()
{ {
@ -91,7 +91,7 @@ Menus.prototype.init = function()
menu.addSeparator(parent); menu.addSeparator(parent);
menu.addItem(Resources.get('reset'), null, this.bind(function() menu.addItem(Resources.get('reset'), null, (() =>
{ {
this.customFonts = []; this.customFonts = [];
this.editorUi.fireEvent(new EventObject('customFontsChanged')); this.editorUi.fireEvent(new EventObject('customFontsChanged'));
@ -100,7 +100,7 @@ Menus.prototype.init = function()
menu.addSeparator(parent); menu.addSeparator(parent);
} }
this.promptChange(menu, Resources.get('custom') + '...', '', mxConstants.DEFAULT_FONTFAMILY, 'fontFamily', parent, true, this.bind(function(newValue) this.promptChange(menu, Resources.get('custom') + '...', '', mxConstants.DEFAULT_FONTFAMILY, 'fontFamily', parent, true, ((newValue) =>
{ {
if (this.customFonts.indexOf(newValue) === -1) if (this.customFonts.indexOf(newValue) === -1)
{ {
@ -109,11 +109,11 @@ Menus.prototype.init = function()
} }
})); }));
}))); })));
this.put('formatBlock', new Menu(this.bind(function(menu, parent) this.put('formatBlock', new Menu(((menu, parent) =>
{ {
function addItem(label, tag) function addItem(label, tag)
{ {
return menu.addItem(label, null, this.bind(function() return menu.addItem(label, null, (() =>
{ {
// TODO: Check if visible // TODO: Check if visible
if (graph.cellEditor.textarea != null) if (graph.cellEditor.textarea != null)
@ -136,11 +136,11 @@ Menus.prototype.init = function()
addItem('', 'pre').firstChild.nextSibling.innerHTML = '<pre style="margin:0px;">' + Resources.get('formatted') + '</pre>'; addItem('', 'pre').firstChild.nextSibling.innerHTML = '<pre style="margin:0px;">' + Resources.get('formatted') + '</pre>';
addItem('', 'blockquote').firstChild.nextSibling.innerHTML = '<blockquote style="margin-top:0px;margin-bottom:0px;">' + Resources.get('blockquote') + '</blockquote>'; addItem('', 'blockquote').firstChild.nextSibling.innerHTML = '<blockquote style="margin-top:0px;margin-bottom:0px;">' + Resources.get('blockquote') + '</blockquote>';
}))); })));
this.put('fontSize', new Menu(this.bind(function(menu, parent) this.put('fontSize', new Menu(((menu, parent) =>
{ {
let sizes = [6, 8, 9, 10, 11, 12, 14, 18, 24, 36, 48, 72]; let sizes = [6, 8, 9, 10, 11, 12, 14, 18, 24, 36, 48, 72];
let addItem = this.bind(function(fontsize) let addItem = ((fontsize) =>
{ {
this.styleChange(menu, fontsize, .fontSize, [fontsize], null, parent, function() this.styleChange(menu, fontsize, .fontSize, [fontsize], null, parent, function()
{ {
@ -184,7 +184,7 @@ Menus.prototype.init = function()
menu.addSeparator(parent); menu.addSeparator(parent);
menu.addItem(Resources.get('reset'), null, this.bind(function() menu.addItem(Resources.get('reset'), null, (() =>
{ {
this.customFontSizes = []; this.customFontSizes = [];
}), parent); }), parent);
@ -192,18 +192,18 @@ Menus.prototype.init = function()
menu.addSeparator(parent); menu.addSeparator(parent);
} }
this.promptChange(menu, Resources.get('custom') + '...', '(pt)', '12', 'fontSize', parent, true, this.bind(function(newValue) this.promptChange(menu, Resources.get('custom') + '...', '(pt)', '12', 'fontSize', parent, true, ((newValue) =>
{ {
this.customFontSizes.push(newValue); this.customFontSizes.push(newValue);
})); }));
}))); })));
this.put('direction', new Menu(this.bind(function(menu, parent) this.put('direction', new Menu(((menu, parent) =>
{ {
menu.addItem(Resources.get('flipH'), null, function() { graph.toggleCellStyles('flipH', false); }, parent); menu.addItem(Resources.get('flipH'), null, function() { graph.toggleCellStyles('flipH', false); }, parent);
menu.addItem(Resources.get('flipV'), null, function() { graph.toggleCellStyles('flipV', false); }, parent); menu.addItem(Resources.get('flipV'), null, function() { graph.toggleCellStyles('flipV', false); }, parent);
this.addMenuItems(menu, ['-', 'rotation'], parent); this.addMenuItems(menu, ['-', 'rotation'], parent);
}))); })));
this.put('align', new Menu(this.bind(function(menu, parent) this.put('align', new Menu(((menu, parent) =>
{ {
menu.addItem(Resources.get('leftAlign'), null, function() { graph.alignCells(mxConstants.ALIGN_LEFT); }, parent); menu.addItem(Resources.get('leftAlign'), null, function() { graph.alignCells(mxConstants.ALIGN_LEFT); }, parent);
menu.addItem(Resources.get('center'), null, function() { graph.alignCells(mxConstants.ALIGN_CENTER); }, parent); menu.addItem(Resources.get('center'), null, function() { graph.alignCells(mxConstants.ALIGN_CENTER); }, parent);
@ -213,14 +213,14 @@ Menus.prototype.init = function()
menu.addItem(Resources.get('middle'), null, function() { graph.alignCells(mxConstants.ALIGN_MIDDLE); }, parent); menu.addItem(Resources.get('middle'), null, function() { graph.alignCells(mxConstants.ALIGN_MIDDLE); }, parent);
menu.addItem(Resources.get('bottomAlign'), null, function() { graph.alignCells(mxConstants.ALIGN_BOTTOM); }, parent); menu.addItem(Resources.get('bottomAlign'), null, function() { graph.alignCells(mxConstants.ALIGN_BOTTOM); }, parent);
}))); })));
this.put('distribute', new Menu(this.bind(function(menu, parent) this.put('distribute', new Menu(((menu, parent) =>
{ {
menu.addItem(Resources.get('horizontal'), null, function() { graph.distributeCells(true); }, parent); menu.addItem(Resources.get('horizontal'), null, function() { graph.distributeCells(true); }, parent);
menu.addItem(Resources.get('vertical'), null, function() { graph.distributeCells(false); }, parent); menu.addItem(Resources.get('vertical'), null, function() { graph.distributeCells(false); }, parent);
}))); })));
this.put('layout', new Menu(this.bind(function(menu, parent) this.put('layout', new Menu(((menu, parent) =>
{ {
let promptSpacing = this.bind(function(defaultValue, fn) let promptSpacing = ((defaultValue, fn) =>
{ {
let dlg = new FilenameDialog(this.editorUi, defaultValue, Resources.get('apply'), function(newValue) let dlg = new FilenameDialog(this.editorUi, defaultValue, Resources.get('apply'), function(newValue)
{ {
@ -230,7 +230,7 @@ Menus.prototype.init = function()
dlg.init(); dlg.init();
}); });
menu.addItem(Resources.get('horizontalFlow'), null, this.bind(function() menu.addItem(Resources.get('horizontalFlow'), null, (() =>
{ {
let layout = new mxHierarchicalLayout(graph, mxConstants.DIRECTION_WEST); let layout = new mxHierarchicalLayout(graph, mxConstants.DIRECTION_WEST);
@ -240,7 +240,7 @@ Menus.prototype.init = function()
layout.execute(graph.getDefaultParent(), selectionCells.length == 0 ? null : selectionCells); layout.execute(graph.getDefaultParent(), selectionCells.length == 0 ? null : selectionCells);
}, true); }, true);
}), parent); }), parent);
menu.addItem(Resources.get('verticalFlow'), null, this.bind(function() menu.addItem(Resources.get('verticalFlow'), null, (() =>
{ {
let layout = new mxHierarchicalLayout(graph, mxConstants.DIRECTION_NORTH); let layout = new mxHierarchicalLayout(graph, mxConstants.DIRECTION_NORTH);
@ -251,7 +251,7 @@ Menus.prototype.init = function()
}, true); }, true);
}), parent); }), parent);
menu.addSeparator(parent); menu.addSeparator(parent);
menu.addItem(Resources.get('horizontalTree'), null, this.bind(function() menu.addItem(Resources.get('horizontalTree'), null, (() =>
{ {
let tmp = graph.getSelectionCell(); let tmp = graph.getSelectionCell();
let roots = null; let roots = null;
@ -279,7 +279,7 @@ Menus.prototype.init = function()
layout.edgeRouting = false; layout.edgeRouting = false;
layout.levelDistance = 30; layout.levelDistance = 30;
promptSpacing(layout.levelDistance, this.bind(function(newValue) promptSpacing(layout.levelDistance, ((newValue) =>
{ {
layout.levelDistance = newValue; layout.levelDistance = newValue;
@ -290,7 +290,7 @@ Menus.prototype.init = function()
})); }));
} }
}), parent); }), parent);
menu.addItem(Resources.get('verticalTree'), null, this.bind(function() menu.addItem(Resources.get('verticalTree'), null, (() =>
{ {
let tmp = graph.getSelectionCell(); let tmp = graph.getSelectionCell();
let roots = null; let roots = null;
@ -318,7 +318,7 @@ Menus.prototype.init = function()
layout.edgeRouting = false; layout.edgeRouting = false;
layout.levelDistance = 30; layout.levelDistance = 30;
promptSpacing(layout.levelDistance, this.bind(function(newValue) promptSpacing(layout.levelDistance, ((newValue) =>
{ {
layout.levelDistance = newValue; layout.levelDistance = newValue;
@ -329,7 +329,7 @@ Menus.prototype.init = function()
})); }));
} }
}), parent); }), parent);
menu.addItem(Resources.get('radialTree'), null, this.bind(function() menu.addItem(Resources.get('radialTree'), null, (() =>
{ {
let tmp = graph.getSelectionCell(); let tmp = graph.getSelectionCell();
let roots = null; let roots = null;
@ -357,7 +357,7 @@ Menus.prototype.init = function()
layout.levelDistance = 80; layout.levelDistance = 80;
layout.autoRadius = true; layout.autoRadius = true;
promptSpacing(layout.levelDistance, this.bind(function(newValue) promptSpacing(layout.levelDistance, ((newValue) =>
{ {
layout.levelDistance = newValue; layout.levelDistance = newValue;
@ -379,11 +379,11 @@ Menus.prototype.init = function()
} }
}), parent); }), parent);
menu.addSeparator(parent); menu.addSeparator(parent);
menu.addItem(Resources.get('organic'), null, this.bind(function() menu.addItem(Resources.get('organic'), null, (() =>
{ {
let layout = new MxFastOrganicLayout(graph); let layout = new MxFastOrganicLayout(graph);
promptSpacing(layout.forceConstant, this.bind(function(newValue) promptSpacing(layout.forceConstant, ((newValue) =>
{ {
layout.forceConstant = newValue; layout.forceConstant = newValue;
@ -405,7 +405,7 @@ Menus.prototype.init = function()
}, true); }, true);
})); }));
}), parent); }), parent);
menu.addItem(Resources.get('circle'), null, this.bind(function() menu.addItem(Resources.get('circle'), null, (() =>
{ {
let layout = new CircleLayout(graph); let layout = new CircleLayout(graph);
@ -427,11 +427,11 @@ Menus.prototype.init = function()
}, true); }, true);
}), parent); }), parent);
}))); })));
this.put('navigation', new Menu(this.bind(function(menu, parent) this.put('navigation', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['home', '-', 'exitGroup', 'enterGroup', '-', 'expand', 'collapse', '-', 'collapsible'], parent); this.addMenuItems(menu, ['home', '-', 'exitGroup', 'enterGroup', '-', 'expand', 'collapse', '-', 'collapsible'], parent);
}))); })));
this.put('arrange', new Menu(this.bind(function(menu, parent) this.put('arrange', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['toFront', 'toBack', '-'], parent); this.addMenuItems(menu, ['toFront', 'toBack', '-'], parent);
this.addSubmenu('direction', menu, parent); this.addSubmenu('direction', menu, parent);
@ -444,11 +444,11 @@ Menus.prototype.init = function()
this.addSubmenu('layout', menu, parent); this.addSubmenu('layout', menu, parent);
this.addMenuItems(menu, ['-', 'group', 'ungroup', 'removeFromGroup', '-', 'clearWaypoints', 'autosize'], parent); this.addMenuItems(menu, ['-', 'group', 'ungroup', 'removeFromGroup', '-', 'clearWaypoints', 'autosize'], parent);
}))).isEnabled = isGraphEnabled; }))).isEnabled = isGraphEnabled;
this.put('insert', new Menu(this.bind(function(menu, parent) this.put('insert', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['insertLink', 'insertImage'], parent); this.addMenuItems(menu, ['insertLink', 'insertImage'], parent);
}))); })));
this.put('view', new Menu(this.bind(function(menu, parent) this.put('view', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ((this.editorUi.format != null) ? ['formatPanel'] : []). this.addMenuItems(menu, ((this.editorUi.format != null) ? ['formatPanel'] : []).
concat(['outline', 'layers', '-', 'pageView', 'pageScale', '-', 'scrollbars', 'tooltips', '-', concat(['outline', 'layers', '-', 'pageView', 'pageScale', '-', 'scrollbars', 'tooltips', '-',
@ -456,7 +456,7 @@ Menus.prototype.init = function()
'resetView', 'zoomIn', 'zoomOut'], parent)); 'resetView', 'zoomIn', 'zoomOut'], parent));
}))); })));
// Two special dropdowns that are only used in the toolbar // Two special dropdowns that are only used in the toolbar
this.put('viewPanels', new Menu(this.bind(function(menu, parent) this.put('viewPanels', new Menu(((menu, parent) =>
{ {
if (this.editorUi.format != null) if (this.editorUi.format != null)
{ {
@ -465,7 +465,7 @@ Menus.prototype.init = function()
this.addMenuItems(menu, ['outline', 'layers'], parent); this.addMenuItems(menu, ['outline', 'layers'], parent);
}))); })));
this.put('viewZoom', new Menu(this.bind(function(menu, parent) this.put('viewZoom', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['resetView', '-'], parent); this.addMenuItems(menu, ['resetView', '-'], parent);
let scales = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4]; let scales = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4];
@ -483,21 +483,21 @@ Menus.prototype.init = function()
this.addMenuItems(menu, ['-', 'fitWindow', 'fitPageWidth', 'fitPage', 'fitTwoPages', '-', 'customZoom'], parent); this.addMenuItems(menu, ['-', 'fitWindow', 'fitPageWidth', 'fitPage', 'fitTwoPages', '-', 'customZoom'], parent);
}))); })));
this.put('file', new Menu(this.bind(function(menu, parent) this.put('file', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['new', 'open', '-', 'save', 'saveAs', '-', 'import', 'export', '-', 'pageSetup', 'print'], parent); this.addMenuItems(menu, ['new', 'open', '-', 'save', 'saveAs', '-', 'import', 'export', '-', 'pageSetup', 'print'], parent);
}))); })));
this.put('edit', new Menu(this.bind(function(menu, parent) this.put('edit', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['undo', 'redo', '-', 'cut', 'copy', 'paste', 'delete', '-', 'duplicate', '-', this.addMenuItems(menu, ['undo', 'redo', '-', 'cut', 'copy', 'paste', 'delete', '-', 'duplicate', '-',
'editData', 'editTooltip', '-', 'editStyle', '-', 'edit', '-', 'editLink', 'openLink', '-', 'editData', 'editTooltip', '-', 'editStyle', '-', 'edit', '-', 'editLink', 'openLink', '-',
'selectVertices', 'selectEdges', 'selectAll', 'selectNone', '-', 'lockUnlock']); 'selectVertices', 'selectEdges', 'selectAll', 'selectNone', '-', 'lockUnlock']);
}))); })));
this.put('extras', new Menu(this.bind(function(menu, parent) this.put('extras', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['copyConnect', 'collapseExpand', '-', 'editDiagram']); this.addMenuItems(menu, ['copyConnect', 'collapseExpand', '-', 'editDiagram']);
}))); })));
this.put('help', new Menu(this.bind(function(menu, parent) this.put('help', new Menu(((menu, parent) =>
{ {
this.addMenuItems(menu, ['help', '-', 'about']); this.addMenuItems(menu, ['help', '-', 'about']);
}))); })));
@ -560,7 +560,7 @@ Menus.prototype.addInsertTableCellItem = function(menu, parent)
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
this.addInsertTableItem(menu, this.bind(function(evt, rows, cols) this.addInsertTableItem(menu, ((evt, rows, cols) =>
{ {
let table = (mxEvent.isControlDown(evt) || mxEvent.isMetaDown(evt)) ? let table = (mxEvent.isControlDown(evt) || mxEvent.isMetaDown(evt)) ?
graph.createCrossFunctionalSwimlane(rows, cols) : graph.createCrossFunctionalSwimlane(rows, cols) :
@ -583,7 +583,7 @@ Menus.prototype.addInsertTableCellItem = function(menu, parent)
*/ */
Menus.prototype.addInsertTableItem = function(menu, insertFn, parent) Menus.prototype.addInsertTableItem = function(menu, insertFn, parent)
{ {
insertFn = (insertFn != null) ? insertFn : this.bind(function(evt, rows, cols) insertFn = (insertFn != null) ? insertFn : ((evt, rows, cols) =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
let td = graph.getParentByName(mxEvent.getSource(evt), 'TD'); let td = graph.getParentByName(mxEvent.getSource(evt), 'TD');
@ -761,7 +761,7 @@ Menus.prototype.addInsertTableItem = function(menu, insertFn, parent)
insertFn(e, row2.sectionRowIndex + 1, td.cellIndex + 1); insertFn(e, row2.sectionRowIndex + 1, td.cellIndex + 1);
// Async required to block event for elements under menu // Async required to block event for elements under menu
window.setTimeout(this.bind(function() window.setTimeout((() =>
{ {
this.editorUi.hideCurrentMenu(); this.editorUi.hideCurrentMenu();
}), 0); }), 0);
@ -775,7 +775,7 @@ Menus.prototype.addInsertTableItem = function(menu, insertFn, parent)
*/ */
Menus.prototype.edgeStyleChange = function(menu, label, keys, values, sprite, parent, reset) Menus.prototype.edgeStyleChange = function(menu, label, keys, values, sprite, parent, reset)
{ {
return menu.addItem(label, null, this.bind(function() return menu.addItem(label, null, (() =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
graph.stopEditing(false); graph.stopEditing(false);
@ -831,7 +831,7 @@ Menus.prototype.styleChange = function(menu, label, keys, values, sprite, parent
{ {
let apply = this.createStyleChangeFunction(keys, values); let apply = this.createStyleChangeFunction(keys, values);
return menu.addItem(label, null, this.bind(function() return menu.addItem(label, null, (() =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
@ -851,7 +851,7 @@ Menus.prototype.styleChange = function(menu, label, keys, values, sprite, parent
*/ */
Menus.prototype.createStyleChangeFunction = function(keys, values) Menus.prototype.createStyleChangeFunction = function(keys, values)
{ {
return this.bind(function(post) return ((post) =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
graph.stopEditing(false); graph.stopEditing(false);
@ -908,7 +908,7 @@ Menus.prototype.createStyleChangeFunction = function(keys, values)
*/ */
Menus.prototype.promptChange = function(menu, label, hint, defaultValue, key, parent, enabled, fn, sprite) Menus.prototype.promptChange = function(menu, label, hint, defaultValue, key, parent, enabled, fn, sprite)
{ {
return menu.addItem(label, null, this.bind(function() return menu.addItem(label, null, (() =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
let value = defaultValue; let value = defaultValue;
@ -919,7 +919,7 @@ Menus.prototype.promptChange = function(menu, label, hint, defaultValue, key, pa
value = state.style[key] || value; value = state.style[key] || value;
} }
let dlg = new FilenameDialog(this.editorUi, value, Resources.get('apply'), this.bind(function(newValue) let dlg = new FilenameDialog(this.editorUi, value, Resources.get('apply'), ((newValue) =>
{ {
if (newValue != null && newValue.length > 0) if (newValue != null && newValue.length > 0)
{ {
@ -959,7 +959,7 @@ Menus.prototype.pickColor = function(key, cmd, defaultValue)
// Saves and restores text selection for in-place editor // Saves and restores text selection for in-place editor
let selState = graph.cellEditor.saveSelection(); let selState = graph.cellEditor.saveSelection();
let dlg = new ColorDialog(this.editorUi, defaultValue || '000000', this.bind(function(color) let dlg = new ColorDialog(this.editorUi, defaultValue || '000000', ((color) =>
{ {
graph.cellEditor.restoreSelection(selState); graph.cellEditor.restoreSelection(selState);
document.execCommand(cmd, false, (color != mxConstants.NONE) ? color : 'transparent'); document.execCommand(cmd, false, (color != mxConstants.NONE) ? color : 'transparent');
@ -1236,9 +1236,9 @@ Menus.prototype.createMenubar = function(container)
for (let i = 0; i < menus.length; i++) for (let i = 0; i < menus.length; i++)
{ {
(this.bind(function(menu) (((menu) =>
{ {
let elt = menubar.addMenu(Resources.get(menus[i]), this.bind(function() let elt = menubar.addMenu(Resources.get(menus[i]), (() =>
{ {
// Allows extensions of menu.funct // Allows extensions of menu.funct
menu.funct.apply(this, arguments); menu.funct.apply(this, arguments);
@ -1324,7 +1324,7 @@ Menubar.prototype.addMenuHandler = function(elt, funct)
{ {
let show = true; let show = true;
let clickHandler = this.bind(function(evt) let clickHandler = ((evt) =>
{ {
if (show && elt.enabled == null || elt.enabled) if (show && elt.enabled == null || elt.enabled)
{ {
@ -1336,7 +1336,7 @@ Menubar.prototype.addMenuHandler = function(elt, funct)
menu.autoExpand = true; menu.autoExpand = true;
// Disables autoexpand and destroys menu when hidden // Disables autoexpand and destroys menu when hidden
menu.hideMenu = this.bind(function() menu.hideMenu = (() =>
{ {
mxPopupMenu.prototype.hideMenu.apply(menu, arguments); mxPopupMenu.prototype.hideMenu.apply(menu, arguments);
this.editorUi.resetCurrentMenu(); this.editorUi.resetCurrentMenu();
@ -1352,7 +1352,7 @@ Menubar.prototype.addMenuHandler = function(elt, funct)
}); });
// Shows menu automatically while in expanded state // Shows menu automatically while in expanded state
mxEvent.addListener(elt, 'mousemove', this.bind(function(evt) mxEvent.addListener(elt, 'mousemove', ((evt) =>
{ {
if (this.editorUi.currentMenu != null && this.editorUi.currentMenuElt != elt) if (this.editorUi.currentMenu != null && this.editorUi.currentMenuElt != elt)
{ {
@ -1363,13 +1363,13 @@ Menubar.prototype.addMenuHandler = function(elt, funct)
// Hides menu if already showing and prevents focus // Hides menu if already showing and prevents focus
mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
this.bind(function(evt) ((evt) =>
{ {
show = this.currentElt != elt; show = this.currentElt != elt;
evt.preventDefault(); evt.preventDefault();
})); }));
mxEvent.addListener(elt, 'click', this.bind(function(evt) mxEvent.addListener(elt, 'click', ((evt) =>
{ {
clickHandler(evt); clickHandler(evt);
show = true; show = true;

78
docs/stashed/grapheditor/www/js/Sidebar.js
View File

@ -19,14 +19,14 @@ function Sidebar(editorUi, container)
document.body.appendChild(this.graph.container); document.body.appendChild(this.graph.container);
this.pointerUpHandler = this.bind(function() this.pointerUpHandler = (() =>
{ {
this.showTooltips = true; this.showTooltips = true;
}); });
mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerup' : 'mouseup', this.pointerUpHandler); mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerup' : 'mouseup', this.pointerUpHandler);
this.pointerDownHandler = this.bind(function() this.pointerDownHandler = (() =>
{ {
this.showTooltips = false; this.showTooltips = false;
this.hideTooltip(); this.hideTooltip();
@ -34,7 +34,7 @@ function Sidebar(editorUi, container)
mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', this.pointerDownHandler); mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', this.pointerDownHandler);
this.pointerMoveHandler = this.bind(function(evt) this.pointerMoveHandler = ((evt) =>
{ {
let src = mxEvent.getSource(evt); let src = mxEvent.getSource(evt);
@ -54,7 +54,7 @@ function Sidebar(editorUi, container)
mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', this.pointerMoveHandler); mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', this.pointerMoveHandler);
// Handles mouse leaving the window // Handles mouse leaving the window
this.pointerOutHandler = this.bind(function(evt) this.pointerOutHandler = ((evt) =>
{ {
if (evt.toElement == null && evt.relatedTarget == null) if (evt.toElement == null && evt.relatedTarget == null)
{ {
@ -65,7 +65,7 @@ function Sidebar(editorUi, container)
mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerout' : 'mouseout', this.pointerOutHandler); mxEvent.addListener(document, (mxClient.IS_POINTER) ? 'pointerout' : 'mouseout', this.pointerOutHandler);
// Enables tooltips after scroll // Enables tooltips after scroll
mxEvent.addListener(container, 'scroll', this.bind(function() mxEvent.addListener(container, 'scroll', (() =>
{ {
this.showTooltips = true; this.showTooltips = true;
this.hideTooltip(); this.hideTooltip();
@ -265,7 +265,7 @@ Sidebar.prototype.showTooltip = function(elt, cells, w, h, title, showLabel)
this.thread = null; this.thread = null;
} }
let show = this.bind(function() let show = (() =>
{ {
// Lazy creation of the DOM nodes and graph instance // Lazy creation of the DOM nodes and graph instance
if (this.tooltip == null) if (this.tooltip == null)
@ -446,7 +446,7 @@ Sidebar.prototype.hideTooltip = function()
*/ */
Sidebar.prototype.addDataEntry = function(tags, width, height, title, data) Sidebar.prototype.addDataEntry = function(tags, width, height, title, data)
{ {
return this.addEntry(tags, this.bind(function() return this.addEntry(tags, (() =>
{ {
return this.createVertexTemplateFromData(data, width, height, title); return this.createVertexTemplateFromData(data, width, height, title);
})); }));
@ -459,7 +459,7 @@ Sidebar.prototype.addEntries = function(images)
{ {
for (let i = 0; i < images.length; i++) for (let i = 0; i < images.length; i++)
{ {
(this.bind(function(img) (((img) =>
{ {
let data = img.data; let data = img.data;
let tags = (img.title != null) ? img.title : ''; let tags = (img.title != null) ? img.title : '';
@ -471,7 +471,7 @@ Sidebar.prototype.addEntries = function(images)
if (data != null && tags.length > 0) if (data != null && tags.length > 0)
{ {
this.addEntry(tags, this.bind(function() this.addEntry(tags, (() =>
{ {
data = this.editorUi.convertDataUri(data); data = this.editorUi.convertDataUri(data);
let s = 'shape=image;verticalLabelPosition=bottom;verticalAlign=top;imageAspect=0;'; let s = 'shape=image;verticalLabelPosition=bottom;verticalAlign=top;imageAspect=0;';
@ -487,7 +487,7 @@ Sidebar.prototype.addEntries = function(images)
} }
else if (img.xml != null && tags.length > 0) else if (img.xml != null && tags.length > 0)
{ {
this.addEntry(tags, this.bind(function() this.addEntry(tags, (() =>
{ {
let cells = this.editorUi.stringToCells(Graph.decompress(img.xml)); let cells = this.editorUi.stringToCells(Graph.decompress(img.xml));
@ -774,7 +774,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
// Count is dynamically updated below // Count is dynamically updated below
let count = 12; let count = 12;
let clearDiv = this.bind(function() let clearDiv = (() =>
{ {
active = false; active = false;
this.currentSearch = null; this.currentSearch = null;
@ -808,7 +808,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
input.focus(); input.focus();
}); });
find = this.bind(function() find = (() =>
{ {
// Shows 4 rows (minimum 4 results) // Shows 4 rows (minimum 4 results)
count = 4 * Math.max(1, Math.floor(this.container.clientWidth / (this.thumbWidth + 10))); count = 4 * Math.max(1, Math.floor(this.container.clientWidth / (this.thumbWidth + 10)));
@ -839,7 +839,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
let current = {}; let current = {};
this.currentSearch = current; this.currentSearch = current;
this.searchEntries(searchTerm, count, page, this.bind(function(results, len, more, terms) this.searchEntries(searchTerm, count, page, ((results, len, more, terms) =>
{ {
if (this.currentSearch == current) if (this.currentSearch == current)
{ {
@ -861,7 +861,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
for (let i = 0; i < results.length; i++) for (let i = 0; i < results.length; i++)
{ {
(this.bind(function(result) (((result) =>
{ {
try try
{ {
@ -878,7 +878,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
hash[elt.innerHTML] = hash[elt.innerHTML].concat(result.parentLibraries); hash[elt.innerHTML] = hash[elt.innerHTML].concat(result.parentLibraries);
} }
mxEvent.addGestureListeners(elt, null, null, this.bind(function(evt) mxEvent.addGestureListeners(elt, null, null, ((evt) =>
{ {
let libs = hash[elt.innerHTML]; let libs = hash[elt.innerHTML];
@ -913,7 +913,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
button.style.cursor = ''; button.style.cursor = '';
div.appendChild(center); div.appendChild(center);
} }
}), this.bind(function() }), (() =>
{ {
// TODO: Error handling // TODO: Error handling
button.style.cursor = ''; button.style.cursor = '';
@ -933,7 +933,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
} }
}); });
mxEvent.addListener(input, 'keydown', this.bind(function(evt) mxEvent.addListener(input, 'keydown', ((evt) =>
{ {
if (evt.keyCode == 13 /* Enter */) if (evt.keyCode == 13 /* Enter */)
{ {
@ -942,7 +942,7 @@ Sidebar.prototype.addSearchPalette = function(expand)
} }
})); }));
mxEvent.addListener(input, 'keyup', this.bind(function(evt) mxEvent.addListener(input, 'keyup', ((evt) =>
{ {
if (input.value == '') if (input.value == '')
{ {
@ -1066,7 +1066,7 @@ Sidebar.prototype.addGeneralPalette = function(expand)
this.createVertexTemplateEntry('shape=xor;whiteSpace=wrap;html=1;', 60, 80, '', 'Or', null, null, 'logic or'), this.createVertexTemplateEntry('shape=xor;whiteSpace=wrap;html=1;', 60, 80, '', 'Or', null, null, 'logic or'),
this.createVertexTemplateEntry('shape=or;whiteSpace=wrap;html=1;', 60, 80, '', 'And', null, null, 'logic and'), this.createVertexTemplateEntry('shape=or;whiteSpace=wrap;html=1;', 60, 80, '', 'And', null, null, 'logic and'),
this.createVertexTemplateEntry('shape=dataStorage;whiteSpace=wrap;html=1;fixedSize=1;', 100, 80, '', 'Data Storage'), this.createVertexTemplateEntry('shape=dataStorage;whiteSpace=wrap;html=1;fixedSize=1;', 100, 80, '', 'Data Storage'),
this.addEntry('curve', this.bind(function() this.addEntry('curve', (() =>
{ {
let cell = new Cell('', new Geometry(0, 0, 50, 50), 'curved=1;endArrow=classic;html=1;'); let cell = new Cell('', new Geometry(0, 0, 50, 50), 'curved=1;endArrow=classic;html=1;');
cell.geometry.setTerminalPoint(new Point(0, 50), true); cell.geometry.setTerminalPoint(new Point(0, 50), true);
@ -1085,7 +1085,7 @@ Sidebar.prototype.addGeneralPalette = function(expand)
this.createEdgeTemplateEntry('endArrow=classic;startArrow=classic;html=1;', 50, 50, '', 'Bidirectional Connector', null, lineTags + 'bidirectional'), this.createEdgeTemplateEntry('endArrow=classic;startArrow=classic;html=1;', 50, 50, '', 'Bidirectional Connector', null, lineTags + 'bidirectional'),
this.createEdgeTemplateEntry('endArrow=classic;html=1;', 50, 50, '', 'Directional Connector', null, lineTags + 'directional directed'), this.createEdgeTemplateEntry('endArrow=classic;html=1;', 50, 50, '', 'Directional Connector', null, lineTags + 'directional directed'),
this.createEdgeTemplateEntry('shape=link;html=1;', 100, 0, '', 'Link', null, lineTags + 'link'), this.createEdgeTemplateEntry('shape=link;html=1;', 100, 0, '', 'Link', null, lineTags + 'link'),
this.addEntry(lineTags + 'edge title', this.bind(function() this.addEntry(lineTags + 'edge title', (() =>
{ {
let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;'); let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;');
edge.geometry.setTerminalPoint(new Point(0, 0), true); edge.geometry.setTerminalPoint(new Point(0, 0), true);
@ -1101,7 +1101,7 @@ Sidebar.prototype.addGeneralPalette = function(expand)
return this.createEdgeTemplateFromCells([edge], 100, 0, 'Connector with Label'); return this.createEdgeTemplateFromCells([edge], 100, 0, 'Connector with Label');
})), })),
this.addEntry(lineTags + 'edge title multiplicity', this.bind(function() this.addEntry(lineTags + 'edge title multiplicity', (() =>
{ {
let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;'); let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;');
edge.geometry.setTerminalPoint(new Point(0, 0), true); edge.geometry.setTerminalPoint(new Point(0, 0), true);
@ -1123,7 +1123,7 @@ Sidebar.prototype.addGeneralPalette = function(expand)
return this.createEdgeTemplateFromCells([edge], 160, 0, 'Connector with 2 Labels'); return this.createEdgeTemplateFromCells([edge], 160, 0, 'Connector with 2 Labels');
})), })),
this.addEntry(lineTags + 'edge title multiplicity', this.bind(function() this.addEntry(lineTags + 'edge title multiplicity', (() =>
{ {
let edge = new Cell('Label', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;'); let edge = new Cell('Label', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;');
edge.geometry.setTerminalPoint(new Point(0, 0), true); edge.geometry.setTerminalPoint(new Point(0, 0), true);
@ -1151,7 +1151,7 @@ Sidebar.prototype.addGeneralPalette = function(expand)
return this.createEdgeTemplateFromCells([edge], 160, 0, 'Connector with 3 Labels'); return this.createEdgeTemplateFromCells([edge], 160, 0, 'Connector with 3 Labels');
})), })),
this.addEntry(lineTags + 'edge shape symbol message mail email', this.bind(function() this.addEntry(lineTags + 'edge shape symbol message mail email', (() =>
{ {
let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;'); let edge = new Cell('', new Geometry(0, 0, 0, 0), 'endArrow=classic;html=1;');
edge.geometry.setTerminalPoint(new Point(0, 0), true); edge.geometry.setTerminalPoint(new Point(0, 0), true);
@ -1215,7 +1215,7 @@ Sidebar.prototype.addMiscPalette = function(expand)
'<tr><th align="center"><b>Title</b></th></tr>' + '<tr><th align="center"><b>Title</b></th></tr>' +
'<tr><td align="center">Section 1.1\nSection 1.2\nSection 1.3</td></tr>' + '<tr><td align="center">Section 1.1\nSection 1.2\nSection 1.3</td></tr>' +
'<tr><td align="center">Section 2.1\nSection 2.2\nSection 2.3</td></tr></table>', 'HTML Table 4'), '<tr><td align="center">Section 2.1\nSection 2.2\nSection 2.3</td></tr></table>', 'HTML Table 4'),
this.addEntry('link hyperlink', this.bind(function() this.addEntry('link hyperlink', (() =>
{ {
let cell = new Cell('Link', new Geometry(0, 0, 60, 40), 'text;html=1;strokeColor=none;fillColor=none;whiteSpace=wrap;align=center;verticalAlign=middle;fontColor=#0000EE;fontStyle=4;'); let cell = new Cell('Link', new Geometry(0, 0, 60, 40), 'text;html=1;strokeColor=none;fillColor=none;whiteSpace=wrap;align=center;verticalAlign=middle;fontColor=#0000EE;fontStyle=4;');
cell.vertex = true; cell.vertex = true;
@ -1223,7 +1223,7 @@ Sidebar.prototype.addMiscPalette = function(expand)
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Link'); return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Link');
})), })),
this.addEntry('timestamp date time text label', this.bind(function() this.addEntry('timestamp date time text label', (() =>
{ {
let cell = new Cell('%date{ddd mmm dd yyyy HH:MM:ss}%', new Geometry(0, 0, 160, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;'); let cell = new Cell('%date{ddd mmm dd yyyy HH:MM:ss}%', new Geometry(0, 0, 160, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
cell.vertex = true; cell.vertex = true;
@ -1231,7 +1231,7 @@ Sidebar.prototype.addMiscPalette = function(expand)
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Timestamp'); return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Timestamp');
})), })),
this.addEntry('variable placeholder metadata hello world text label', this.bind(function() this.addEntry('variable placeholder metadata hello world text label', (() =>
{ {
let cell = new Cell('%name% Text', new Geometry(0, 0, 80, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;'); let cell = new Cell('%name% Text', new Geometry(0, 0, 80, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
cell.vertex = true; cell.vertex = true;
@ -2568,7 +2568,7 @@ Sidebar.prototype.createItem = function(cells, title, showLabel, showTitle, widt
this.addClickHandler(elt, ds, cells); this.addClickHandler(elt, ds, cells);
// Uses guides for vertices only if enabled in graph // Uses guides for vertices only if enabled in graph
ds.isGuidesEnabled = this.bind(function() ds.isGuidesEnabled = (() =>
{ {
return this.editorUi.editor.graph.graphHandler.guidesEnabled; return this.editorUi.editor.graph.graphHandler.guidesEnabled;
}); });
@ -2583,7 +2583,7 @@ Sidebar.prototype.createItem = function(cells, title, showLabel, showTitle, widt
// Shows a tooltip with the rendered cell // Shows a tooltip with the rendered cell
if (!mxClient.IS_IOS) if (!mxClient.IS_IOS)
{ {
mxEvent.addGestureListeners(elt, null, this.bind(function(evt) mxEvent.addGestureListeners(elt, null, ((evt) =>
{ {
if (mxEvent.isMouseEvent(evt)) if (mxEvent.isMouseEvent(evt))
{ {
@ -2675,7 +2675,7 @@ Sidebar.prototype.createDropHandler = function(cells, allowSplit, allowCellsInse
{ {
allowCellsInserted = (allowCellsInserted != null) ? allowCellsInserted : true; allowCellsInserted = (allowCellsInserted != null) ? allowCellsInserted : true;
return this.bind(function(graph, evt, target, x, y, force) return ((graph, evt, target, x, y, force) =>
{ {
let elt = (force) ? null : ((mxEvent.isTouchEvent(evt) || mxEvent.isPenEvent(evt)) ? let elt = (force) ? null : ((mxEvent.isTouchEvent(evt) || mxEvent.isPenEvent(evt)) ?
document.elementFromPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt)) : document.elementFromPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt)) :
@ -3192,7 +3192,7 @@ Sidebar.prototype.createDragSource = function(elt, dropHandler, preview, cells,
let dropStyleEnabled = this.isDropStyleEnabled(cells, firstVertex); let dropStyleEnabled = this.isDropStyleEnabled(cells, firstVertex);
let dragSource = makeDraggable(elt, graph, this.bind(function(graph, evt, target, x, y) let dragSource = makeDraggable(elt, graph, ((graph, evt, target, x, y) =>
{ {
if (this.updateThread != null) if (this.updateThread != null)
{ {
@ -3433,7 +3433,7 @@ Sidebar.prototype.createDragSource = function(elt, dropHandler, preview, cells,
let sourceCellStyle = this.editorUi.editor.graph.getCellStyle(cells[0]); let sourceCellStyle = this.editorUi.editor.graph.getCellStyle(cells[0]);
// Allows drop into cell only if target is a valid root // Allows drop into cell only if target is a valid root
dragSource.getDropTarget = this.bind(function(graph, x, y, evt) dragSource.getDropTarget = ((graph, x, y, evt) =>
{ {
// Alt means no targets at all // Alt means no targets at all
// LATER: Show preview where result will go // LATER: Show preview where result will go
@ -3957,7 +3957,7 @@ Sidebar.prototype.createVertexTemplateEntry = function(style, width, height, val
{ {
tags = (tags != null && tags.length > 0) ? tags : ((title != null) ? title.toLowerCase() : ''); tags = (tags != null && tags.length > 0) ? tags : ((title != null) ? title.toLowerCase() : '');
return this.addEntry(tags, this.bind(function() return this.addEntry(tags, (() =>
{ {
return this.createVertexTemplate(style, width, height, value, title, showLabel, showTitle); return this.createVertexTemplate(style, width, height, value, title, showLabel, showTitle);
})); }));
@ -4007,7 +4007,7 @@ Sidebar.prototype.createEdgeTemplateEntry = function(style, width, height, value
{ {
tags = (tags != null && tags.length > 0) ? tags : title.toLowerCase(); tags = (tags != null && tags.length > 0) ? tags : title.toLowerCase();
return this.addEntry(tags, this.bind(function() return this.addEntry(tags, (() =>
{ {
return this.createEdgeTemplate(style, width, height, value, title, showLabel, allowCellsInserted); return this.createEdgeTemplate(style, width, height, value, title, showLabel, allowCellsInserted);
})); }));
@ -4040,7 +4040,7 @@ Sidebar.prototype.createEdgeTemplateFromCells = function(cells, width, height, t
*/ */
Sidebar.prototype.addPaletteFunctions = function(id, title, expanded, fns) Sidebar.prototype.addPaletteFunctions = function(id, title, expanded, fns)
{ {
this.addPalette(id, title, expanded, this.bind(function(content) this.addPalette(id, title, expanded, ((content) =>
{ {
for (let i = 0; i < fns.length; i++) for (let i = 0; i < fns.length; i++)
{ {
@ -4103,7 +4103,7 @@ Sidebar.prototype.addFoldingHandler = function(title, content, funct)
title.style.backgroundRepeat = 'no-repeat'; title.style.backgroundRepeat = 'no-repeat';
title.style.backgroundPosition = '0% 50%'; title.style.backgroundPosition = '0% 50%';
mxEvent.addListener(title, 'click', this.bind(function(evt) mxEvent.addListener(title, 'click', ((evt) =>
{ {
if (content.style.display == 'none') if (content.style.display == 'none')
{ {
@ -4191,7 +4191,7 @@ Sidebar.prototype.addImagePalette = function(id, title, prefix, postfix, items,
for (let i = 0; i < items.length; i++) for (let i = 0; i < items.length; i++)
{ {
(this.bind(function(item, title, tmpTags) (((item, title, tmpTags) =>
{ {
if (tmpTags == null) if (tmpTags == null)
{ {
@ -4250,7 +4250,7 @@ Sidebar.prototype.addStencilPalette = function(id, title, stencilFile, style, ig
} }
} }
StencilShapeRegistry.loadStencilSet(stencilFile, this.bind(function(packageName, stencilName, displayName, w, h) StencilShapeRegistry.loadStencilSet(stencilFile, ((packageName, stencilName, displayName, w, h) =>
{ {
if (ignore == null || indexOf(ignore, stencilName) < 0) if (ignore == null || indexOf(ignore, stencilName) < 0)
{ {
@ -4272,7 +4272,7 @@ Sidebar.prototype.addStencilPalette = function(id, title, stencilFile, style, ig
} }
else else
{ {
this.addPalette(id, title, false, this.bind(function(content) this.addPalette(id, title, false, ((content) =>
{ {
if (style == null) if (style == null)
{ {
@ -4292,7 +4292,7 @@ Sidebar.prototype.addStencilPalette = function(id, title, stencilFile, style, ig
} }
} }
StencilShapeRegistry.loadStencilSet(stencilFile, this.bind(function(packageName, stencilName, displayName, w, h) StencilShapeRegistry.loadStencilSet(stencilFile, ((packageName, stencilName, displayName, w, h) =>
{ {
if (ignore == null || indexOf(ignore, stencilName) < 0) if (ignore == null || indexOf(ignore, stencilName) < 0)
{ {

90
docs/stashed/grapheditor/www/js/Toolbar.js
View File

@ -16,7 +16,7 @@ function Toolbar(editorUi, container)
this.init(); this.init();
// Global handler to hide the current menu // Global handler to hide the current menu
this.gestureHandler = this.bind(function(evt) this.gestureHandler = ((evt) =>
{ {
if (this.editorUi.currentMenu != null && mxEvent.getSource(evt) != this.editorUi.currentMenu.div) if (this.editorUi.currentMenu != null && mxEvent.getSource(evt) != this.editorUi.currentMenu.div)
{ {
@ -94,7 +94,7 @@ Toolbar.prototype.init = function()
} }
// Updates the label if the scale changes // Updates the label if the scale changes
this.updateZoom = this.bind(function() this.updateZoom = (() =>
{ {
viewMenu.innerHTML = Math.round(this.editorUi.editor.graph.view.scale * 100) + '%' + viewMenu.innerHTML = Math.round(this.editorUi.editor.graph.view.scale * 100) + '%' +
this.dropdownImageHtml; this.dropdownImageHtml;
@ -145,7 +145,7 @@ Toolbar.prototype.init = function()
if (sw >= 440) if (sw >= 440)
{ {
this.edgeShapeMenu = this.addMenuFunction('', Resources.get('connection'), false, this.bind(function(menu) this.edgeShapeMenu = this.addMenuFunction('', Resources.get('connection'), false, ((menu) =>
{ {
this.editorUi.menus.edgeStyleChange(menu, '', ['shape', 'width'], [null, null], 'geIcon geSprite geSprite-connection', null, true).setAttribute('title', Resources.get('line')); this.editorUi.menus.edgeStyleChange(menu, '', ['shape', 'width'], [null, null], 'geIcon geSprite geSprite-connection', null, true).setAttribute('title', Resources.get('line'));
this.editorUi.menus.edgeStyleChange(menu, '', ['shape', 'width'], ['link', null], 'geIcon geSprite geSprite-linkedge', null, true).setAttribute('title', Resources.get('link')); this.editorUi.menus.edgeStyleChange(menu, '', ['shape', 'width'], ['link', null], 'geIcon geSprite geSprite-linkedge', null, true).setAttribute('title', Resources.get('link'));
@ -156,7 +156,7 @@ Toolbar.prototype.init = function()
this.addDropDownArrow(this.edgeShapeMenu, 'geSprite-connection', 44, 50, 0, 0, 22, -4); this.addDropDownArrow(this.edgeShapeMenu, 'geSprite-connection', 44, 50, 0, 0, 22, -4);
} }
this.edgeStyleMenu = this.addMenuFunction('geSprite-orthogonal', Resources.get('waypoints'), false, this.bind(function(menu) this.edgeStyleMenu = this.addMenuFunction('geSprite-orthogonal', Resources.get('waypoints'), false, ((menu) =>
{ {
this.editorUi.menus.edgeStyleChange(menu, '', ['edge', 'curved', 'noEdgeStyle'], [null, null, null], 'geIcon geSprite geSprite-straight', null, true).setAttribute('title', Resources.get('straight')); this.editorUi.menus.edgeStyleChange(menu, '', ['edge', 'curved', 'noEdgeStyle'], [null, null, null], 'geIcon geSprite geSprite-straight', null, true).setAttribute('title', Resources.get('straight'));
this.editorUi.menus.edgeStyleChange(menu, '', ['edge', 'curved', 'noEdgeStyle'], ['orthogonalEdgeStyle', null, null], 'geIcon geSprite geSprite-orthogonal', null, true).setAttribute('title', Resources.get('orthogonal')); this.editorUi.menus.edgeStyleChange(menu, '', ['edge', 'curved', 'noEdgeStyle'], ['orthogonalEdgeStyle', null, null], 'geIcon geSprite geSprite-orthogonal', null, true).setAttribute('title', Resources.get('orthogonal'));
@ -187,7 +187,7 @@ Toolbar.prototype.addTableDropDown = function()
// KNOWN: All table stuff does not work with undo/redo // KNOWN: All table stuff does not work with undo/redo
// KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems // KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems
// to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text). // to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text).
let menuElt = this.addMenuFunction('geIcon geSprite geSprite-table', Resources.get('table'), false, this.bind(function(menu) let menuElt = this.addMenuFunction('geIcon geSprite geSprite-table', Resources.get('table'), false, ((menu) =>
{ {
let graph = this.editorUi.editor.graph; let graph = this.editorUi.editor.graph;
let cell = graph.getSelectionCell(); let cell = graph.getSelectionCell();
@ -198,7 +198,7 @@ Toolbar.prototype.addTableDropDown = function()
} }
else else
{ {
let elt = menu.addItem('', null, this.bind(function() let elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -211,7 +211,7 @@ Toolbar.prototype.addTableDropDown = function()
}), null, 'geIcon geSprite geSprite-insertcolumnbefore'); }), null, 'geIcon geSprite geSprite-insertcolumnbefore');
elt.setAttribute('title', Resources.get('insertColumnBefore')); elt.setAttribute('title', Resources.get('insertColumnBefore'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -224,7 +224,7 @@ Toolbar.prototype.addTableDropDown = function()
}), null, 'geIcon geSprite geSprite-insertcolumnafter'); }), null, 'geIcon geSprite geSprite-insertcolumnafter');
elt.setAttribute('title', Resources.get('insertColumnAfter')); elt.setAttribute('title', Resources.get('insertColumnAfter'));
elt = menu.addItem('Delete column', null, this.bind(function() elt = menu.addItem('Delete column', null, (() =>
{ {
if (cell != null) if (cell != null)
{ {
@ -240,7 +240,7 @@ Toolbar.prototype.addTableDropDown = function()
}), null, 'geIcon geSprite geSprite-deletecolumn'); }), null, 'geIcon geSprite geSprite-deletecolumn');
elt.setAttribute('title', Resources.get('deleteColumn')); elt.setAttribute('title', Resources.get('deleteColumn'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -253,7 +253,7 @@ Toolbar.prototype.addTableDropDown = function()
}), null, 'geIcon geSprite geSprite-insertrowbefore'); }), null, 'geIcon geSprite geSprite-insertrowbefore');
elt.setAttribute('title', Resources.get('insertRowBefore')); elt.setAttribute('title', Resources.get('insertRowBefore'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -266,7 +266,7 @@ Toolbar.prototype.addTableDropDown = function()
}), null, 'geIcon geSprite geSprite-insertrowafter'); }), null, 'geIcon geSprite geSprite-insertrowafter');
elt.setAttribute('title', Resources.get('insertRowAfter')); elt.setAttribute('title', Resources.get('insertRowAfter'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -421,51 +421,51 @@ Toolbar.prototype.createTextToolbar = function()
// KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems // KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems
// to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text). // to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text).
let alignMenu = this.addMenuFunction('', Resources.get('align'), false, this.bind(function(menu) let alignMenu = this.addMenuFunction('', Resources.get('align'), false, ((menu) =>
{ {
elt = menu.addItem('', null, this.bind(function(evt) elt = menu.addItem('', null, ((evt) =>
{ {
graph.cellEditor.alignText(mxConstants.ALIGN_LEFT, evt); graph.cellEditor.alignText(mxConstants.ALIGN_LEFT, evt);
}), null, 'geIcon geSprite geSprite-left'); }), null, 'geIcon geSprite geSprite-left');
elt.setAttribute('title', Resources.get('left')); elt.setAttribute('title', Resources.get('left'));
elt = menu.addItem('', null, this.bind(function(evt) elt = menu.addItem('', null, ((evt) =>
{ {
graph.cellEditor.alignText(mxConstants.ALIGN_CENTER, evt); graph.cellEditor.alignText(mxConstants.ALIGN_CENTER, evt);
}), null, 'geIcon geSprite geSprite-center'); }), null, 'geIcon geSprite geSprite-center');
elt.setAttribute('title', Resources.get('center')); elt.setAttribute('title', Resources.get('center'));
elt = menu.addItem('', null, this.bind(function(evt) elt = menu.addItem('', null, ((evt) =>
{ {
graph.cellEditor.alignText(mxConstants.ALIGN_RIGHT, evt); graph.cellEditor.alignText(mxConstants.ALIGN_RIGHT, evt);
}), null, 'geIcon geSprite geSprite-right'); }), null, 'geIcon geSprite geSprite-right');
elt.setAttribute('title', Resources.get('right')); elt.setAttribute('title', Resources.get('right'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('justifyfull', false, null); document.execCommand('justifyfull', false, null);
}), null, 'geIcon geSprite geSprite-justifyfull'); }), null, 'geIcon geSprite geSprite-justifyfull');
elt.setAttribute('title', Resources.get('justifyfull')); elt.setAttribute('title', Resources.get('justifyfull'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('insertorderedlist', false, null); document.execCommand('insertorderedlist', false, null);
}), null, 'geIcon geSprite geSprite-orderedlist'); }), null, 'geIcon geSprite geSprite-orderedlist');
elt.setAttribute('title', Resources.get('numberedList')); elt.setAttribute('title', Resources.get('numberedList'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('insertunorderedlist', false, null); document.execCommand('insertunorderedlist', false, null);
}), null, 'geIcon geSprite geSprite-unorderedlist'); }), null, 'geIcon geSprite geSprite-unorderedlist');
elt.setAttribute('title', Resources.get('bulletedList')); elt.setAttribute('title', Resources.get('bulletedList'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('outdent', false, null); document.execCommand('outdent', false, null);
}), null, 'geIcon geSprite geSprite-outdent'); }), null, 'geIcon geSprite geSprite-outdent');
elt.setAttribute('title', Resources.get('decreaseIndent')); elt.setAttribute('title', Resources.get('decreaseIndent'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('indent', false, null); document.execCommand('indent', false, null);
}), null, 'geIcon geSprite geSprite-indent'); }), null, 'geIcon geSprite geSprite-indent');
@ -484,7 +484,7 @@ Toolbar.prototype.createTextToolbar = function()
alignMenu.getElementsByTagName('img')[0].style.top = '5px'; alignMenu.getElementsByTagName('img')[0].style.top = '5px';
} }
let formatMenu = this.addMenuFunction('', Resources.get('format'), false, this.bind(function(menu) let formatMenu = this.addMenuFunction('', Resources.get('format'), false, ((menu) =>
{ {
elt = menu.addItem('', null, this.editorUi.actions.get('subscript').funct, elt = menu.addItem('', null, this.editorUi.actions.get('subscript').funct,
null, 'geIcon geSprite geSprite-subscript'); null, 'geIcon geSprite geSprite-subscript');
@ -503,7 +503,7 @@ Toolbar.prototype.createTextToolbar = function()
null, 'geIcon geSprite geSprite-fontbackground'); null, 'geIcon geSprite geSprite-fontbackground');
elt.setAttribute('title', Resources.get('backgroundColor')); elt.setAttribute('title', Resources.get('backgroundColor'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
document.execCommand('removeformat', false, null); document.execCommand('removeformat', false, null);
}), null, 'geIcon geSprite geSprite-removeformat'); }), null, 'geIcon geSprite geSprite-removeformat');
@ -540,19 +540,19 @@ Toolbar.prototype.createTextToolbar = function()
this.addSeparator(); this.addSeparator();
let insertMenu = this.addMenuFunction('', Resources.get('insert'), true, this.bind(function(menu) let insertMenu = this.addMenuFunction('', Resources.get('insert'), true, ((menu) =>
{ {
menu.addItem(Resources.get('insertLink'), null, this.bind(function() menu.addItem(Resources.get('insertLink'), null, (() =>
{ {
this.editorUi.actions.get('link').funct(); this.editorUi.actions.get('link').funct();
})); }));
menu.addItem(Resources.get('insertImage'), null, this.bind(function() menu.addItem(Resources.get('insertImage'), null, (() =>
{ {
this.editorUi.actions.get('image').funct(); this.editorUi.actions.get('image').funct();
})); }));
menu.addItem(Resources.get('insertHorizontalRule'), null, this.bind(function() menu.addItem(Resources.get('insertHorizontalRule'), null, (() =>
{ {
document.execCommand('inserthorizontalrule', false, null); document.execCommand('inserthorizontalrule', false, null);
})); }));
@ -578,7 +578,7 @@ Toolbar.prototype.createTextToolbar = function()
// KNOWN: All table stuff does not work with undo/redo // KNOWN: All table stuff does not work with undo/redo
// KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems // KNOWN: Lost focus after click on submenu with text (not icon) in quirks and IE8. This is because the TD seems
// to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text). // to catch the focus on click in these browsers. NOTE: Workaround in mxPopupMenu for icon items (without text).
let elt = this.addMenuFunction('geIcon geSprite geSprite-table', Resources.get('table'), false, this.bind(function(menu) let elt = this.addMenuFunction('geIcon geSprite geSprite-table', Resources.get('table'), false, ((menu) =>
{ {
let elt = graph.getSelectedElement(); let elt = graph.getSelectedElement();
let cell = graph.getParentByNames(elt, ['TD', 'TH'], graph.cellEditor.text2); let cell = graph.getParentByNames(elt, ['TD', 'TH'], graph.cellEditor.text2);
@ -613,7 +613,7 @@ Toolbar.prototype.createTextToolbar = function()
{ {
let table = graph.getParentByName(row, 'TABLE', graph.cellEditor.text2); let table = graph.getParentByName(row, 'TABLE', graph.cellEditor.text2);
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -626,7 +626,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-insertcolumnbefore'); }), null, 'geIcon geSprite geSprite-insertcolumnbefore');
elt.setAttribute('title', Resources.get('insertColumnBefore')); elt.setAttribute('title', Resources.get('insertColumnBefore'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -639,7 +639,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-insertcolumnafter'); }), null, 'geIcon geSprite geSprite-insertcolumnafter');
elt.setAttribute('title', Resources.get('insertColumnAfter')); elt.setAttribute('title', Resources.get('insertColumnAfter'));
elt = menu.addItem('Delete column', null, this.bind(function() elt = menu.addItem('Delete column', null, (() =>
{ {
if (cell != null) if (cell != null)
{ {
@ -655,7 +655,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-deletecolumn'); }), null, 'geIcon geSprite geSprite-deletecolumn');
elt.setAttribute('title', Resources.get('deleteColumn')); elt.setAttribute('title', Resources.get('deleteColumn'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -668,7 +668,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-insertrowbefore'); }), null, 'geIcon geSprite geSprite-insertrowbefore');
elt.setAttribute('title', Resources.get('insertRowBefore')); elt.setAttribute('title', Resources.get('insertRowBefore'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -681,7 +681,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-insertrowafter'); }), null, 'geIcon geSprite geSprite-insertrowafter');
elt.setAttribute('title', Resources.get('insertRowAfter')); elt.setAttribute('title', Resources.get('insertRowAfter'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
try try
{ {
@ -694,7 +694,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-deleterow'); }), null, 'geIcon geSprite geSprite-deleterow');
elt.setAttribute('title', Resources.get('deleteRow')); elt.setAttribute('title', Resources.get('deleteRow'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
// Converts rgb(r,g,b) values // Converts rgb(r,g,b) values
let color = table.style.borderColor.replace( let color = table.style.borderColor.replace(
@ -720,7 +720,7 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-strokecolor'); }), null, 'geIcon geSprite geSprite-strokecolor');
elt.setAttribute('title', Resources.get('borderColor')); elt.setAttribute('title', Resources.get('borderColor'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
// Converts rgb(r,g,b) values // Converts rgb(r,g,b) values
let color = table.style.backgroundColor.replace( let color = table.style.backgroundColor.replace(
@ -742,11 +742,11 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-fillcolor'); }), null, 'geIcon geSprite geSprite-fillcolor');
elt.setAttribute('title', Resources.get('backgroundColor')); elt.setAttribute('title', Resources.get('backgroundColor'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
let value = table.getAttribute('cellPadding') || 0; let value = table.getAttribute('cellPadding') || 0;
let dlg = new FilenameDialog(this.editorUi, value, Resources.get('apply'), this.bind(function(newValue) let dlg = new FilenameDialog(this.editorUi, value, Resources.get('apply'), ((newValue) =>
{ {
if (newValue != null && newValue.length > 0) if (newValue != null && newValue.length > 0)
{ {
@ -762,19 +762,19 @@ Toolbar.prototype.createTextToolbar = function()
}), null, 'geIcon geSprite geSprite-fit'); }), null, 'geIcon geSprite geSprite-fit');
elt.setAttribute('title', Resources.get('spacing')); elt.setAttribute('title', Resources.get('spacing'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
table.setAttribute('align', 'left'); table.setAttribute('align', 'left');
}), null, 'geIcon geSprite geSprite-left'); }), null, 'geIcon geSprite geSprite-left');
elt.setAttribute('title', Resources.get('left')); elt.setAttribute('title', Resources.get('left'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
table.setAttribute('align', 'center'); table.setAttribute('align', 'center');
}), null, 'geIcon geSprite geSprite-center'); }), null, 'geIcon geSprite geSprite-center');
elt.setAttribute('title', Resources.get('center')); elt.setAttribute('title', Resources.get('center'));
elt = menu.addItem('', null, this.bind(function() elt = menu.addItem('', null, (() =>
{ {
table.setAttribute('align', 'right'); table.setAttribute('align', 'right');
}), null, 'geIcon geSprite geSprite-right'); }), null, 'geIcon geSprite geSprite-right');
@ -993,7 +993,7 @@ Toolbar.prototype.addClickHandler = function(elt, funct)
// Prevents focus // Prevents focus
mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
this.bind(function(evt) ((evt) =>
{ {
evt.preventDefault(); evt.preventDefault();
})); }));
@ -1043,7 +1043,7 @@ Toolbar.prototype.addMenuHandler = function(elt, showLabels, funct, showAll)
let menu = null; let menu = null;
let show = true; let show = true;
mxEvent.addListener(elt, 'click', this.bind(function(evt) mxEvent.addListener(elt, 'click', ((evt) =>
{ {
if (show && (elt.enabled == null || elt.enabled)) if (show && (elt.enabled == null || elt.enabled))
{ {
@ -1064,7 +1064,7 @@ Toolbar.prototype.addMenuHandler = function(elt, showLabels, funct, showAll)
menu.div.style.width = '40px'; menu.div.style.width = '40px';
} }
menu.hideMenu = this.bind(function() menu.hideMenu = (() =>
{ {
mxPopupMenu.prototype.hideMenu.apply(menu, arguments); mxPopupMenu.prototype.hideMenu.apply(menu, arguments);
this.editorUi.resetCurrentMenu(); this.editorUi.resetCurrentMenu();
@ -1072,7 +1072,7 @@ Toolbar.prototype.addMenuHandler = function(elt, showLabels, funct, showAll)
}); });
// Extends destroy to reset global state // Extends destroy to reset global state
menu.addListener(mxEvent.EVENT_HIDE, this.bind(function() menu.addListener(mxEvent.EVENT_HIDE, (() =>
{ {
this.currentElt = null; this.currentElt = null;
})); }));
@ -1084,7 +1084,7 @@ Toolbar.prototype.addMenuHandler = function(elt, showLabels, funct, showAll)
// Hides menu if already showing and prevents focus // Hides menu if already showing and prevents focus
mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
this.bind(function(evt) ((evt) =>
{ {
show = this.currentElt != elt; show = this.currentElt != elt;
evt.preventDefault(); evt.preventDefault();