. Default is true.
+ */
+EditorUi.prototype.allowAnimation = true;
+
+/**
+ * Default is 2.
+ */
+EditorUi.prototype.lightboxMaxFitScale = 2;
+
+/**
+ * Default is 4.
+ */
+EditorUi.prototype.lightboxVerticalDivider = 4;
+
+/**
+ * Specifies if single click on horizontal split should collapse sidebar. Default is false.
+ */
+EditorUi.prototype.hsplitClickEnabled = false;
+
+/**
+ * Whether the default styles should be updated when styles are changed. Default is true.
+ */
+EditorUi.prototype.updateDefaultStyle = false;
+
+/**
+ * Whether the default styles should be updated when styles are changed. Default is true.
+ */
+EditorUi.prototype.spaceDown = false;
+
+/**
+ * Whether the default styles should be updated when styles are changed. Default is true.
+ */
+EditorUi.prototype.shiftDown = false;
+
+/**
+ * Installs the listeners to update the action states.
+ */
+EditorUi.prototype.init = function () {
+ var graph = this.editor.graph;
+
+ if (!graph.standalone) {
+ if (urlParams['shape-picker'] != '0') {
+ this.installShapePicker();
+ }
+
+ // Hides tooltips and connection points when scrolling
+ mxEvent.addListener(graph.container, 'scroll', mxUtils.bind(this, function () {
+ graph.tooltipHandler.hide();
+
+ if (graph.connectionHandler != null && graph.connectionHandler.constraintHandler != null) {
+ graph.connectionHandler.constraintHandler.reset();
+ }
+ }));
+
+ // Hides tooltip on escape
+ graph.addListener(mxEvent.ESCAPE, mxUtils.bind(this, function () {
+ graph.tooltipHandler.hide();
+ var rb = graph.getRubberband();
+
+ if (rb != null) {
+ rb.cancel();
+ }
+ }));
+
+ mxEvent.addListener(graph.container, 'keydown', mxUtils.bind(this, function (evt) {
+ this.onKeyDown(evt);
+ }));
+
+ mxEvent.addListener(graph.container, 'keypress', mxUtils.bind(this, function (evt) {
+ this.onKeyPress(evt);
+ }));
+
+ // Updates action states
+ this.addUndoListener();
+ this.addBeforeUnloadListener();
+
+ graph.getSelectionModel().addListener(mxEvent.CHANGE, mxUtils.bind(this, function () {
+ this.updateActionStates();
+ }));
+
+ graph.getModel().addListener(mxEvent.CHANGE, mxUtils.bind(this, function () {
+ this.updateActionStates();
+ }));
+
+ // Changes action states after change of default parent
+ var graphSetDefaultParent = graph.setDefaultParent;
+ var ui = this;
+
+ this.editor.graph.setDefaultParent = function () {
+ graphSetDefaultParent.apply(this, arguments);
+ ui.updateActionStates();
+ };
+
+ // Hack to make showLinkDialog and editLink available in vertex handler
+ graph.showLinkDialog = mxUtils.bind(ui, ui.showLinkDialog);
+ graph.editLink = ui.actions.get('editLink').funct;
+
+ this.updateActionStates();
+ this.initClipboard();
+ this.initCanvas();
+
+ if (this.format != null) {
+ this.format.init();
+ }
+ }
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.clearSelectionState = function () {
+ this.selectionState = null;
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.getSelectionState = function () {
+ if (this.selectionState == null) {
+ this.selectionState = this.createSelectionState();
+ }
+
+ return this.selectionState;
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.createSelectionState = function () {
+ var graph = this.editor.graph;
+ var cells = graph.getSelectionCells();
+ var result = this.initSelectionState();
+ var initial = true;
+
+ for (var i = 0; i < cells.length; i++) {
+ var style = graph.getCurrentCellStyle(cells[i]);
+
+ if (mxUtils.getValue(style, mxConstants.STYLE_EDITABLE, '1') != '0') {
+ this.updateSelectionStateForCell(result, cells[i], cells, initial);
+ initial = false;
+ }
+ }
+
+ this.updateSelectionStateForTableCells(result);
+
+ return result;
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.initSelectionState = function () {
+ return {
+ vertices: [], edges: [], cells: [], x: null, y: null, width: null, height: null,
+ style: {}, containsImage: false, containsLabel: false, fill: true, glass: true,
+ rounded: true, autoSize: false, image: false, shadow: true, lineJumps: true, resizable: true,
+ table: false, cell: false, row: false, movable: true, rotatable: true, stroke: true,
+ swimlane: false, unlocked: this.editor.graph.isEnabled(), connections: false
+ };
+};
+
+/**
+ * Adds information about current selected table cells range.
+ */
+EditorUi.prototype.updateSelectionStateForTableCells = function (result) {
+ if (result.cells.length > 1 && result.cell) {
+ var cells = mxUtils.sortCells(result.cells);
+ var model = this.editor.graph.model;
+ var parent = model.getParent(cells[0]);
+ var table = model.getParent(parent);
+
+ if (parent != null && table != null) {
+ var col = parent.getIndex(cells[0]);
+ var row = table.getIndex(parent);
+ var lastspan = null;
+ var colspan = 1;
+ var rowspan = 1;
+ var index = 0;
+
+ var nextRowCell = (row < table.getChildCount() - 1) ?
+ model.getChildAt(model.getChildAt(
+ table, row + 1), col) : null;
+
+ while (index < cells.length - 1) {
+ var next = cells[++index];
+
+ if (nextRowCell != null && nextRowCell == next &&
+ (lastspan == null || colspan == lastspan)) {
+ lastspan = colspan;
+ colspan = 0;
+ rowspan++;
+ parent = model.getParent(nextRowCell);
+ nextRowCell = (row + rowspan < table.getChildCount()) ?
+ model.getChildAt(model.getChildAt(
+ table, row + rowspan), col) : null;
+ }
+
+ var state = this.editor.graph.view.getState(next);
+
+ if (next == model.getChildAt(parent, col + colspan) && state != null &&
+ mxUtils.getValue(state.style, 'colspan', 1) == 1 &&
+ mxUtils.getValue(state.style, 'rowspan', 1) == 1) {
+ colspan++;
+ }
+ else {
+ break;
+ }
+ }
+
+ if (index == rowspan * colspan - 1) {
+ result.mergeCell = cells[0];
+ result.colspan = colspan;
+ result.rowspan = rowspan;
+ }
+ }
+ }
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.windowResized = function () {
+ window.setTimeout(mxUtils.bind(this, function () {
+ if (this.editor.graph != null) {
+ this.refresh();
+ }
+ }), 0);
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.createTimeout = function (timeout, fn, error) {
+ var acceptResponse = true;
+ var result = null;
+
+ var handleError = mxUtils.bind(this, function (e) {
+ if (result.clear()) {
+ acceptResponse = false;
+ e = (e != null) ? e : {
+ code: App.ERROR_TIMEOUT,
+ message: mxResources.get('timeout'),
+ retry: mxUtils.bind(this, function () {
+ this.createTimeout(timeout, fn, error);
+ })
+ };
+
+ if (error != null) {
+ error(e);
+ }
+ else {
+ this.handleError(e);
+ }
+ }
+ });
+
+ var timeoutThread = window.setTimeout(handleError,
+ (timeout != null) ? timeout : this.timeout);
+
+ var result = {
+ clear: function () {
+ window.clearTimeout(timeoutThread);
+
+ return acceptResponse;
+ },
+ isAlive: function () {
+ return acceptResponse;
+ }
+ };
+
+ if (fn != null) {
+ this.tryAndHandle(mxUtils.bind(this, function () {
+ fn(result);
+ }), handleError);
+ }
+
+ return result;
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.tryAndHandle = function (fn, error) {
+ try {
+ fn();
+ }
+ catch (e) {
+ if (error != null) {
+ error(e);
+ }
+ else {
+ this.handleError(e);
+ }
+ }
+};
+
+/**
+ * Returns information about the current selection.
+ */
+EditorUi.prototype.updateSelectionStateForCell = function (result, cell, cells, initial) {
+ var graph = this.editor.graph;
+ result.cells.push(cell);
+
+ if (graph.getModel().isVertex(cell)) {
+ result.connections = graph.model.getEdgeCount(cell) > 0;
+ result.unlocked = result.unlocked && !graph.isCellLocked(cell);
+ result.resizable = result.resizable && graph.isCellResizable(cell);
+ result.rotatable = result.rotatable && graph.isCellRotatable(cell);
+ result.movable = result.movable && graph.isCellMovable(cell) &&
+ !graph.isTableRow(cell) && !graph.isTableCell(cell);
+ result.swimlane = result.swimlane || graph.isSwimlane(cell);
+ result.table = result.table || graph.isTable(cell);
+ result.cell = result.cell || graph.isTableCell(cell);
+ result.row = result.row || graph.isTableRow(cell);
+ result.vertices.push(cell);
+ var geo = graph.getCellGeometry(cell);
+
+ if (geo != null) {
+ if (geo.width > 0) {
+ if (result.width == null) {
+ result.width = geo.width;
+ }
+ else if (result.width != geo.width) {
+ result.width = '';
+ }
+ }
+ else {
+ result.containsLabel = true;
+ }
+
+ if (geo.height > 0) {
+ if (result.height == null) {
+ result.height = geo.height;
+ }
+ else if (result.height != geo.height) {
+ result.height = '';
+ }
+ }
+ else {
+ result.containsLabel = true;
+ }
+
+ if (!geo.relative || geo.offset != null) {
+ var x = (geo.relative) ? geo.offset.x : geo.x;
+ var y = (geo.relative) ? geo.offset.y : geo.y;
+
+ if (result.x == null) {
+ result.x = x;
+ }
+ else if (result.x != x) {
+ result.x = '';
+ }
+
+ if (result.y == null) {
+ result.y = y;
+ }
+ else if (result.y != y) {
+ result.y = '';
+ }
+ }
+ }
+ }
+ else if (graph.getModel().isEdge(cell)) {
+ result.edges.push(cell);
+ result.connections = true;
+ result.resizable = false;
+ result.rotatable = false;
+ result.movable = false;
+ }
+
+ var state = graph.view.getState(cell);
+
+ if (state != null) {
+ result.autoSize = result.autoSize || graph.isAutoSizeState(state);
+ result.glass = result.glass && graph.isGlassState(state);
+ result.rounded = result.rounded && graph.isRoundedState(state);
+ result.lineJumps = result.lineJumps && graph.isLineJumpState(state);
+ result.image = result.image || graph.isImageState(state);
+ result.shadow = result.shadow && graph.isShadowState(state);
+ result.fill = result.fill && graph.isFillState(state);
+ result.gradient = result.fill && graph.isGradientState(state);
+ result.stroke = result.stroke && graph.isStrokeState(state);
+
+ var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
+ result.containsImage = result.containsImage || shape == 'image';
+ graph.mergeStyle(state.style, result.style, initial);
+ }
+};
+
+/**
+ * Returns true if the given event should start editing. This implementation returns true.
+ */
+EditorUi.prototype.installShapePicker = function () {
+ var graph = this.editor.graph;
+ var ui = this;
+
+ // Uses this event to process mouseDown to check the selection state before it is changed
+ graph.addListener(mxEvent.FIRE_MOUSE_EVENT, mxUtils.bind(this, function (sender, evt) {
+ if (evt.getProperty('eventName') == 'mouseDown') {
+ ui.hideShapePicker();
+ }
+ }));
+
+ var hidePicker = mxUtils.bind(this, function () {
+ ui.hideShapePicker(true);
+ });
+
+ graph.addListener('wheel', hidePicker);
+ graph.addListener(mxEvent.ESCAPE, hidePicker);
+ graph.view.addListener(mxEvent.SCALE, hidePicker);
+ graph.view.addListener(mxEvent.SCALE_AND_TRANSLATE, hidePicker);
+ graph.getSelectionModel().addListener(mxEvent.CHANGE, hidePicker);
+
+ // Counts as popup menu
+ var popupMenuHandlerIsMenuShowing = graph.popupMenuHandler.isMenuShowing;
+
+ graph.popupMenuHandler.isMenuShowing = function () {
+ return popupMenuHandlerIsMenuShowing.apply(this, arguments) ||
+ ui.shapePicker != null || ui.currentMenu != null;
+ };
+
+ // Adds dbl click dialog for inserting shapes
+ var graphDblClick = graph.dblClick;
+
+ graph.dblClick = function (evt, cell) {
+ if (this.isEnabled()) {
+ if (cell == null && ui.sidebar != null && !mxEvent.isShiftDown(evt) &&
+ !graph.isCellLocked(graph.getDefaultParent())) {
+ var pt = mxUtils.convertPoint(this.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ mxEvent.consume(evt);
+
+ // Asynchronous to avoid direct insert after double tap
+ window.setTimeout(mxUtils.bind(this, function () {
+ ui.showShapePicker(pt.x, pt.y);
+ }), 30);
+ }
+ else {
+ graphDblClick.apply(this, arguments);
+ }
+ }
+ };
+
+ if (this.hoverIcons != null) {
+ this.hoverIcons.addListener('reset', hidePicker);
+ var hoverIconsDrag = this.hoverIcons.drag;
+
+ this.hoverIcons.drag = function () {
+ ui.hideShapePicker();
+ hoverIconsDrag.apply(this, arguments);
+ };
+
+ var hoverIconsExecute = this.hoverIcons.execute;
+
+ this.hoverIcons.execute = function (state, dir, me) {
+ var evt = me.getEvent();
+
+ if (!this.graph.isCloneEvent(evt) && !mxEvent.isShiftDown(evt)) {
+ this.graph.connectVertex(state.cell, dir, this.graph.defaultEdgeLength, evt, null, null, mxUtils.bind(this, function (x, y, execute) {
+ var temp = graph.getCompositeParent(state.cell);
+ var geo = graph.getCellGeometry(temp);
+ me.consume();
+
+ while (temp != null && graph.model.isVertex(temp) && geo != null && geo.relative) {
+ cell = temp;
+ temp = graph.model.getParent(cell)
+ geo = graph.getCellGeometry(temp);
+ }
+
+ // Asynchronous to avoid direct insert after double tap
+ window.setTimeout(mxUtils.bind(this, function () {
+ ui.showShapePicker(me.getGraphX(), me.getGraphY(), temp, mxUtils.bind(this, function (cell) {
+ execute(cell);
+
+ if (ui.hoverIcons != null) {
+ ui.hoverIcons.update(graph.view.getState(cell));
+ }
+ }), dir);
+ }), 30);
+ }), mxUtils.bind(this, function (result) {
+ this.graph.selectCellsForConnectVertex(result, evt, this);
+ }));
+ }
+ else {
+ hoverIconsExecute.apply(this, arguments);
+ }
+ };
+
+ var thread = null;
+
+ this.hoverIcons.addListener('focus', mxUtils.bind(this, function (sender, evt) {
+ if (thread != null) {
+ window.clearTimeout(thread);
+ }
+
+ thread = window.setTimeout(mxUtils.bind(this, function () {
+ var arrow = evt.getProperty('arrow');
+ var dir = evt.getProperty('direction');
+ var mouseEvent = evt.getProperty('event');
+
+ var rect = arrow.getBoundingClientRect();
+ var offset = mxUtils.getOffset(graph.container);
+ var x = graph.container.scrollLeft + rect.x - offset.x;
+ var y = graph.container.scrollTop + rect.y - offset.y;
+
+ var temp = graph.getCompositeParent((this.hoverIcons.currentState != null) ?
+ this.hoverIcons.currentState.cell : null);
+ var div = ui.showShapePicker(x, y, temp, mxUtils.bind(this, function (cell) {
+ if (cell != null) {
+ graph.connectVertex(temp, dir, graph.defaultEdgeLength, mouseEvent, true, false, function (x, y, execute) {
+ execute(cell);
+
+ if (ui.hoverIcons != null) {
+ ui.hoverIcons.update(graph.view.getState(cell));
+ }
+ }, function (cells) {
+ graph.selectCellsForConnectVertex(cells);
+ }, mouseEvent, this.hoverIcons);
+ }
+ }), dir, true);
+
+ this.centerShapePicker(div, rect, x, y, dir);
+ mxUtils.setOpacity(div, 30);
+
+ mxEvent.addListener(div, 'mouseenter', function () {
+ mxUtils.setOpacity(div, 100);
+ });
+
+ mxEvent.addListener(div, 'mouseleave', function () {
+ ui.hideShapePicker();
+ });
+ }), Editor.shapePickerHoverDelay);
+ }));
+
+ this.hoverIcons.addListener('blur', mxUtils.bind(this, function (sender, evt) {
+ if (thread != null) {
+ window.clearTimeout(thread);
+ }
+ }));
+ }
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.centerShapePicker = function (div, rect, x, y, dir) {
+ if (dir == mxConstants.DIRECTION_EAST || dir == mxConstants.DIRECTION_WEST) {
+ div.style.width = '40px';
+ }
+
+ var r2 = div.getBoundingClientRect();
+
+ if (dir == mxConstants.DIRECTION_NORTH) {
+ x -= r2.width / 2 - 10;
+ y -= r2.height + 6;
+ }
+ else if (dir == mxConstants.DIRECTION_SOUTH) {
+ x -= r2.width / 2 - 10;
+ y += rect.height + 6;
+ }
+ else if (dir == mxConstants.DIRECTION_WEST) {
+ x -= r2.width + 6;
+ y -= r2.height / 2 - 10;
+ }
+ else if (dir == mxConstants.DIRECTION_EAST) {
+ x += rect.width + 6;
+ y -= r2.height / 2 - 10;
+ }
+
+ div.style.left = x + 'px';
+ div.style.top = y + 'px';
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.showShapePicker = function (x, y, source, callback, direction, hovering,
+ getInsertLocationFn, showEdges, startEditing) {
+ showEdges = showEdges || source == null;
+
+ var div = this.createShapePicker(x, y, source, callback, direction, mxUtils.bind(this, function () {
+ this.hideShapePicker();
+ }), this.getCellsForShapePicker(source, hovering, showEdges), hovering,
+ getInsertLocationFn, showEdges, startEditing);
+
+ if (div != null) {
+ if (this.hoverIcons != null && !hovering) {
+ this.hoverIcons.reset();
+ }
+
+ var graph = this.editor.graph;
+ graph.popupMenuHandler.hideMenu();
+ graph.tooltipHandler.hideTooltip();
+ this.hideCurrentMenu();
+ this.hideShapePicker();
+
+ this.shapePickerCallback = callback;
+ this.shapePicker = div;
+ }
+
+ return div;
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.createShapePicker = function (x, y, source, callback, direction,
+ afterClick, cells, hovering, getInsertLocationFn, showEdges, startEditing) {
+ startEditing = (startEditing != null) ? startEditing : true;
+ var graph = this.editor.graph;
+ var div = null;
+
+ getInsertLocationFn = (getInsertLocationFn != null) ? getInsertLocationFn : function (cells) {
+ var cell = cells[0];
+ var w = 0;
+ var h = 0;
+ var geo = cell.geometry;
+
+ if (geo != null) {
+ if (graph.model.isEdge(cell)) {
+ var pt = geo.getTerminalPoint(false);
+ geo = new mxRectangle(0, 0, pt.x, pt.y);
+ }
+
+ w = geo.width / 2;
+ h = geo.height / 2;
+ }
+
+ return new mxPoint(graph.snap(Math.round(x / graph.view.scale) - graph.view.translate.x - w),
+ graph.snap(Math.round(y / graph.view.scale) - graph.view.translate.y - h));
+ };
+
+ if (cells != null && cells.length > 0) {
+ var ui = this;
+ var graph = this.editor.graph;
+ div = document.createElement('div');
+ var sourceState = graph.view.getState(source);
+ var style = (source != null && (sourceState == null ||
+ !graph.isTransparentState(sourceState))) ?
+ graph.copyStyle(source) : null;
+
+ // Do not place entry under pointer for touch devices
+ var w = (cells.length < 6) ? cells.length * 35 : 140;
+ div.className = 'geToolbarContainer geSidebarContainer geShapePicker';
+ div.setAttribute('title', mxResources.get('sidebarTooltip'));
+ div.style.left = x + 'px';
+ div.style.top = y + 'px';
+ div.style.width = w + 'px';
+
+ // Disables built-in pan and zoom on touch devices
+ if (mxClient.IS_POINTER) {
+ div.style.touchAction = 'none';
+ }
+
+ if (!hovering) {
+ mxUtils.setPrefixedStyle(div.style, 'transform', 'translate(-22px,-22px)');
+ }
+
+ if (graph.background != null && graph.background != mxConstants.NONE) {
+ div.style.backgroundColor = graph.background;
+ }
+
+ graph.container.appendChild(div);
+
+ var addCell = mxUtils.bind(this, function (cell) {
+ // Wrapper needed to catch events
+ var node = document.createElement('a');
+ node.className = 'geItem';
+ node.style.cssText = 'position:relative;display:inline-block;position:relative;' +
+ 'width:30px;height:30px;cursor:pointer;overflow:hidden;padding:1px';
+ div.appendChild(node);
+
+ if (style != null && urlParams['sketch'] != '1') {
+ this.sidebar.graph.pasteStyle(style, [cell]);
+ }
+ else {
+ ui.insertHandler([cell], cell.value != '' && urlParams['sketch'] != '1', this.sidebar.graph.model);
+ }
+
+ var geo = cell.geometry;
+
+ if (graph.model.isEdge(cell)) {
+ var pt = geo.getTerminalPoint(false);
+ geo = new mxRectangle(0, 0, pt.x, pt.y);
+ }
+
+ if (geo != null) {
+ node.appendChild(this.sidebar.createVertexTemplateFromCells([cell],
+ geo.width, geo.height, '', true, false, null, false,
+ mxUtils.bind(this, function (evt) {
+ if (mxEvent.isShiftDown(evt) && (source != null ||
+ !graph.isSelectionEmpty())) {
+ var temp = graph.getEditableCells((source != null) ?
+ [source] : graph.getSelectionCells());
+ graph.updateShapes(cell, temp);
+ }
+ else {
+ var clone = graph.cloneCell(cell);
+
+ if (callback != null) {
+ callback(clone);
+ }
+ else {
+ var pt = getInsertLocationFn([clone]);
+
+ if (graph.model.isEdge(clone)) {
+ clone.geometry.translate(pt.x, pt.y);
+ }
+ else {
+ clone.geometry.x = pt.x;
+ clone.geometry.y = pt.y;
+ }
+
+ graph.model.beginUpdate();
+ try {
+ graph.addCell(clone);
+
+ if (graph.model.isVertex(clone) &&
+ graph.isAutoSizeCell(clone)) {
+ graph.updateCellSize(clone);
+ }
+ }
+ finally {
+ graph.model.endUpdate();
+ }
+
+ graph.setSelectionCell(clone);
+ graph.scrollCellToVisible(clone);
+
+ if (startEditing) {
+ graph.startEditing(clone);
+ }
+
+ if (ui.hoverIcons != null) {
+ ui.hoverIcons.update(graph.view.getState(clone));
+ }
+ }
+ }
+
+ if (afterClick != null) {
+ afterClick(evt);
+ }
+
+ mxEvent.consume(evt);
+ }), 25, 25, null, null, source));
+ }
+ });
+
+ for (var i = 0; i < (hovering ? Math.min(cells.length, 4) : cells.length); i++) {
+ addCell(cells[i]);
+ }
+
+ var b = graph.container.scrollTop + graph.container.offsetHeight;
+ var dy = div.offsetTop + div.clientHeight - b;
+
+ if (dy > 0) {
+ div.style.top = Math.max(graph.container.scrollTop + 22, y - dy) + 'px';
+ }
+
+ var r = graph.container.scrollLeft + graph.container.offsetWidth;
+ var dx = div.offsetLeft + div.clientWidth - r;
+
+ if (dx > 0) {
+ div.style.left = Math.max(graph.container.scrollLeft + 22, x - dx) + 'px';
+ }
+ }
+
+ return div;
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.getCellsForShapePicker = function (cell, hovering, showEdges) {
+ var graph = this.editor.graph;
+
+ var createVertex = mxUtils.bind(this, function (style, w, h, value) {
+ return graph.createVertex(null, null, value || '', 0, 0, w || 120, h || 60, style, false);
+ });
+
+ var createEdge = mxUtils.bind(this, function (style, y, value) {
+ var cell = new mxCell(value || '', new mxGeometry(0, 0, graph.defaultEdgeLength + 20, 0), style);
+ cell.geometry.setTerminalPoint(new mxPoint(0, 0), true);
+ cell.geometry.setTerminalPoint(new mxPoint(cell.geometry.width, (y != null) ? y : 0), false);
+ cell.geometry.points = (y != null) ? [new mxPoint(cell.geometry.width / 2, y)] : [];
+ cell.geometry.relative = true;
+ cell.edge = true;
+
+ return cell;
+ });
+
+ // Creates a clone of the source cell and moves it to the origin
+ if (cell != null) {
+ try {
+ cell = graph.cloneCell(cell);
+
+ if (graph.model.isVertex(cell) && cell.geometry != null) {
+ cell.geometry.x = 0;
+ cell.geometry.y = 0;
+ }
+ }
+ catch (e) {
+ cell = null;
+ }
+ }
+
+ if (cell == null) {
+ cell = createVertex('text;html=1;align=center;verticalAlign=middle;resizable=0;' +
+ 'points=[];autosize=1;strokeColor=none;fillColor=none;', 40, 20, 'Text');
+
+ if (graph.model.isVertex(cell) && graph.isAutoSizeCell(cell)) {
+ // Uses offscreen graph to bypass undo history
+ var tempGraph = Graph.createOffscreenGraph(graph.getStylesheet());
+ tempGraph.updateCellSize(cell);
+ }
+ }
+
+ var cells = [cell, createVertex('whiteSpace=wrap;html=1;'),
+ createVertex('ellipse;whiteSpace=wrap;html=1;', 80, 80),
+ createVertex('rhombus;whiteSpace=wrap;html=1;', 80, 80),
+ createVertex('rounded=1;whiteSpace=wrap;html=1;'),
+ createVertex('shape=parallelogram;perimeter=parallelogramPerimeter;whiteSpace=wrap;html=1;fixedSize=1;'),
+ createVertex('shape=trapezoid;perimeter=trapezoidPerimeter;whiteSpace=wrap;html=1;fixedSize=1;', 120, 60),
+ createVertex('shape=hexagon;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;fixedSize=1;', 120, 80),
+ createVertex('shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;', 120, 80),
+ createVertex('shape=process;whiteSpace=wrap;html=1;backgroundOutline=1;'),
+ createVertex('triangle;whiteSpace=wrap;html=1;', 60, 80),
+ createVertex('shape=document;whiteSpace=wrap;html=1;boundedLbl=1;', 120, 80),
+ createVertex('shape=tape;whiteSpace=wrap;html=1;', 120, 100),
+ createVertex('ellipse;shape=cloud;whiteSpace=wrap;html=1;', 120, 80),
+ createVertex('shape=singleArrow;whiteSpace=wrap;html=1;arrowWidth=0.4;arrowSize=0.4;', 80, 60),
+ createVertex('shape=waypoint;sketch=0;size=6;pointerEvents=1;points=[];fillColor=none;resizable=0;' +
+ 'rotatable=0;perimeter=centerPerimeter;snapToPoint=1;', 20, 20)];
+
+ if (showEdges) {
+ cells = cells.concat([
+ createEdge('edgeStyle=none;orthogonalLoop=1;jettySize=auto;html=1;'),
+ createEdge('edgeStyle=none;orthogonalLoop=1;jettySize=auto;html=1;endArrow=classic;startArrow=classic;endSize=8;startSize=8;'),
+ createEdge('edgeStyle=none;orthogonalLoop=1;jettySize=auto;html=1;shape=flexArrow;rounded=1;startSize=8;endSize=8;'),
+ createEdge('edgeStyle=segmentEdgeStyle;endArrow=classic;html=1;curved=0;rounded=0;endSize=8;startSize=8;sourcePerimeterSpacing=0;targetPerimeterSpacing=0;',
+ this.editor.graph.defaultEdgeLength / 2)
+ ]);
+ }
+
+ return cells;
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.isShapePickerVisible = function (cancel) {
+ return this.shapePicker != null;
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.hideShapePicker = function (cancel) {
+ if (this.shapePicker != null) {
+ this.shapePicker.parentNode.removeChild(this.shapePicker);
+ this.shapePicker = null;
+
+ if (!cancel && this.shapePickerCallback != null) {
+ this.shapePickerCallback();
+ }
+
+ this.shapePickerCallback = null;
+ }
+};
+
+/**
+ * Whether the default styles should be updated when styles are changed. Default is true.
+ */
+EditorUi.prototype.isSpaceDown = function () {
+ return this.spaceDown;
+};
+
+/**
+ * Whether the default styles should be updated when styles are changed. Default is true.
+ */
+EditorUi.prototype.isShiftDown = function () {
+ return this.shiftDown;
+};
+
+/**
+ * Returns true if the given event should start editing. This implementation returns true.
+ */
+EditorUi.prototype.onKeyDown = function (evt) {
+ var graph = this.editor.graph;
+
+ // Alt+tab for task switcher in Windows, ctrl+tab for tab control in Chrome
+ if (evt.which == 9 && graph.isEnabled() && !mxEvent.isControlDown(evt)) {
+ if (graph.isEditing()) {
+ if (mxEvent.isAltDown(evt)) {
+ graph.stopEditing(false);
+ }
+ else {
+ try {
+ var nesting = graph.cellEditor.isContentEditing() && graph.cellEditor.isTextSelected();
+
+ if (window.getSelection && graph.cellEditor.isContentEditing() &&
+ !nesting && !mxClient.IS_IE && !mxClient.IS_IE11) {
+ var selection = window.getSelection();
+ var container = (selection.rangeCount > 0) ? selection.getRangeAt(0).commonAncestorContainer : null;
+ nesting = container != null && (container.nodeName == 'LI' || (container.parentNode != null &&
+ container.parentNode.nodeName == 'LI'));
+ }
+
+ if (nesting) {
+ // (Shift+)tab indents/outdents with text selection or inside list elements
+ document.execCommand(mxEvent.isShiftDown(evt) ? 'outdent' : 'indent', false, null);
+ }
+ // Shift+tab applies value with cursor
+ else if (mxEvent.isShiftDown(evt)) {
+ graph.stopEditing(false);
+ }
+ else {
+ // Inserts tab character
+ graph.cellEditor.insertTab(!graph.cellEditor.isContentEditing() ? 4 : null);
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+ }
+ }
+ else if (mxEvent.isAltDown(evt)) {
+ graph.selectParentCell();
+ }
+ else {
+ graph.selectCell(!mxEvent.isShiftDown(evt));
+ }
+
+ mxEvent.consume(evt);
+ }
+};
+
+/**
+ * Returns true if the given event should start editing. This implementation returns true.
+ */
+EditorUi.prototype.onKeyPress = function (evt) {
+ var graph = this.editor.graph;
+
+ // KNOWN: Focus does not work if label is empty in quirks mode
+ if (this.isImmediateEditingEvent(evt) && !graph.isEditing() && !graph.isSelectionEmpty() && evt.which !== 0 &&
+ evt.which !== 27 && !mxEvent.isAltDown(evt) && !mxEvent.isControlDown(evt) && !mxEvent.isMetaDown(evt)) {
+ graph.escape();
+ graph.startEditing();
+
+ // Workaround for FF where char is lost if cursor is placed before char
+ if (mxClient.IS_FF) {
+ var ce = graph.cellEditor;
+
+ if (ce.textarea != null) {
+ ce.textarea.innerHTML = String.fromCharCode(evt.which);
+
+ // Moves cursor to end of textarea
+ var range = document.createRange();
+ range.selectNodeContents(ce.textarea);
+ range.collapse(false);
+ var sel = window.getSelection();
+ sel.removeAllRanges();
+ sel.addRange(range);
+ }
+ }
+ }
+};
+
+/**
+ * Returns true if the given event should start editing. This implementation returns true.
+ */
+EditorUi.prototype.isImmediateEditingEvent = function (evt) {
+ return true;
+};
+
+/**
+ * Updates the CSS for the given element to match the selection.
+ */
+EditorUi.prototype.updateCssForMarker = function (markerDiv, prefix, shape, marker, fill) {
+ markerDiv.style.display = 'inline-flex';
+ markerDiv.style.alignItems = 'center';
+ markerDiv.style.justifyContent = 'center';
+ markerDiv.innerText = '';
+
+ if (shape == 'flexArrow') {
+ markerDiv.className = (marker != null && marker != mxConstants.NONE) ?
+ 'geSprite geSprite-' + prefix + 'blocktrans' : 'geSprite geSprite-noarrow';
+ }
+ else {
+ var src = this.getImageForMarker(marker, fill);
+
+ if (src != null) {
+ var img = document.createElement('img');
+ img.className = 'geAdaptiveAsset';
+ img.setAttribute('src', src);
+ markerDiv.className = '';
+
+ if (prefix == 'end') {
+ mxUtils.setPrefixedStyle(img.style, 'transform', 'scaleX(-1)');
+ }
+
+ markerDiv.appendChild(img);
+ }
+ else {
+ markerDiv.className = 'geSprite geSprite-noarrow';
+ markerDiv.innerHTML = mxUtils.htmlEntities(mxResources.get('none'));
+ markerDiv.style.backgroundImage = 'none';
+ markerDiv.style.fontSize = '11px';
+ markerDiv.style.filter = 'none';
+ }
+ }
+};
+
+/**
+ * Returns true if the given event should start editing. This implementation returns true.
+ */
+EditorUi.prototype.getImageForMarker = function (marker, fill) {
+ var result = null;
+
+ if (marker == mxConstants.ARROW_CLASSIC) {
+ result = (fill != '1') ? Format.classicMarkerImage.src :
+ Format.classicFilledMarkerImage.src
+ }
+ else if (marker == mxConstants.ARROW_CLASSIC_THIN) {
+ result = (fill != '1') ? Format.classicThinMarkerImage.src :
+ Format.openThinFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_OPEN) {
+ result = Format.openFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_OPEN_THIN) {
+ result = Format.openThinFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_BLOCK) {
+ result = (fill != '1') ? Format.blockMarkerImage.src :
+ Format.blockFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_BLOCK_THIN) {
+ result = (fill != '1') ? Format.blockThinMarkerImage.src :
+ Format.blockThinFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_OVAL) {
+ result = (fill != '1') ? Format.ovalMarkerImage.src :
+ Format.ovalFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_DIAMOND) {
+ result = (fill != '1') ? Format.diamondMarkerImage.src :
+ Format.diamondFilledMarkerImage.src;
+ }
+ else if (marker == mxConstants.ARROW_DIAMOND_THIN) {
+ result = (fill != '1') ? Format.diamondThinMarkerImage.src :
+ Format.diamondThinFilledMarkerImage.src;
+ }
+ else if (marker == 'doubleBlock') {
+ result = (fill != '1') ? Format.doubleBlockMarkerImage.src :
+ Format.doubleBlockFilledMarkerImage.src;
+ }
+ else if (marker == 'box') {
+ result = Format.boxMarkerImage.src;
+ }
+ else if (marker == 'halfCircle') {
+ result = Format.halfCircleMarkerImage.src;
+ }
+ else if (marker == 'openAsync') {
+ result = Format.openAsyncFilledMarkerImage.src;
+ }
+ else if (marker == 'async') {
+ result = (fill != '1') ? Format.asyncMarkerImage.src :
+ Format.asyncFilledMarkerImage.src;
+ }
+ else if (marker == 'dash') {
+ result = Format.dashMarkerImage.src;
+ }
+ else if (marker == 'baseDash') {
+ result = Format.baseDashMarkerImage.src;
+ }
+ else if (marker == 'cross') {
+ result = Format.crossMarkerImage.src;
+ }
+ else if (marker == 'circle') {
+ result = Format.circleMarkerImage.src;
+ }
+ else if (marker == 'circlePlus') {
+ result = Format.circlePlusMarkerImage.src;
+ }
+ else if (marker == 'ERone') {
+ result = Format.EROneMarkerImage.src;
+ }
+ else if (marker == 'ERmandOne') {
+ result = Format.ERmandOneMarkerImage.src;
+ }
+ else if (marker == 'ERmany') {
+ result = Format.ERmanyMarkerImage.src;
+ }
+ else if (marker == 'ERoneToMany') {
+ result = Format.ERoneToManyMarkerImage.src;
+ }
+ else if (marker == 'ERzeroToOne') {
+ result = Format.ERzeroToOneMarkerImage.src;
+ }
+ else if (marker == 'ERzeroToMany') {
+ result = Format.ERzeroToManyMarkerImage.src;
+ }
+
+ return result;
+};
+
+/**
+ * Overridden in Menus.js
+ */
+EditorUi.prototype.createMenus = function () {
+ return null;
+};
+
+/**
+ * Hook for allowing selection and context menu for certain events.
+ */
+EditorUi.prototype.updatePasteActionStates = function () {
+ var graph = this.editor.graph;
+ var paste = this.actions.get('paste');
+ var pasteHere = this.actions.get('pasteHere');
+
+ paste.setEnabled(this.editor.graph.cellEditor.isContentEditing() ||
+ (((!mxClient.IS_FF && navigator.clipboard != null) || !mxClipboard.isEmpty()) &&
+ graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent())));
+ pasteHere.setEnabled(paste.isEnabled());
+};
+
+/**
+ * Hook for allowing selection and context menu for certain events.
+ */
+EditorUi.prototype.initClipboard = function () {
+ var ui = this;
+
+ var mxClipboardCut = mxClipboard.cut;
+ mxClipboard.cut = function (graph) {
+ if (graph.cellEditor.isContentEditing()) {
+ document.execCommand('cut', false, null);
+ }
+ else {
+ mxClipboardCut.apply(this, arguments);
+ }
+
+ ui.updatePasteActionStates();
+ };
+
+ var mxClipboardCopy = mxClipboard.copy;
+ mxClipboard.copy = function (graph) {
+ var result = null;
+
+ if (graph.cellEditor.isContentEditing()) {
+ document.execCommand('copy', false, null);
+ }
+ else {
+ result = result || graph.getSelectionCells();
+ result = graph.getExportableCells(graph.model.getTopmostCells(result));
+
+ var cloneMap = new Object();
+ var lookup = graph.createCellLookup(result);
+ var clones = graph.cloneCells(result, null, cloneMap);
+
+ // Uses temporary model to force new IDs to be assigned
+ // to avoid having to carry over the mapping from object
+ // ID to cell ID to the paste operation
+ var model = new mxGraphModel();
+ var parent = model.getChildAt(model.getRoot(), 0);
+
+ for (var i = 0; i < clones.length; i++) {
+ model.add(parent, clones[i]);
+
+ // Checks for orphaned relative children and makes absolute
+ var state = graph.view.getState(result[i]);
+
+ if (state != null) {
+ var geo = graph.getCellGeometry(clones[i]);
+
+ if (geo != null && geo.relative && !model.isEdge(result[i]) &&
+ lookup[mxObjectIdentity.get(model.getParent(result[i]))] == null) {
+ geo.offset = null;
+ geo.relative = false;
+ geo.x = state.x / state.view.scale - state.view.translate.x;
+ geo.y = state.y / state.view.scale - state.view.translate.y;
+ }
+ }
+ }
+
+ graph.updateCustomLinks(graph.createCellMapping(cloneMap, lookup), clones);
+
+ mxClipboard.insertCount = 1;
+ mxClipboard.setCells(clones);
+ }
+
+ ui.updatePasteActionStates();
+
+ return result;
+ };
+
+ var mxClipboardPaste = mxClipboard.paste;
+ mxClipboard.paste = function (graph) {
+ var result = null;
+
+ if (graph.cellEditor.isContentEditing()) {
+ document.execCommand('paste', false, null);
+ }
+ else {
+ result = mxClipboardPaste.apply(this, arguments);
+ }
+
+ ui.updatePasteActionStates();
+
+ return result;
+ };
+
+ // Overrides cell editor to update paste action state
+ var cellEditorStartEditing = this.editor.graph.cellEditor.startEditing;
+
+ this.editor.graph.cellEditor.startEditing = function () {
+ cellEditorStartEditing.apply(this, arguments);
+ ui.updatePasteActionStates();
+ };
+
+ var cellEditorStopEditing = this.editor.graph.cellEditor.stopEditing;
+
+ this.editor.graph.cellEditor.stopEditing = function (cell, trigger) {
+ cellEditorStopEditing.apply(this, arguments);
+ ui.updatePasteActionStates();
+ };
+
+ this.updatePasteActionStates();
+};
+
+/**
+ * Delay between zoom steps when not using preview.
+ */
+EditorUi.prototype.lazyZoomDelay = 20;
+
+/**
+ * Delay before update of DOM when using preview.
+ */
+EditorUi.prototype.wheelZoomDelay = 500;
+
+/**
+ * Delay before update of DOM when using preview.
+ */
+EditorUi.prototype.buttonZoomDelay = 600;
+
+/**
+ * Initializes the infinite canvas.
+ */
+EditorUi.prototype.initCanvas = function () {
+ // Initial page layout view, scrollBuffer and timer-based scrolling
+ var graph = this.editor.graph;
+ graph.timerAutoScroll = true;
+
+ /**
+ * Returns the padding for pages in page view with scrollbars.
+ */
+ graph.getPagePadding = function () {
+ return new mxPoint(Math.max(0, Math.round((graph.container.offsetWidth - 34) / graph.view.scale)),
+ Math.max(0, Math.round((graph.container.offsetHeight - 34) / graph.view.scale)));
+ };
+
+ // Fits the number of background pages to the graph
+ graph.view.getBackgroundPageBounds = function () {
+ var layout = this.graph.getPageLayout();
+ var page = this.graph.getPageSize();
+
+ return new mxRectangle(this.scale * (this.translate.x + layout.x * page.width),
+ this.scale * (this.translate.y + layout.y * page.height),
+ this.scale * layout.width * page.width,
+ this.scale * layout.height * page.height);
+ };
+
+ graph.getPreferredPageSize = function (bounds, width, height) {
+ var pages = this.getPageLayout();
+ var size = this.getPageSize();
+
+ return new mxRectangle(0, 0, pages.width * size.width, pages.height * size.height);
+ };
+
+ // Scales pages/graph to fit available size
+ var resize = null;
+ var ui = this;
+
+ if (this.editor.isChromelessView()) {
+ resize = mxUtils.bind(this, function (autoscale, maxScale, cx, cy) {
+ if (graph.container != null && !graph.isViewer()) {
+ cx = (cx != null) ? cx : 0;
+ cy = (cy != null) ? cy : 0;
+
+ var bds = (graph.pageVisible) ?
+ graph.view.getBackgroundPageBounds() :
+ graph.getGraphBounds();
+ var scroll = mxUtils.hasScrollbars(graph.container);
+ var tr = graph.view.translate;
+ var s = graph.view.scale;
+
+ // Normalizes the bounds
+ var b = mxRectangle.fromRectangle(bds);
+ b.x = b.x / s - tr.x;
+ b.y = b.y / s - tr.y;
+ b.width /= s;
+ b.height /= s;
+
+ var st = graph.container.scrollTop;
+ var sl = graph.container.scrollLeft;
+ var sb = (document.documentMode >= 8) ? 20 : 14;
+
+ if (document.documentMode == 8 || document.documentMode == 9) {
+ sb += 3;
+ }
+
+ var cw = graph.container.offsetWidth - sb;
+ var ch = graph.container.offsetHeight - sb;
+
+ var ns = (autoscale) ? Math.max(0.3, Math.min(maxScale || 1, cw / b.width)) : s;
+ var dx = ((cw - ns * b.width) / 2) / ns;
+ var dy = (this.lightboxVerticalDivider == 0) ? 0 : ((ch - ns * b.height) / this.lightboxVerticalDivider) / ns;
+
+ if (scroll) {
+ dx = Math.max(dx, 0);
+ dy = Math.max(dy, 0);
+ }
+
+ if (scroll || bds.width < cw || bds.height < ch) {
+ graph.view.scaleAndTranslate(ns, Math.floor(dx - b.x), Math.floor(dy - b.y));
+ graph.container.scrollTop = st * ns / s;
+ graph.container.scrollLeft = sl * ns / s;
+ }
+ else if (cx != 0 || cy != 0) {
+ var t = graph.view.translate;
+ graph.view.setTranslate(Math.floor(t.x + cx / s), Math.floor(t.y + cy / s));
+ }
+ }
+ });
+
+ // Hack to make function available to subclassers
+ this.chromelessResize = resize;
+
+ // Hook for subclassers for override
+ this.chromelessWindowResize = mxUtils.bind(this, function () {
+ this.chromelessResize(false);
+ });
+
+ // Removable resize listener
+ var autoscaleResize = mxUtils.bind(this, function () {
+ this.chromelessWindowResize(false);
+ });
+
+ mxEvent.addListener(window, 'resize', autoscaleResize);
+
+ this.destroyFunctions.push(function () {
+ mxEvent.removeListener(window, 'resize', autoscaleResize);
+ });
+
+ this.editor.addListener('resetGraphView', mxUtils.bind(this, function () {
+ this.chromelessResize(true);
+ }));
+
+ this.actions.get('zoomIn').funct = mxUtils.bind(this, function (evt) {
+ graph.zoomIn();
+ this.chromelessResize(false);
+ });
+ this.actions.get('zoomOut').funct = mxUtils.bind(this, function (evt) {
+ graph.zoomOut();
+ this.chromelessResize(false);
+ });
+
+ // Creates toolbar for viewer - do not use CSS here
+ // as this may be used in a viewer that has no CSS
+ if (urlParams['toolbar'] != '0') {
+ var toolbarConfig = JSON.parse(decodeURIComponent(urlParams['toolbar-config'] || '{}'));
+
+ this.chromelessToolbar = document.createElement('div');
+ this.chromelessToolbar.style.position = 'fixed';
+ this.chromelessToolbar.style.overflow = 'hidden';
+ this.chromelessToolbar.style.boxSizing = 'border-box';
+ this.chromelessToolbar.style.whiteSpace = 'nowrap';
+ this.chromelessToolbar.style.padding = '10px 10px 8px 10px';
+ this.chromelessToolbar.style.left = (graph.isViewer()) ? '0' : '50%';
+
+ if (!mxClient.IS_IE && !mxClient.IS_IE11) {
+ this.chromelessToolbar.style.backgroundColor = '#000000';
+ }
+ else {
+ this.chromelessToolbar.style.backgroundColor = '#ffffff';
+ this.chromelessToolbar.style.border = '3px solid black';
+ }
+
+ mxUtils.setPrefixedStyle(this.chromelessToolbar.style, 'borderRadius', '16px');
+ mxUtils.setPrefixedStyle(this.chromelessToolbar.style, 'transition', 'opacity 600ms ease-in-out');
+
+ var updateChromelessToolbarPosition = mxUtils.bind(this, function () {
+ var css = mxUtils.getCurrentStyle(graph.container);
+
+ if (graph.isViewer()) {
+ this.chromelessToolbar.style.top = '0';
+ }
+ else {
+ this.chromelessToolbar.style.bottom = ((css != null) ? parseInt(css['margin-bottom'] || 0) : 0) +
+ ((this.tabContainer != null) ? (20 + parseInt(this.tabContainer.style.height)) : 20) + 'px';
+ }
+ });
+
+ this.editor.addListener('resetGraphView', updateChromelessToolbarPosition);
+ updateChromelessToolbarPosition();
+
+ var btnCount = 0;
+
+ var addButton = mxUtils.bind(this, function (fn, imgSrc, tip) {
+ btnCount++;
+
+ var a = document.createElement('span');
+ a.style.paddingLeft = '8px';
+ a.style.paddingRight = '8px';
+ a.style.cursor = 'pointer';
+ mxEvent.addListener(a, 'click', fn);
+
+ if (tip != null) {
+ a.setAttribute('title', tip);
+ }
+
+ var img = document.createElement('img');
+ img.setAttribute('border', '0');
+ img.setAttribute('src', imgSrc);
+ img.style.width = '36px';
+ img.style.filter = 'invert(100%)';
+
+ a.appendChild(img);
+ this.chromelessToolbar.appendChild(a);
+
+ return a;
+ });
+
+ if (toolbarConfig.backBtn != null) {
+ var backUrl = Graph.sanitizeLink(toolbarConfig.backBtn.url);
+
+ if (backUrl != null) {
+ addButton(mxUtils.bind(this, function (evt) {
+ window.location.href = backUrl;
+ mxEvent.consume(evt);
+ }), Editor.backImage, mxResources.get('back', null, 'Back'));
+ }
+ }
+
+ if (this.isPagesEnabled()) {
+ var prevButton = addButton(mxUtils.bind(this, function (evt) {
+ this.actions.get('previousPage').funct();
+ mxEvent.consume(evt);
+ }), Editor.previousImage, mxResources.get('previousPage'));
+
+ var pageInfo = document.createElement('div');
+ pageInfo.style.fontFamily = Editor.defaultHtmlFont;
+ pageInfo.style.display = 'inline-block';
+ pageInfo.style.verticalAlign = 'top';
+ pageInfo.style.fontWeight = 'bold';
+ pageInfo.style.marginTop = '8px';
+ pageInfo.style.fontSize = '14px';
+
+ if (!mxClient.IS_IE && !mxClient.IS_IE11) {
+ pageInfo.style.color = '#ffffff';
+ }
+ else {
+ pageInfo.style.color = '#000000';
+ }
+
+ this.chromelessToolbar.appendChild(pageInfo);
+
+ var nextButton = addButton(mxUtils.bind(this, function (evt) {
+ this.actions.get('nextPage').funct();
+ mxEvent.consume(evt);
+ }), Editor.nextImage, mxResources.get('nextPage'));
+
+ var updatePageInfo = mxUtils.bind(this, function () {
+ if (this.pages != null && this.pages.length > 1 && this.currentPage != null) {
+ pageInfo.innerText = '';
+ mxUtils.write(pageInfo, (mxUtils.indexOf(this.pages, this.currentPage) + 1) + ' / ' + this.pages.length);
+ }
+ });
+
+ prevButton.style.paddingLeft = '0px';
+ prevButton.style.paddingRight = '4px';
+ nextButton.style.paddingLeft = '4px';
+ nextButton.style.paddingRight = '0px';
+
+ var updatePageButtons = mxUtils.bind(this, function () {
+ if (this.pages != null && this.pages.length > 1 && this.currentPage != null) {
+ nextButton.style.display = '';
+ prevButton.style.display = '';
+ pageInfo.style.display = 'inline-block';
+ }
+ else {
+ nextButton.style.display = 'none';
+ prevButton.style.display = 'none';
+ pageInfo.style.display = 'none';
+ }
+
+ updatePageInfo();
+ });
+
+ this.editor.addListener('resetGraphView', updatePageButtons);
+ this.editor.addListener('pageSelected', updatePageInfo);
+ }
+
+ addButton(mxUtils.bind(this, function (evt) {
+ this.actions.get('zoomOut').funct();
+ mxEvent.consume(evt);
+ }), Editor.zoomOutImage, mxResources.get('zoomOut') + ' (Alt+Mousewheel)');
+
+ addButton(mxUtils.bind(this, function (evt) {
+ this.actions.get('zoomIn').funct();
+ mxEvent.consume(evt);
+ }), Editor.zoomInImage, mxResources.get('zoomIn') + ' (Alt+Mousewheel)');
+
+ addButton(mxUtils.bind(this, function (evt) {
+ if (graph.isLightboxView()) {
+ if (graph.view.scale == 1) {
+ this.lightboxFit();
+ }
+ else {
+ graph.zoomTo(1);
+ }
+
+ this.chromelessResize(false);
+ }
+ else {
+ this.chromelessResize(true);
+ }
+
+ mxEvent.consume(evt);
+ }), Editor.zoomFitImage, mxResources.get('fit'));
+
+ // Changes toolbar opacity on hover
+ var fadeThread = null;
+ var fadeThread2 = null;
+
+ var fadeOut = mxUtils.bind(this, function (delay) {
+ if (fadeThread != null) {
+ window.clearTimeout(fadeThread);
+ fadeThread = null;
+ }
+
+ if (fadeThread2 != null) {
+ window.clearTimeout(fadeThread2);
+ fadeThread2 = null;
+ }
+
+ fadeThread = window.setTimeout(mxUtils.bind(this, function () {
+ mxUtils.setOpacity(this.chromelessToolbar, 0);
+ fadeThread = null;
+
+ fadeThread2 = window.setTimeout(mxUtils.bind(this, function () {
+ this.chromelessToolbar.style.display = 'none';
+ fadeThread2 = null;
+ }), 600);
+ }), delay || 200);
+ });
+
+ var fadeIn = mxUtils.bind(this, function (opacity) {
+ if (fadeThread != null) {
+ window.clearTimeout(fadeThread);
+ fadeThread = null;
+ }
+
+ if (fadeThread2 != null) {
+ window.clearTimeout(fadeThread2);
+ fadeThread2 = null;
+ }
+
+ this.chromelessToolbar.style.display = '';
+ mxUtils.setOpacity(this.chromelessToolbar, opacity || 30);
+ });
+
+ if (urlParams['layers'] == '1') {
+ this.layersDialog = null;
+
+ var layersButton = addButton(mxUtils.bind(this, function (evt) {
+ if (this.layersDialog != null) {
+ this.layersDialog.parentNode.removeChild(this.layersDialog);
+ this.layersDialog = null;
+ }
+ else {
+ this.layersDialog = graph.createLayersDialog(null, true);
+
+ mxEvent.addListener(this.layersDialog, 'mouseleave', mxUtils.bind(this, function () {
+ this.layersDialog.parentNode.removeChild(this.layersDialog);
+ this.layersDialog = null;
+ }));
+
+ var r = layersButton.getBoundingClientRect();
+
+ mxUtils.setPrefixedStyle(this.layersDialog.style, 'borderRadius', '5px');
+ this.layersDialog.style.position = 'fixed';
+ this.layersDialog.style.fontFamily = Editor.defaultHtmlFont;
+ this.layersDialog.style.width = '160px';
+ this.layersDialog.style.padding = '4px 2px 4px 2px';
+ this.layersDialog.style.left = r.left + 'px';
+ this.layersDialog.style.bottom = parseInt(this.chromelessToolbar.style.bottom) +
+ this.chromelessToolbar.offsetHeight + 4 + 'px';
+
+ if (!mxClient.IS_IE && !mxClient.IS_IE11) {
+ this.layersDialog.style.backgroundColor = '#000000';
+ this.layersDialog.style.color = '#ffffff';
+ mxUtils.setOpacity(this.layersDialog, 80);
+ }
+ else {
+ this.layersDialog.style.backgroundColor = '#ffffff';
+ this.layersDialog.style.border = '2px solid black';
+ this.layersDialog.style.color = '#000000';
+ }
+
+ // Puts the dialog on top of the container z-index
+ var style = mxUtils.getCurrentStyle(this.editor.graph.container);
+ this.layersDialog.style.zIndex = style.zIndex;
+
+ document.body.appendChild(this.layersDialog);
+ this.editor.fireEvent(new mxEventObject('layersDialogShown'));
+ }
+
+ mxEvent.consume(evt);
+ }), Editor.layersImage, mxResources.get('layers'));
+
+ // Shows/hides layers button depending on content
+ var model = graph.getModel();
+
+ model.addListener(mxEvent.CHANGE, function () {
+ layersButton.style.display = (model.getChildCount(model.root) > 1) ? '' : 'none';
+ });
+ }
+
+ if (urlParams['openInSameWin'] != '1' || navigator.standalone) {
+ this.addChromelessToolbarItems(addButton);
+ }
+
+ if (this.editor.editButtonLink != null || this.editor.editButtonFunc != null) {
+ addButton(mxUtils.bind(this, function (evt) {
+ if (this.editor.editButtonFunc != null) {
+ this.editor.editButtonFunc();
+ }
+ else if (this.editor.editButtonLink == '_blank') {
+ this.editor.editAsNew(this.getEditBlankXml());
+ }
+ else {
+ graph.openLink(this.editor.editButtonLink, 'editWindow');
+ }
+
+ mxEvent.consume(evt);
+ }), Editor.editImage, mxResources.get('edit'));
+ }
+
+ if (this.lightboxToolbarActions != null) {
+ for (var i = 0; i < this.lightboxToolbarActions.length; i++) {
+ var lbAction = this.lightboxToolbarActions[i];
+ lbAction.elem = addButton(lbAction.fn, lbAction.icon, lbAction.tooltip);
+ }
+ }
+
+ if (toolbarConfig.refreshBtn != null) {
+ var refreshUrl = (toolbarConfig.refreshBtn.url == null) ? null :
+ Graph.sanitizeLink(toolbarConfig.refreshBtn.url);
+
+ addButton(mxUtils.bind(this, function (evt) {
+ if (refreshUrl != null) {
+ window.location.href = refreshUrl;
+ }
+ else {
+ window.location.reload();
+ }
+
+ mxEvent.consume(evt);
+ }), Editor.refreshImage, mxResources.get('refresh', null, 'Refresh'));
+ }
+
+ if (toolbarConfig.fullscreenBtn != null && window.self !== window.top) {
+ addButton(mxUtils.bind(this, function (evt) {
+ if (toolbarConfig.fullscreenBtn.url) {
+ graph.openLink(toolbarConfig.fullscreenBtn.url);
+ }
+ else {
+ graph.openLink(window.location.href);
+ }
+
+ mxEvent.consume(evt);
+ }), Editor.fullscreenImage, mxResources.get('openInNewWindow', null, 'Open in New Window'));
+ }
+
+ if (!toolbarConfig.noCloseBtn && ((toolbarConfig.closeBtn && window.self === window.top) ||
+ (graph.lightbox && (urlParams['close'] == '1' || this.container != document.body)))) {
+ addButton(mxUtils.bind(this, function (evt) {
+ if (urlParams['close'] == '1' || toolbarConfig.closeBtn) {
+ window.close();
+ }
+ else {
+ this.destroy();
+ mxEvent.consume(evt);
+ }
+ }), Editor.closeImage, mxResources.get('close') + ' (Escape)');
+ }
+
+ // Initial state invisible
+ this.chromelessToolbar.style.display = 'none';
+
+ if (!graph.isViewer()) {
+ mxUtils.setPrefixedStyle(this.chromelessToolbar.style, 'transform', 'translate(-50%,0)');
+ }
+
+ graph.container.appendChild(this.chromelessToolbar);
+
+ mxEvent.addListener(graph.container, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', mxUtils.bind(this, function (evt) {
+ if (!mxEvent.isTouchEvent(evt)) {
+ if (!mxEvent.isShiftDown(evt)) {
+ fadeIn(30);
+ }
+
+ fadeOut();
+ }
+ }));
+
+ mxEvent.addListener(this.chromelessToolbar, (mxClient.IS_POINTER) ? 'pointermove' : 'mousemove', function (evt) {
+ mxEvent.consume(evt);
+ });
+
+ mxEvent.addListener(this.chromelessToolbar, 'mouseenter', mxUtils.bind(this, function (evt) {
+ graph.tooltipHandler.resetTimer();
+ graph.tooltipHandler.hideTooltip();
+
+ if (!mxEvent.isShiftDown(evt)) {
+ fadeIn(100);
+ }
+ else {
+ fadeOut();
+ }
+ }));
+
+ mxEvent.addListener(this.chromelessToolbar, 'mousemove', mxUtils.bind(this, function (evt) {
+ if (!mxEvent.isShiftDown(evt)) {
+ fadeIn(100);
+ }
+ else {
+ fadeOut();
+ }
+
+ mxEvent.consume(evt);
+ }));
+
+ mxEvent.addListener(this.chromelessToolbar, 'mouseleave', mxUtils.bind(this, function (evt) {
+ if (!mxEvent.isTouchEvent(evt)) {
+ fadeIn(30);
+ }
+ }));
+
+ // Shows/hides toolbar for touch devices
+ var tol = graph.getTolerance();
+
+ graph.addMouseListener(
+ {
+ startX: 0,
+ startY: 0,
+ scrollLeft: 0,
+ scrollTop: 0,
+ mouseDown: function (sender, me) {
+ this.startX = me.getGraphX();
+ this.startY = me.getGraphY();
+ this.scrollLeft = graph.container.scrollLeft;
+ this.scrollTop = graph.container.scrollTop;
+ },
+ mouseMove: function (sender, me) { },
+ mouseUp: function (sender, me) {
+ if (mxEvent.isTouchEvent(me.getEvent())) {
+ if ((Math.abs(this.scrollLeft - graph.container.scrollLeft) < tol &&
+ Math.abs(this.scrollTop - graph.container.scrollTop) < tol) &&
+ (Math.abs(this.startX - me.getGraphX()) < tol &&
+ Math.abs(this.startY - me.getGraphY()) < tol)) {
+ if (parseFloat(ui.chromelessToolbar.style.opacity || 0) > 0) {
+ fadeOut();
+ }
+ else {
+ fadeIn(30);
+ }
+ }
+ }
+ }
+ });
+ } // end if toolbar
+
+ // Installs handling of highlight and handling links to relative links and anchors
+ if (!this.editor.editable) {
+ this.addChromelessClickHandler();
+ }
+ }
+ else if (this.editor.extendCanvas) {
+ /**
+ * Guesses autoTranslate to avoid another repaint (see below).
+ * Works if only the scale of the graph changes or if pages
+ * are visible and the visible pages do not change. Uses
+ * geometries to guess the bounding box of the graph.
+ */
+ var graphViewValidate = graph.view.validate;
+ var zero = new mxPoint();
+ var lastPage = null;
+
+ graph.view.validate = function () {
+ if (graph.container != null &&
+ mxUtils.hasScrollbars(graph.container)) {
+ // Sets initial state after page changes
+ if (ui.currentPage != null &&
+ lastPage != ui.currentPage) {
+ lastPage = ui.currentPage;
+
+ // Sets initial translate based on geometries
+ // to avoid revalidation in sizeDidChange
+ var bbox = graph.getBoundingBoxFromGeometry(
+ graph.model.getCells(), true);
+
+ // Handles blank diagrams
+ if (bbox == null) {
+ bbox = new mxRectangle(
+ graph.view.translate.x * graph.view.scale,
+ graph.view.translate.y * graph.view.scale);
+ }
+
+ var pageLayout = graph.getPageLayout(bbox, zero, 1);
+ var tr = graph.getDefaultTranslate(pageLayout);
+ this.x0 = pageLayout.x;
+ this.y0 = pageLayout.y;
+
+ if (tr.x != this.translate.x ||
+ tr.y != this.translate.y) {
+ this.invalidate();
+ this.translate.x = tr.x;
+ this.translate.y = tr.y;
+ }
+ }
+
+ var pad = graph.getPagePadding();
+ var size = graph.getPageSize();
+ var tx = pad.x - (this.x0 || 0) * size.width;
+ var ty = pad.y - (this.y0 || 0) * size.height;
+
+ if (this.translate.x != tx || this.translate.y != ty) {
+ this.invalidate();
+ this.translate.x = tx
+ this.translate.y = ty
+ }
+ }
+
+ graphViewValidate.apply(this, arguments);
+ };
+
+ if (!graph.isViewer()) {
+ var graphSizeDidChange = graph.sizeDidChange;
+
+ graph.sizeDidChange = function () {
+ if (this.container != null &&
+ mxUtils.hasScrollbars(this.container)) {
+ this.updateMinimumSize();
+
+ if (!this.autoTranslate) {
+ var pageLayout = this.getPageLayout();
+ var tr = this.getDefaultTranslate(pageLayout);
+ var tx = this.view.translate.x;
+ var ty = this.view.translate.y;
+
+ if (tr.x != tx || tr.y != ty) {
+ this.view.x0 = pageLayout.x;
+ this.view.y0 = pageLayout.y;
+ this.autoTranslate = true;
+
+ // Requires full revalidation
+ this.view.setTranslate(tr.x, tr.y);
+ this.container.scrollLeft += Math.round((tr.x - tx) * this.view.scale);
+ this.container.scrollTop += Math.round((tr.y - ty) * this.view.scale);
+ this.autoTranslate = false;
+
+ return;
+ }
+ }
+
+ graphSizeDidChange.apply(this, arguments);
+ }
+ else {
+ // Fires event but does not invoke superclass
+ this.fireEvent(new mxEventObject(mxEvent.SIZE,
+ 'bounds', this.getGraphBounds()));
+ }
+ };
+ }
+ }
+
+ // Accumulates the zoom factor while the rendering is taking place
+ // so that not the complete sequence of zoom steps must be painted
+ var bgGroup = graph.view.getBackgroundPane();
+ var mainGroup = graph.view.getDrawPane();
+ graph.cumulativeZoomFactor = 1;
+ var updateZoomTimeout = null;
+ var cursorPosition = null;
+ var scrollPosition = null;
+ var forcedZoom = null;
+ var filter = null;
+ var mult = 20;
+
+ var scheduleZoom = function (delay) {
+ if (updateZoomTimeout != null) {
+ window.clearTimeout(updateZoomTimeout);
+ }
+
+ if (delay >= 0) {
+ window.setTimeout(function () {
+ if (!graph.isMouseDown || forcedZoom) {
+ updateZoomTimeout = window.setTimeout(mxUtils.bind(this, function () {
+ if (graph.isFastZoomEnabled()) {
+ // Transforms background page
+ if (graph.view.backgroundPageShape != null && graph.view.backgroundPageShape.node != null) {
+ mxUtils.setPrefixedStyle(graph.view.backgroundPageShape.node.style, 'transform-origin', null);
+ mxUtils.setPrefixedStyle(graph.view.backgroundPageShape.node.style, 'transform', null);
+ }
+
+ // Transforms graph and background image
+ mainGroup.style.transformOrigin = '';
+ bgGroup.style.transformOrigin = '';
+
+ // Workaround for no reset of transform in Safari
+ if (mxClient.IS_SF) {
+ mainGroup.style.transform = 'scale(1)';
+ bgGroup.style.transform = 'scale(1)';
+
+ window.setTimeout(function () {
+ mainGroup.style.transform = '';
+ bgGroup.style.transform = '';
+ }, 0)
+ }
+ else {
+ mainGroup.style.transform = '';
+ bgGroup.style.transform = '';
+ }
+
+ // Shows interactive elements
+ graph.view.getDecoratorPane().style.opacity = '';
+ graph.view.getOverlayPane().style.opacity = '';
+ }
+
+ var sp = new mxPoint(graph.container.scrollLeft, graph.container.scrollTop);
+ var offset = mxUtils.getOffset(graph.container);
+ var prev = graph.view.scale;
+ var dx = 0;
+ var dy = 0;
+
+ if (cursorPosition != null) {
+ dx = graph.container.offsetWidth / 2 - cursorPosition.x + offset.x;
+ dy = graph.container.offsetHeight / 2 - cursorPosition.y + offset.y;
+ }
+
+ graph.zoom(graph.cumulativeZoomFactor, null,
+ graph.isFastZoomEnabled() ? mult : null);
+ var s = graph.view.scale;
+
+ if (s != prev) {
+ if (scrollPosition != null) {
+ dx += sp.x - scrollPosition.x;
+ dy += sp.y - scrollPosition.y;
+ }
+
+ if (resize != null) {
+ ui.chromelessResize(false, null, dx * (graph.cumulativeZoomFactor - 1),
+ dy * (graph.cumulativeZoomFactor - 1));
+ }
+
+ if (mxUtils.hasScrollbars(graph.container) && (dx != 0 || dy != 0)) {
+ graph.container.scrollLeft -= dx * (graph.cumulativeZoomFactor - 1);
+ graph.container.scrollTop -= dy * (graph.cumulativeZoomFactor - 1);
+ }
+ }
+
+ if (filter != null) {
+ mainGroup.setAttribute('filter', filter);
+ }
+
+ graph.cumulativeZoomFactor = 1;
+ updateZoomTimeout = null;
+ scrollPosition = null;
+ cursorPosition = null;
+ forcedZoom = null;
+ filter = null;
+ }), (delay != null) ? delay : ((graph.isFastZoomEnabled()) ? ui.wheelZoomDelay : ui.lazyZoomDelay));
+ }
+ }, 0);
+ }
+ };
+
+ graph.lazyZoom = function (zoomIn, ignoreCursorPosition, delay, factor) {
+ factor = (factor != null) ? factor : this.zoomFactor;
+
+ // TODO: Fix ignored cursor position if scrollbars are disabled
+ ignoreCursorPosition = ignoreCursorPosition || !graph.scrollbars;
+
+ if (ignoreCursorPosition) {
+ cursorPosition = new mxPoint(
+ graph.container.offsetLeft + graph.container.clientWidth / 2,
+ graph.container.offsetTop + graph.container.clientHeight / 2);
+ }
+
+ // Switches to 5% zoom steps below 15%
+ if (zoomIn) {
+ if (this.view.scale * this.cumulativeZoomFactor <= 0.15) {
+ this.cumulativeZoomFactor *= (this.view.scale + 0.05) / this.view.scale;
+ }
+ else {
+ this.cumulativeZoomFactor *= factor;
+ this.cumulativeZoomFactor = Math.round(this.view.scale * this.cumulativeZoomFactor * 100) / 100 / this.view.scale;
+ }
+ }
+ else {
+ if (this.view.scale * this.cumulativeZoomFactor <= 0.15) {
+ this.cumulativeZoomFactor *= (this.view.scale - 0.05) / this.view.scale;
+ }
+ else {
+ this.cumulativeZoomFactor /= factor;
+ this.cumulativeZoomFactor = Math.round(this.view.scale * this.cumulativeZoomFactor * 100) / 100 / this.view.scale;
+ }
+ }
+
+ this.cumulativeZoomFactor = Math.max(0.05, Math.min(this.view.scale * this.cumulativeZoomFactor, 160)) / this.view.scale;
+
+ if (graph.isFastZoomEnabled()) {
+ if (filter == null && mainGroup.getAttribute('filter') != '') {
+ filter = mainGroup.getAttribute('filter');
+ mainGroup.removeAttribute('filter');
+ }
+
+ scrollPosition = new mxPoint(graph.container.scrollLeft, graph.container.scrollTop);
+
+ // Applies final rounding to preview
+ var f = Math.round((Math.round(this.view.scale * this.cumulativeZoomFactor *
+ 100) / 100) * mult) / (mult * this.view.scale);
+
+ var cx = (ignoreCursorPosition || cursorPosition == null) ?
+ graph.container.scrollLeft + graph.container.clientWidth / 2 :
+ cursorPosition.x + graph.container.scrollLeft - graph.container.offsetLeft;
+ var cy = (ignoreCursorPosition || cursorPosition == null) ?
+ graph.container.scrollTop + graph.container.clientHeight / 2 :
+ cursorPosition.y + graph.container.scrollTop - graph.container.offsetTop;
+ mainGroup.style.transformOrigin = cx + 'px ' + cy + 'px';
+ mainGroup.style.transform = 'scale(' + f + ')';
+ bgGroup.style.transformOrigin = cx + 'px ' + cy + 'px';
+ bgGroup.style.transform = 'scale(' + f + ')';
+
+ if (graph.view.backgroundPageShape != null && graph.view.backgroundPageShape.node != null) {
+ var page = graph.view.backgroundPageShape.node;
+
+ mxUtils.setPrefixedStyle(page.style, 'transform-origin',
+ ((ignoreCursorPosition || cursorPosition == null) ?
+ ((graph.container.clientWidth / 2 + graph.container.scrollLeft -
+ page.offsetLeft) + 'px') : ((cursorPosition.x + graph.container.scrollLeft -
+ page.offsetLeft - graph.container.offsetLeft) + 'px')) + ' ' +
+ ((ignoreCursorPosition || cursorPosition == null) ?
+ ((graph.container.clientHeight / 2 + graph.container.scrollTop -
+ page.offsetTop) + 'px') : ((cursorPosition.y + graph.container.scrollTop -
+ page.offsetTop - graph.container.offsetTop) + 'px')));
+ mxUtils.setPrefixedStyle(page.style, 'transform', 'scale(' + f + ')');
+ }
+ else {
+ graph.view.validateBackgroundStyles(f, cx, cy);
+ }
+
+ graph.view.getDecoratorPane().style.opacity = '0';
+ graph.view.getOverlayPane().style.opacity = '0';
+
+ if (ui.hoverIcons != null) {
+ ui.hoverIcons.reset();
+ }
+
+ graph.fireEvent(new mxEventObject('zoomPreview', 'factor', f));
+ }
+
+ scheduleZoom(graph.isFastZoomEnabled() ? delay : 0);
+ };
+
+ // Holds back repaint until after mouse gestures
+ mxEvent.addGestureListeners(graph.container, function (evt) {
+ if (updateZoomTimeout != null) {
+ window.clearTimeout(updateZoomTimeout);
+ }
+ }, null, function (evt) {
+ if (graph.cumulativeZoomFactor != 1) {
+ scheduleZoom(0);
+ }
+ });
+
+ // Holds back repaint until scroll ends
+ mxEvent.addListener(graph.container, 'scroll', function (evt) {
+ if (updateZoomTimeout != null && !graph.isMouseDown && graph.cumulativeZoomFactor != 1) {
+ scheduleZoom(0);
+ }
+ });
+
+ mxEvent.addMouseWheelListener(mxUtils.bind(this, function (evt, up, force, cx, cy) {
+ graph.fireEvent(new mxEventObject('wheel'));
+
+ if (this.dialogs == null || this.dialogs.length == 0) {
+ // Scrolls with scrollbars turned off
+ if (!graph.scrollbars && !force && graph.isScrollWheelEvent(evt)) {
+ var t = graph.view.getTranslate();
+ var step = 40 / graph.view.scale;
+
+ if (!mxEvent.isShiftDown(evt)) {
+ graph.view.setTranslate(t.x, t.y + ((up) ? step : -step));
+ }
+ else {
+ graph.view.setTranslate(t.x + ((up) ? -step : step), t.y);
+ }
+ }
+ else if (force || graph.isZoomWheelEvent(evt)) {
+ var source = mxEvent.getSource(evt);
+
+ while (source != null) {
+ if (source == graph.container) {
+ graph.tooltipHandler.hideTooltip();
+ cursorPosition = (cx != null && cy != null) ? new mxPoint(cx, cy) :
+ new mxPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ forcedZoom = force;
+ var factor = graph.zoomFactor;
+ var delay = null;
+
+ // Slower zoom for pinch gesture on trackpad with max delta to
+ // filter out mouse wheel events in Brave browser for Windows
+ if (evt.ctrlKey && evt.deltaY != null && Math.abs(evt.deltaY) < 40 &&
+ Math.round(evt.deltaY) != evt.deltaY) {
+ factor = 1 + (Math.abs(evt.deltaY) / 20) * (factor - 1);
+ }
+ // Slower zoom for pinch gesture on touch screens
+ else if (evt.movementY != null && evt.type == 'pointermove') {
+ factor = 1 + (Math.max(1, Math.abs(evt.movementY)) / 20) * (factor - 1);
+ delay = -1;
+ }
+
+ graph.lazyZoom(up, null, delay, factor);
+ mxEvent.consume(evt);
+
+ return false;
+ }
+
+ source = source.parentNode;
+ }
+ }
+ }
+ }), graph.container);
+
+ // Uses fast zoom for pinch gestures on iOS
+ graph.panningHandler.zoomGraph = function (evt) {
+ graph.cumulativeZoomFactor = evt.scale;
+ graph.lazyZoom(evt.scale > 0, true);
+ mxEvent.consume(evt);
+ };
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.addChromelessToolbarItems = function (addButton) {
+ addButton(mxUtils.bind(this, function (evt) {
+ this.actions.get('print').funct();
+ mxEvent.consume(evt);
+ }), Editor.printImage, mxResources.get('print'));
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.isPagesEnabled = function () {
+ return this.editor.editable || urlParams['hide-pages'] != '1';
+};
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+EditorUi.prototype.createTemporaryGraph = function (stylesheet) {
+ return Graph.createOffscreenGraph(stylesheet);
+};
+
+/**
+ *
+ */
+EditorUi.prototype.addChromelessClickHandler = function () {
+ var hl = urlParams['highlight'];
+
+ // Adds leading # for highlight color code
+ if (hl != null && hl.length > 0) {
+ hl = '#' + hl;
+ }
+
+ this.editor.graph.addClickHandler(hl);
+};
+
+/**
+ *
+ */
+EditorUi.prototype.toggleFormatPanel = function (visible) {
+ visible = (visible != null) ? visible : this.formatWidth == 0;
+
+ if (this.format != null) {
+ this.formatWidth = (visible) ? 240 : 0;
+ this.formatContainer.style.width = this.formatWidth + 'px';
+ this.refresh();
+ this.format.refresh();
+ this.fireEvent(new mxEventObject('formatWidthChanged'));
+ }
+};
+
+/**
+ *
+ */
+EditorUi.prototype.isFormatPanelVisible = function () {
+ return this.formatWidth > 0;
+};
+
+/**
+ * Adds support for placeholders in labels.
+ */
+EditorUi.prototype.lightboxFit = function (maxHeight) {
+ if (this.isDiagramEmpty()) {
+ this.editor.graph.view.setScale(1);
+ }
+ else {
+ var p = urlParams['border'];
+ var border = 60;
+
+ if (p != null) {
+ border = parseInt(p);
+ }
+
+ // LATER: Use initial graph bounds to avoid rounding errors
+ this.editor.graph.maxFitScale = this.lightboxMaxFitScale;
+ this.editor.graph.fit(border, null, null, null, null, null, maxHeight);
+ this.editor.graph.maxFitScale = null;
+ }
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.isDiagramEmpty = function () {
+ var model = this.editor.graph.getModel();
+
+ return model.getChildCount(model.root) == 1 && model.getChildCount(model.getChildAt(model.root, 0)) == 0;
+};
+
+/**
+ * Hook for allowing selection and context menu for certain events.
+ */
+EditorUi.prototype.isSelectionAllowed = function (evt) {
+ return mxEvent.getSource(evt).nodeName == 'SELECT' || (mxEvent.getSource(evt).nodeName == 'INPUT' &&
+ mxUtils.isAncestorNode(this.formatContainer, mxEvent.getSource(evt)));
+};
+
+/**
+ * Installs dialog if browser window is closed without saving
+ * This must be disabled during save and image export.
+ */
+EditorUi.prototype.addBeforeUnloadListener = function () {
+ // Installs dialog if browser window is closed without saving
+ // This must be disabled during save and image export
+ window.onbeforeunload = mxUtils.bind(this, function () {
+ if (!this.editor.isChromelessView()) {
+ return this.onBeforeUnload();
+ }
+ });
+};
+
+/**
+ * Sets the onbeforeunload for the application
+ */
+EditorUi.prototype.onBeforeUnload = function () {
+ if (this.editor.modified) {
+ return mxResources.get('allChangesLost');
+ }
+};
+
+/**
+ * Opens the current diagram via the window.opener if one exists.
+ */
+EditorUi.prototype.open = function () {
+ // Cross-domain window access is not allowed in FF, so if we
+ // were opened from another domain then this will fail.
+ try {
+ if (window.opener != null && window.opener.openFile != null) {
+ window.opener.openFile.setConsumer(mxUtils.bind(this, function (xml, filename) {
+ try {
+ var doc = mxUtils.parseXml(xml);
+ this.editor.setGraphXml(doc.documentElement);
+ this.editor.setModified(false);
+ this.editor.undoManager.clear();
+
+ if (filename != null) {
+ this.editor.setFilename(filename);
+ this.updateDocumentTitle();
+ }
+
+ return;
+ }
+ catch (e) {
+ mxUtils.alert(mxResources.get('invalidOrMissingFile') + ': ' + e.message);
+ }
+ }));
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+
+ // Fires as the last step if no file was loaded
+ this.editor.graph.view.validate();
+
+ // Required only in special cases where an initial file is opened
+ // and the minimumGraphSize changes and CSS must be updated.
+ this.editor.graph.sizeDidChange();
+ this.editor.fireEvent(new mxEventObject('resetGraphView'));
+};
+
+/**
+ * Shows the given popup menu.
+ */
+EditorUi.prototype.showPopupMenu = function (fn, x, y, evt) {
+ this.editor.graph.popupMenuHandler.hideMenu();
+
+ var menu = new mxPopupMenu(fn);
+ menu.div.className += ' geMenubarMenu';
+ menu.smartSeparators = true;
+ menu.showDisabled = true;
+ menu.autoExpand = true;
+
+ // Disables autoexpand and destroys menu when hidden
+ menu.hideMenu = mxUtils.bind(this, function () {
+ mxPopupMenu.prototype.hideMenu.apply(menu, arguments);
+ menu.destroy();
+ });
+
+ menu.popup(x, y, null, evt);
+
+ // Allows hiding by clicking on document
+ this.setCurrentMenu(menu);
+};
+
+/**
+ * Sets the current menu and element.
+ */
+EditorUi.prototype.setCurrentMenu = function (menu, elt) {
+ this.currentMenuElt = elt;
+ this.currentMenu = menu;
+ this.hideShapePicker();
+};
+
+/**
+ * Resets the current menu and element.
+ */
+EditorUi.prototype.resetCurrentMenu = function () {
+ this.currentMenuElt = null;
+ this.currentMenu = null;
+};
+
+/**
+ * Hides and destroys the current menu.
+ */
+EditorUi.prototype.hideCurrentMenu = function () {
+ if (this.currentMenu != null) {
+ this.currentMenu.hideMenu();
+ this.resetCurrentMenu();
+ }
+};
+
+/**
+ * Updates the document title.
+ */
+EditorUi.prototype.updateDocumentTitle = function () {
+ var title = this.editor.getOrCreateFilename();
+
+ if (this.editor.appName != null) {
+ title += ' - ' + this.editor.appName;
+ }
+
+ document.title = title;
+};
+
+/**
+ * Updates the document title.
+ */
+EditorUi.prototype.createHoverIcons = function () {
+ return new HoverIcons(this.editor.graph);
+};
+
+/**
+ * Returns the URL for a copy of this editor with no state.
+ */
+EditorUi.prototype.redo = function () {
+ try {
+ var graph = this.editor.graph;
+
+ if (graph.isEditing()) {
+ document.execCommand('redo', false, null);
+ }
+ else {
+ this.editor.undoManager.redo();
+ }
+ }
+ catch (e) {
+ // ignore all errors
+ }
+};
+
+/**
+ * Returns the URL for a copy of this editor with no state.
+ */
+EditorUi.prototype.undo = function () {
+ try {
+ var graph = this.editor.graph;
+
+ if (graph.isEditing()) {
+ // Stops editing and executes undo on graph if native undo
+ // does not affect current editing value
+ var value = graph.cellEditor.textarea.innerHTML;
+ document.execCommand('undo', false, null);
+
+ if (value == graph.cellEditor.textarea.innerHTML) {
+ graph.stopEditing(true);
+ this.editor.undoManager.undo();
+ }
+ }
+ else {
+ this.editor.undoManager.undo();
+ }
+ }
+ catch (e) {
+ // ignore all errors
+ }
+};
+
+/**
+ * Returns the URL for a copy of this editor with no state.
+ */
+EditorUi.prototype.canRedo = function () {
+ return this.editor.graph.isEditing() || this.editor.undoManager.canRedo();
+};
+
+/**
+ * Returns the URL for a copy of this editor with no state.
+ */
+EditorUi.prototype.canUndo = function () {
+ return this.editor.graph.isEditing() || this.editor.undoManager.canUndo();
+};
+
+/**
+ *
+ */
+EditorUi.prototype.getEditBlankXml = function () {
+ return mxUtils.getXml(this.editor.getGraphXml());
+};
+
+/**
+ * Returns the URL for a copy of this editor with no state.
+ */
+EditorUi.prototype.getUrl = function (pathname) {
+ var href = (pathname != null) ? pathname : window.location.pathname;
+ var parms = (href.indexOf('?') > 0) ? 1 : 0;
+
+ // Removes template URL parameter for new blank diagram
+ for (var key in urlParams) {
+ if (parms == 0) {
+ href += '?';
+ }
+ else {
+ href += '&';
+ }
+
+ href += key + '=' + urlParams[key];
+ parms++;
+ }
+
+ return href;
+};
+
+/**
+ * Specifies if the graph has scrollbars.
+ */
+EditorUi.prototype.setScrollbars = function (value) {
+ var graph = this.editor.graph;
+ var prev = graph.container.style.overflow;
+ graph.scrollbars = value;
+ this.editor.updateGraphComponents();
+
+ if (prev != graph.container.style.overflow) {
+ graph.container.scrollTop = 0;
+ graph.container.scrollLeft = 0;
+ graph.view.scaleAndTranslate(1, 0, 0);
+ this.resetScrollbars();
+ }
+
+ this.fireEvent(new mxEventObject('scrollbarsChanged'));
+};
+
+/**
+ * Function: fitDiagramToWindow
+ *
+ * Zooms the diagram to fit into the window.
+ */
+EditorUi.prototype.fitDiagramToWindow = function () {
+ var graph = this.editor.graph;
+ var bounds = (graph.isSelectionEmpty()) ?
+ mxRectangle.fromRectangle(graph.getGraphBounds()) :
+ graph.getBoundingBox(graph.getSelectionCells())
+ var t = graph.view.translate;
+ var s = graph.view.scale;
+
+ bounds.x = bounds.x / s - t.x;
+ bounds.y = bounds.y / s - t.y;
+ bounds.width /= s;
+ bounds.height /= s;
+
+ if (graph.backgroundImage != null) {
+ bounds.add(new mxRectangle(0, 0,
+ graph.backgroundImage.width,
+ graph.backgroundImage.height));
+ }
+
+ if (bounds.width == 0 || bounds.height == 0) {
+ graph.zoomTo(1);
+ this.resetScrollbars();
+ }
+ else {
+ var b = Editor.fitWindowBorders;
+
+ if (b != null) {
+ bounds.x -= b.x;
+ bounds.y -= b.y;
+ bounds.width += b.width + b.x;
+ bounds.height += b.height + b.y;
+ }
+
+ graph.fitWindow(bounds);
+ }
+};
+
+/**
+ * Returns true if the graph has scrollbars.
+ */
+EditorUi.prototype.hasScrollbars = function () {
+ return this.editor.graph.scrollbars;
+};
+
+/**
+ * Resets the state of the scrollbars.
+ */
+EditorUi.prototype.resetScrollbars = function () {
+ var graph = this.editor.graph;
+ var c = graph.container;
+
+ if (!this.editor.extendCanvas) {
+ c.scrollTop = 0;
+ c.scrollLeft = 0;
+
+ if (!mxUtils.hasScrollbars(c)) {
+ graph.view.setTranslate(0, 0);
+ }
+ }
+ else if (!this.editor.isChromelessView()) {
+ if (mxUtils.hasScrollbars(c)) {
+ if (graph.pageVisible) {
+ var pad = graph.getPagePadding();
+ c.scrollTop = Math.floor(pad.y - this.editor.initialTopSpacing) - 1;
+ c.scrollLeft = Math.floor(Math.min(pad.x,
+ (c.scrollWidth - c.clientWidth) / 2)) - 1;
+
+ // Scrolls graph to visible area
+ var bounds = graph.getGraphBounds();
+
+ if (bounds.width > 0 && bounds.height > 0) {
+ if (bounds.x > c.scrollLeft + c.clientWidth * 0.9) {
+ c.scrollLeft = Math.min(bounds.x + bounds.width - c.clientWidth, bounds.x - 10);
+ }
+
+ if (bounds.y > c.scrollTop + c.clientHeight * 0.9) {
+ c.scrollTop = Math.min(bounds.y + bounds.height - c.clientHeight, bounds.y - 10);
+ }
+ }
+ }
+ else {
+ var bounds = graph.getGraphBounds();
+
+ if (bounds.width == 0 && bounds.height == 0) {
+ c.scrollLeft = (c.scrollWidth - c.clientWidth) / 2;
+ c.scrollTop = (c.scrollHeight - c.clientHeight) / 2;
+ }
+ else {
+ var width = Math.max(bounds.width, graph.scrollTileSize.width * graph.view.scale);
+ var height = Math.max(bounds.height, graph.scrollTileSize.height * graph.view.scale);
+
+ c.scrollLeft = Math.floor(Math.max(0, bounds.x - Math.max(0, (c.clientWidth - width) / 2)));
+ c.scrollTop = Math.floor(Math.max(0, bounds.y - Math.max(20, (c.clientHeight - height) / 4)));
+ }
+ }
+ }
+ else {
+ var b = mxRectangle.fromRectangle((graph.pageVisible) ?
+ graph.view.getBackgroundPageBounds() :
+ graph.getGraphBounds())
+ var tr = graph.view.translate;
+ var s = graph.view.scale;
+ b.x = b.x / s - tr.x;
+ b.y = b.y / s - tr.y;
+ b.width /= s;
+ b.height /= s;
+
+ var dy = (graph.pageVisible) ? 0 : Math.max(0, (c.clientHeight - b.height) / 4);
+
+ graph.view.setTranslate(Math.floor(Math.max(0,
+ (c.clientWidth - b.width) / 2) - b.x + 2),
+ Math.floor(dy - b.y + 1));
+ }
+ }
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setPageVisible = function (value) {
+ var graph = this.editor.graph;
+ var hasScrollbars = mxUtils.hasScrollbars(graph.container);
+ var tx = 0;
+ var ty = 0;
+
+ if (hasScrollbars) {
+ tx = graph.view.translate.x * graph.view.scale - graph.container.scrollLeft;
+ ty = graph.view.translate.y * graph.view.scale - graph.container.scrollTop;
+ }
+
+ graph.pageVisible = value;
+ graph.pageBreaksVisible = value;
+ graph.preferPageSize = value;
+ graph.view.validateBackground();
+
+ // Workaround for possible handle offset
+ if (hasScrollbars) {
+ var cells = graph.getSelectionCells();
+ graph.clearSelection();
+ graph.setSelectionCells(cells);
+ }
+
+ // Calls updatePageBreaks
+ graph.sizeDidChange();
+
+ if (hasScrollbars) {
+ graph.container.scrollLeft = graph.view.translate.x * graph.view.scale - tx;
+ graph.container.scrollTop = graph.view.translate.y * graph.view.scale - ty;
+ }
+
+ graph.defaultPageVisible = value;
+ this.fireEvent(new mxEventObject('pageViewChanged'));
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.installResizeHandler = function (dialog, resizable, destroy) {
+ if (resizable) {
+ dialog.window.setSize = function (w, h) {
+ if (!this.minimized) {
+ var iw = window.innerWidth || document.body.clientWidth || document.documentElement.clientWidth;
+ var ih = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight;
+ w = Math.min(w, iw - this.getX());
+ h = Math.min(h, ih - this.getY());
+ }
+
+ mxWindow.prototype.setSize.apply(this, arguments);
+ };
+ }
+
+ dialog.window.setLocation = function (x, y) {
+ var iw = window.innerWidth || document.body.clientWidth || document.documentElement.clientWidth;
+ var ih = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight;
+
+ var w = parseInt(this.div.style.width);
+ var h = parseInt(this.div.style.height);
+
+ x = Math.max(0, Math.min(x, iw - w));
+ y = Math.max(0, Math.min(y, ih - h));
+
+ if (this.getX() != x || this.getY() != y) {
+ mxWindow.prototype.setLocation.apply(this, arguments);
+ }
+
+ if (resizable && !this.minimized) {
+ this.setSize(w, h);
+ }
+ };
+
+ var resizeListener = mxUtils.bind(this, function () {
+ var x = dialog.window.getX();
+ var y = dialog.window.getY();
+
+ dialog.window.setLocation(x, y);
+ });
+
+ mxEvent.addListener(window, 'resize', resizeListener);
+
+ dialog.destroy = function () {
+ mxEvent.removeListener(window, 'resize', resizeListener);
+ dialog.window.destroy();
+
+ if (destroy != null) {
+ destroy();
+ }
+ }
+};
+
+/**
+ * Class: ChangeGridColor
+ *
+ * Undoable change to grid color.
+ */
+function ChangeGridColor(ui, color) {
+ this.ui = ui;
+ this.color = color;
+};
+
+/**
+ * Executes selection of a new page.
+ */
+ChangeGridColor.prototype.execute = function () {
+ var temp = this.ui.editor.graph.view.gridColor;
+ this.ui.setGridColor(this.color);
+ this.color = temp;
+};
+
+// Registers codec for ChangePageSetup
+(function () {
+ var codec = new mxObjectCodec(new ChangeGridColor(), ['ui']);
+
+ mxCodecRegistry.register(codec);
+})();
+
+/**
+ * Change types
+ */
+function ChangePageSetup(ui, color, image, format, pageScale) {
+ this.ui = ui;
+ this.color = color;
+ this.previousColor = color;
+ this.image = image;
+ this.previousImage = image;
+ this.format = format;
+ this.previousFormat = format;
+ this.pageScale = pageScale;
+ this.previousPageScale = pageScale;
+
+ // Needed since null are valid values for color and image
+ this.ignoreColor = false;
+ this.ignoreImage = false;
+}
+
+/**
+ * Implementation of the undoable page rename.
+ */
+ChangePageSetup.prototype.execute = function () {
+ var graph = this.ui.editor.graph;
+
+ if (!this.ignoreColor) {
+ this.color = this.previousColor;
+ var tmp = graph.background;
+ this.ui.setBackgroundColor(this.previousColor);
+ this.previousColor = tmp;
+ }
+
+ if (!this.ignoreImage) {
+ this.image = this.previousImage;
+ var tmp = graph.backgroundImage;
+ var img = this.previousImage;
+
+ if (img != null && Graph.isPageLink(img.src)) {
+ img = this.ui.createImageForPageLink(img.src, this.ui.currentPage);
+ }
+
+ this.ui.setBackgroundImage(img);
+ this.previousImage = tmp;
+ }
+
+ if (this.previousFormat != null) {
+ this.format = this.previousFormat;
+ var tmp = graph.pageFormat;
+
+ if (this.previousFormat.width != tmp.width ||
+ this.previousFormat.height != tmp.height) {
+ this.ui.setPageFormat(this.previousFormat);
+ this.previousFormat = tmp;
+ }
+ }
+
+ if (this.foldingEnabled != null && this.foldingEnabled != this.ui.editor.graph.foldingEnabled) {
+ this.ui.setFoldingEnabled(this.foldingEnabled);
+ this.foldingEnabled = !this.foldingEnabled;
+ }
+
+ if (this.previousPageScale != null) {
+ var currentPageScale = this.ui.editor.graph.pageScale;
+
+ if (this.previousPageScale != currentPageScale) {
+ this.ui.setPageScale(this.previousPageScale);
+ this.previousPageScale = currentPageScale;
+ }
+ }
+};
+
+// Registers codec for ChangePageSetup
+(function () {
+ var codec = new mxObjectCodec(new ChangePageSetup(), ['ui', 'previousColor', 'previousImage', 'previousFormat', 'previousPageScale']);
+
+ codec.afterDecode = function (dec, node, obj) {
+ obj.previousColor = obj.color;
+ obj.previousImage = obj.image;
+ obj.previousFormat = obj.format;
+ obj.previousPageScale = obj.pageScale;
+
+ if (obj.foldingEnabled != null) {
+ obj.foldingEnabled = !obj.foldingEnabled;
+ }
+
+ return obj;
+ };
+
+ mxCodecRegistry.register(codec);
+})();
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setBackgroundColor = function (value) {
+ this.editor.graph.background = value;
+ this.editor.graph.view.validateBackground();
+
+ this.fireEvent(new mxEventObject('backgroundColorChanged'));
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setFoldingEnabled = function (value) {
+ this.editor.graph.foldingEnabled = value;
+ this.editor.graph.view.revalidate();
+
+ this.fireEvent(new mxEventObject('foldingEnabledChanged'));
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setPageFormat = function (value, ignorePageVisible) {
+ ignorePageVisible = (ignorePageVisible != null) ? ignorePageVisible : urlParams['sketch'] == '1';
+ this.editor.graph.pageFormat = value;
+
+ if (!ignorePageVisible) {
+ if (!this.editor.graph.pageVisible) {
+ this.actions.get('pageView').funct();
+ }
+ else {
+ this.editor.graph.view.validateBackground();
+ this.editor.graph.sizeDidChange();
+ }
+ }
+
+ this.fireEvent(new mxEventObject('pageFormatChanged'));
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setPageScale = function (value) {
+ this.editor.graph.pageScale = value;
+
+ if (!this.editor.graph.pageVisible) {
+ this.actions.get('pageView').funct();
+ }
+ else {
+ this.editor.graph.view.validateBackground();
+ this.editor.graph.sizeDidChange();
+ }
+
+ this.fireEvent(new mxEventObject('pageScaleChanged'));
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setGridColor = function (value) {
+ this.editor.graph.view.gridColor = value;
+ this.editor.graph.view.validateBackground();
+ this.fireEvent(new mxEventObject('gridColorChanged'));
+};
+
+/**
+ * Updates the states of the given undo/redo items.
+ */
+EditorUi.prototype.addUndoListener = function () {
+ var undoMgr = this.editor.undoManager;
+
+ var undoListener = mxUtils.bind(this, function () {
+ this.updateActionStates();
+ });
+
+ undoMgr.addListener(mxEvent.ADD, undoListener);
+ undoMgr.addListener(mxEvent.UNDO, undoListener);
+ undoMgr.addListener(mxEvent.REDO, undoListener);
+ undoMgr.addListener(mxEvent.CLEAR, undoListener);
+
+ // Overrides cell editor to update action states
+ var cellEditorStartEditing = this.editor.graph.cellEditor.startEditing;
+
+ this.editor.graph.cellEditor.startEditing = function () {
+ cellEditorStartEditing.apply(this, arguments);
+ undoListener();
+ };
+
+ var cellEditorStopEditing = this.editor.graph.cellEditor.stopEditing;
+
+ this.editor.graph.cellEditor.stopEditing = function (cell, trigger) {
+ cellEditorStopEditing.apply(this, arguments);
+ undoListener();
+ };
+
+ // Updates the button states once
+ undoListener();
+};
+
+/**
+* Updates the states of the given toolbar items based on the selection.
+*/
+EditorUi.prototype.updateActionStates = function () {
+ var graph = this.editor.graph;
+ var ss = this.getSelectionState();
+ var unlocked = graph.isEnabled() && !graph.isCellLocked(graph.getDefaultParent());
+ var editable = !this.editor.chromeless || this.editor.editable;
+
+ // Updates action states
+ var actions = ['cut', 'copy', 'bold', 'italic', 'underline', 'delete', 'duplicate',
+ 'editStyle', 'editTooltip', 'editLink', 'backgroundColor', 'borderColor',
+ 'edit', 'toFront', 'toBack', 'solid', 'dashed', 'pasteSize',
+ 'dotted', 'fillColor', 'gradientColor', 'shadow', 'fontColor',
+ 'formattedText', 'rounded', 'toggleRounded', 'strokeColor',
+ 'sharp', 'snapToGrid'];
+
+ for (var i = 0; i < actions.length; i++) {
+ this.actions.get(actions[i]).setEnabled(ss.cells.length > 0);
+ }
+
+ this.actions.get('grid').setEnabled(editable);
+ this.actions.get('undo').setEnabled(this.canUndo() && editable);
+ this.actions.get('redo').setEnabled(this.canRedo() && editable);
+ this.actions.get('pasteSize').setEnabled(this.copiedSize != null && ss.vertices.length > 0);
+ this.actions.get('pasteData').setEnabled(this.copiedValue != null && ss.cells.length > 0);
+ this.actions.get('setAsDefaultStyle').setEnabled(graph.getSelectionCount() == 1);
+ this.actions.get('lockUnlock').setEnabled(!graph.isSelectionEmpty());
+ this.actions.get('bringForward').setEnabled(ss.cells.length == 1);
+ this.actions.get('sendBackward').setEnabled(ss.cells.length == 1);
+ this.actions.get('rotation').setEnabled(ss.vertices.length == 1);
+ this.actions.get('wordWrap').setEnabled(ss.vertices.length == 1);
+ this.actions.get('autosize').setEnabled(ss.vertices.length > 0);
+ this.actions.get('copySize').setEnabled(ss.vertices.length == 1);
+ this.actions.get('clearWaypoints').setEnabled(ss.connections);
+ this.actions.get('curved').setEnabled(ss.edges.length > 0);
+ this.actions.get('turn').setEnabled(ss.cells.length > 0);
+ this.actions.get('group').setEnabled(!ss.row && !ss.cell &&
+ (ss.cells.length > 1 || (ss.vertices.length == 1 &&
+ graph.model.getChildCount(ss.cells[0]) == 0 &&
+ !graph.isContainer(ss.vertices[0]))));
+ this.actions.get('ungroup').setEnabled(!ss.row && !ss.cell && !ss.table &&
+ ss.vertices.length > 0 && (graph.isContainer(ss.vertices[0]) ||
+ graph.getModel().getChildCount(ss.vertices[0]) > 0));
+ this.actions.get('removeFromGroup').setEnabled(ss.cells.length == 1 &&
+ graph.getModel().isVertex(graph.getModel().getParent(ss.cells[0])));
+ this.actions.get('collapsible').setEnabled(ss.vertices.length == 1 &&
+ (graph.model.getChildCount(ss.vertices[0]) > 0 ||
+ graph.isContainer(ss.vertices[0])));
+ this.actions.get('exitGroup').setEnabled(graph.view.currentRoot != null);
+ this.actions.get('home').setEnabled(graph.view.currentRoot != null);
+ this.actions.get('enterGroup').setEnabled(ss.cells.length == 1 &&
+ graph.isValidRoot(ss.cells[0]));
+ this.actions.get('copyData').setEnabled(ss.cells.length == 1);
+ this.actions.get('editLink').setEnabled(ss.cells.length == 1);
+ this.actions.get('editStyle').setEnabled(ss.cells.length == 1);
+ this.actions.get('editTooltip').setEnabled(ss.cells.length == 1);
+ this.actions.get('openLink').setEnabled(ss.cells.length == 1 &&
+ graph.getLinkForCell(ss.cells[0]) != null);
+ this.actions.get('guides').setEnabled(graph.isEnabled());
+ this.actions.get('selectVertices').setEnabled(unlocked);
+ this.actions.get('selectEdges').setEnabled(unlocked);
+ this.actions.get('selectAll').setEnabled(unlocked);
+ this.actions.get('selectNone').setEnabled(unlocked);
+
+ var foldable = ss.vertices.length == 1 &&
+ graph.isCellFoldable(ss.vertices[0]);
+ this.actions.get('expand').setEnabled(foldable);
+ this.actions.get('collapse').setEnabled(foldable);
+
+ // Updates menu states
+ this.menus.get('navigation').setEnabled(ss.cells.length > 0 ||
+ graph.view.currentRoot != null);
+ this.menus.get('layout').setEnabled(unlocked);
+ this.menus.get('insert').setEnabled(unlocked);
+ this.menus.get('direction').setEnabled(ss.unlocked &&
+ ss.vertices.length == 1);
+ this.menus.get('distribute').setEnabled(ss.unlocked &&
+ ss.vertices.length > 1);
+ this.menus.get('align').setEnabled(ss.unlocked &&
+ ss.cells.length > 0);
+
+ this.updatePasteActionStates();
+};
+
+EditorUi.prototype.zeroOffset = new mxPoint(0, 0);
+
+EditorUi.prototype.getDiagramContainerOffset = function () {
+ return this.zeroOffset;
+};
+
+/**
+ * Refreshes the viewport.
+ */
+EditorUi.prototype.refresh = function (sizeDidChange) {
+ sizeDidChange = (sizeDidChange != null) ? sizeDidChange : true;
+
+ var w = this.container.clientWidth;
+ var h = this.container.clientHeight;
+
+ if (this.container == document.body) {
+ w = document.body.clientWidth || document.documentElement.clientWidth;
+ h = document.documentElement.clientHeight;
+ }
+
+ // Workaround for bug on iOS see
+ // http://stackoverflow.com/questions/19012135/ios-7-ipad-safari-landscape-innerheight-outerheight-layout-issue
+ // FIXME: Fix if footer visible
+ var off = 0;
+
+ if (mxClient.IS_IOS && !window.navigator.standalone && typeof Menus !== 'undefined') {
+ if (window.innerHeight != document.documentElement.clientHeight) {
+ off = document.documentElement.clientHeight - window.innerHeight;
+ window.scrollTo(0, 0);
+ }
+ }
+
+ var effHsplitPosition = Math.max(0, Math.min(
+ this.hsplitPosition, w - this.splitSize - 40));
+ var tmp = 0;
+
+ if (this.menubar != null) {
+ this.menubarContainer.style.height = this.menubarHeight + 'px';
+ tmp += this.menubarHeight;
+ }
+
+ if (this.toolbar != null) {
+ this.toolbarContainer.style.top = this.menubarHeight + 'px';
+ this.toolbarContainer.style.height = this.toolbarHeight + 'px';
+ tmp += this.toolbarHeight;
+ }
+
+ if (tmp > 0) {
+ tmp += 1;
+ }
+
+ var fw = (this.format != null) ? this.formatWidth : 0;
+ this.sidebarContainer.style.top = tmp + 'px';
+ this.sidebarContainer.style.width = effHsplitPosition + 'px';
+ this.formatContainer.style.top = tmp + 'px';
+ this.formatContainer.style.width = fw + 'px';
+ this.formatContainer.style.display = (this.format != null) ? '' : 'none';
+
+ var diagContOffset = this.getDiagramContainerOffset();
+ var contLeft = (this.hsplit.parentNode != null) ? (effHsplitPosition) : 0;
+ this.footerContainer.style.height = this.footerHeight + 'px';
+ this.hsplit.style.top = this.sidebarContainer.style.top;
+ this.hsplit.style.left = effHsplitPosition + 'px';
+ this.footerContainer.style.display = (this.footerHeight == 0) ? 'none' : '';
+
+ if (this.tabContainer != null) {
+ this.tabContainer.style.left = contLeft + 'px';
+ this.hsplit.style.bottom = this.tabContainer.offsetHeight + 'px';
+ }
+ else {
+ this.hsplit.style.bottom = (this.footerHeight + off) + 'px';
+ }
+
+ if (this.footerHeight > 0) {
+ this.footerContainer.style.bottom = off + 'px';
+ }
+
+ var th = 0;
+
+ if (this.tabContainer != null) {
+ this.tabContainer.style.bottom = (this.footerHeight + off) + 'px';
+ this.tabContainer.style.right = fw + 'px';
+ th = this.tabContainer.clientHeight;
+ this.checkTabScrollerOverflow();
+ }
+
+ this.sidebarContainer.style.bottom = (this.footerHeight + off) + 'px';
+ this.formatContainer.style.bottom = (this.footerHeight + off) + 'px';
+
+ this.diagramContainer.style.left = (contLeft + diagContOffset.x) + 'px';
+ this.diagramContainer.style.top = (tmp + diagContOffset.y) + 'px';
+ this.diagramContainer.style.right = fw + 'px';
+ this.diagramContainer.style.bottom = (this.footerHeight + off + th) + 'px';
+
+ if (sizeDidChange) {
+ this.editor.graph.sizeDidChange();
+ }
+};
+
+/**
+ * Creates the required containers.
+ */
+EditorUi.prototype.createTabContainer = function () {
+ return null;
+};
+
+/**
+ * Creates the required containers.
+ */
+EditorUi.prototype.createDivs = function () {
+ this.menubarContainer = this.createDiv('geMenubarContainer');
+ this.toolbarContainer = this.createDiv('geToolbarContainer');
+ this.sidebarContainer = this.createDiv('geSidebarContainer');
+ this.formatContainer = this.createDiv('geSidebarContainer geFormatContainer');
+ this.diagramContainer = this.createDiv('geDiagramContainer');
+ this.footerContainer = this.createDiv('geFooterContainer');
+ this.hsplit = this.createDiv('geHsplit');
+
+ // Sets static style for containers
+ this.menubarContainer.style.top = '0px';
+ this.menubarContainer.style.left = '0px';
+ this.menubarContainer.style.right = '0px';
+ this.toolbarContainer.style.left = '0px';
+ this.toolbarContainer.style.right = '0px';
+ this.sidebarContainer.style.left = '0px';
+ this.sidebarContainer.style.zIndex = '1';
+ this.formatContainer.style.right = '0px';
+ this.formatContainer.style.zIndex = '1';
+ this.diagramContainer.style.right = ((this.format != null) ? this.formatWidth : 0) + 'px';
+ this.footerContainer.style.left = '0px';
+ this.footerContainer.style.right = '0px';
+ this.footerContainer.style.bottom = '0px';
+ this.footerContainer.style.zIndex = mxPopupMenu.prototype.zIndex - 3;
+ this.hsplit.style.width = this.splitSize + 'px';
+ this.hsplit.style.zIndex = '1';
+
+ if (!this.editor.chromeless) {
+ this.tabContainer = this.createTabContainer();
+ }
+ else {
+ this.diagramContainer.style.border = 'none';
+ }
+};
+
+/**
+ * Hook for sidebar footer container. This implementation returns null.
+ */
+EditorUi.prototype.createSidebarContainer = function () {
+ var div = document.createElement('div');
+ div.className = 'geSidebarContainer';
+
+ return div;
+};
+
+/**
+ * Creates the required containers.
+ */
+EditorUi.prototype.createUi = function () {
+ // Creates menubar
+ this.menubar = (this.editor.chromeless) ? null : this.menus.createMenubar(this.createDiv('geMenubar'));
+
+ if (this.menubar != null) {
+ this.menubarContainer.appendChild(this.menubar.container);
+ }
+
+ // Adds status bar in menubar
+ if (this.menubar != null) {
+ this.statusContainer = this.createStatusContainer();
+
+ // Connects the status bar to the editor status
+ this.editor.addListener('statusChanged', mxUtils.bind(this, function () {
+ this.setStatusText(this.editor.getStatus());
+ }));
+
+ this.setStatusText(this.editor.getStatus());
+ this.menubar.container.appendChild(this.statusContainer);
+
+ // Inserts into DOM
+ this.container.appendChild(this.menubarContainer);
+ }
+
+ // Creates the sidebar
+ this.sidebar = (this.editor.chromeless) ? null : this.createSidebar(this.sidebarContainer);
+
+ if (this.sidebar != null) {
+ this.container.appendChild(this.sidebarContainer);
+ }
+
+ // Creates the format sidebar
+ this.format = (this.editor.chromeless || !this.formatEnabled) ? null : this.createFormat(this.formatContainer);
+
+ if (this.format != null) {
+ this.container.appendChild(this.formatContainer);
+ }
+
+ // Creates the footer
+ var footer = (this.editor.chromeless) ? null : this.createFooter();
+
+ if (footer != null) {
+ this.footerContainer.appendChild(footer);
+ this.container.appendChild(this.footerContainer);
+ }
+
+ this.container.appendChild(this.diagramContainer);
+
+ if (this.container != null && this.tabContainer != null) {
+ this.container.appendChild(this.tabContainer);
+ }
+
+ // Creates toolbar
+ this.toolbar = (this.editor.chromeless) ? null : this.createToolbar(this.createDiv('geToolbar'));
+
+ if (this.toolbar != null) {
+ this.toolbarContainer.appendChild(this.toolbar.container);
+ this.container.appendChild(this.toolbarContainer);
+ }
+
+ // HSplit
+ if (this.sidebar != null) {
+ this.container.appendChild(this.hsplit);
+
+ this.addSplitHandler(this.hsplit, true, 0, mxUtils.bind(this, function (value) {
+ this.hsplitPosition = value;
+ this.refresh();
+ }));
+ }
+};
+
+/**
+ * Creates a new toolbar for the given container.
+ */
+EditorUi.prototype.createStatusContainer = function () {
+ var container = document.createElement('a');
+ container.className = 'geItem geStatus';
+
+ // Handles data-action attribute
+ mxEvent.addListener(container, 'click', mxUtils.bind(this, function (evt) {
+ var elt = mxEvent.getSource(evt);
+
+ if (elt.nodeName != 'A') {
+ var name = elt.getAttribute('data-action');
+
+ // Make generic
+ if (name == 'statusFunction' && this.editor.statusFunction != null) {
+ this.editor.statusFunction();
+ }
+ else if (name != null) {
+ var action = this.actions.get(name);
+
+ if (action != null) {
+ action.funct();
+ }
+ }
+ else {
+ var title = elt.getAttribute('data-title');
+ var msg = elt.getAttribute('data-message');
+
+ if (title != null && msg != null) {
+ this.showError(title, msg);
+ }
+ else {
+ var link = elt.getAttribute('data-link');
+
+ if (link != null) {
+ this.editor.graph.openLink(link);
+ }
+ }
+ }
+
+ mxEvent.consume(evt);
+ }
+ }));
+
+ return container;
+};
+
+/**
+ * Creates a new toolbar for the given container.
+ */
+EditorUi.prototype.setStatusText = function (value) {
+ this.statusContainer.innerHTML = Graph.sanitizeHtml(value);
+
+ // Wraps simple status messages in a div for styling
+ if (this.statusContainer.getElementsByTagName('div').length == 0 &&
+ value != null && value.length > 0) {
+ this.statusContainer.innerText = '';
+ var div = this.createStatusDiv(value);
+ this.statusContainer.appendChild(div);
+ }
+
+ // Handles data-effect attribute
+ var spans = this.statusContainer.querySelectorAll('[data-effect="fade"]');
+
+ if (spans != null) {
+ for (var i = 0; i < spans.length; i++) {
+ (function (temp) {
+ mxUtils.setOpacity(temp, 0);
+ mxUtils.setPrefixedStyle(temp.style, 'transform', 'scaleX(0)');
+ mxUtils.setPrefixedStyle(temp.style, 'transition', 'all 0.2s ease');
+
+ window.setTimeout(mxUtils.bind(this, function () {
+ mxUtils.setOpacity(temp, 100);
+ mxUtils.setPrefixedStyle(temp.style, 'transform', 'scaleX(1)');
+ mxUtils.setPrefixedStyle(temp.style, 'transition', 'all 1s ease');
+
+ window.setTimeout(mxUtils.bind(this, function () {
+ mxUtils.setPrefixedStyle(temp.style, 'transform', 'scaleX(0)');
+ mxUtils.setOpacity(temp, 0);
+
+ window.setTimeout(mxUtils.bind(this, function () {
+ if (temp.parentNode != null) {
+ temp.parentNode.removeChild(temp);
+ }
+ }), 1000);
+ }), Editor.updateStatusInterval / 2);
+ }), 0);
+ })(spans[i]);
+ }
+ }
+};
+
+/**
+ * Creates a new toolbar for the given container.
+ */
+EditorUi.prototype.createStatusDiv = function (value) {
+ var div = document.createElement('div');
+ div.style.textOverflow = 'ellipsis';
+ div.style.display = 'inline-block';
+ div.style.whiteSpace = 'nowrap';
+ div.style.overflow = 'hidden';
+ div.style.minWidth = '0';
+
+ div.setAttribute('title', value);
+ div.innerHTML = Graph.sanitizeHtml(value);
+
+ return div;
+};
+
+/**
+ * Creates a new toolbar for the given container.
+ */
+EditorUi.prototype.createToolbar = function (container) {
+ return new Toolbar(this, container);
+};
+
+/**
+ * Creates a new sidebar for the given container.
+ */
+EditorUi.prototype.createSidebar = function (container) {
+ return new Sidebar(this, container);
+};
+
+/**
+ * Creates a new sidebar for the given container.
+ */
+EditorUi.prototype.createFormat = function (container) {
+ return new Format(this, container);
+};
+
+/**
+ * Creates and returns a new footer.
+ */
+EditorUi.prototype.createFooter = function () {
+ return this.createDiv('geFooter');
+};
+
+/**
+ * Creates the actual toolbar for the toolbar container.
+ */
+EditorUi.prototype.createDiv = function (classname) {
+ var elt = document.createElement('div');
+ elt.className = classname;
+
+ return elt;
+};
+
+/**
+ * Updates the states of the given undo/redo items.
+ */
+EditorUi.prototype.addSplitHandler = function (elt, horizontal, dx, onChange) {
+ var start = null;
+ var initial = null;
+ var ignoreClick = true;
+ var last = null;
+
+ // Disables built-in pan and zoom in IE10 and later
+ if (mxClient.IS_POINTER) {
+ elt.style.touchAction = 'none';
+ }
+
+ var getValue = mxUtils.bind(this, function () {
+ var result = parseInt(((horizontal) ? elt.style.left : elt.style.bottom));
+
+ // Takes into account hidden footer
+ if (!horizontal) {
+ result = result + dx - this.footerHeight;
+ }
+
+ return result;
+ });
+
+ function moveHandler(evt) {
+ if (start != null) {
+ var pt = new mxPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ onChange(Math.max(0, initial + ((horizontal) ? (pt.x - start.x) : (start.y - pt.y)) - dx));
+ mxEvent.consume(evt);
+
+ if (initial != getValue()) {
+ ignoreClick = true;
+ last = null;
+ }
+ }
+ };
+
+ function dropHandler(evt) {
+ moveHandler(evt);
+ initial = null;
+ start = null;
+ };
+
+ mxEvent.addGestureListeners(elt, function (evt) {
+ start = new mxPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ initial = getValue();
+ ignoreClick = false;
+ mxEvent.consume(evt);
+ });
+
+ mxEvent.addListener(elt, 'click', mxUtils.bind(this, function (evt) {
+ if (!ignoreClick && this.hsplitClickEnabled) {
+ var next = (last != null) ? last - dx : 0;
+ last = getValue();
+ onChange(next);
+ mxEvent.consume(evt);
+ }
+ }));
+
+ mxEvent.addGestureListeners(document, null, moveHandler, dropHandler);
+
+ this.destroyFunctions.push(function () {
+ mxEvent.removeGestureListeners(document, null, moveHandler, dropHandler);
+ });
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.prompt = function (title, defaultValue, fn) {
+ var dlg = new FilenameDialog(this, defaultValue, mxResources.get('apply'), function (newValue) {
+ fn(parseFloat(newValue));
+ }, title);
+
+ this.showDialog(dlg.container, 300, 80, true, true);
+ dlg.init();
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.handleError = function (resp, title, fn, invokeFnOnClose, notFoundMessage) {
+ var e = (resp != null && resp.error != null) ? resp.error : resp;
+
+ if (e != null || title != null) {
+ var msg = mxUtils.htmlEntities(mxResources.get('unknownError'));
+ var btn = mxResources.get('ok');
+ title = (title != null) ? title : mxResources.get('error');
+
+ if (e != null && e.message != null) {
+ msg = mxUtils.htmlEntities(e.message);
+ }
+
+ this.showError(title, msg, btn, fn, null, null, null, null, null,
+ null, null, null, (invokeFnOnClose) ? fn : null);
+ }
+ else if (fn != null) {
+ fn();
+ }
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.showError = function (title, msg, btn, fn, retry, btn2, fn2, btn3, fn3, w, h, hide, onClose) {
+ var dlg = new ErrorDialog(this, title, msg, btn || mxResources.get('ok'),
+ fn, retry, btn2, fn2, hide, btn3, fn3);
+ var lines = Math.ceil((msg != null) ? msg.length / 50 : 1);
+ this.showDialog(dlg.container, w || 340, h || (100 + lines * 20), true, false, onClose);
+ dlg.init();
+};
+
+/**
+ * Displays a print dialog.
+ */
+EditorUi.prototype.showDialog = function (elt, w, h, modal, closable, onClose, noScroll, transparent, onResize, ignoreBgClick) {
+ this.editor.graph.tooltipHandler.resetTimer();
+ this.editor.graph.tooltipHandler.hideTooltip();
+
+ if (this.dialogs == null) {
+ this.dialogs = [];
+ }
+
+ this.dialog = new Dialog(this, elt, w, h, modal, closable, onClose, noScroll, transparent, onResize, ignoreBgClick);
+ this.dialogs.push(this.dialog);
+};
+
+/**
+ * Displays a print dialog.
+ */
+EditorUi.prototype.hideDialog = function (cancel, isEsc, matchContainer) {
+ if (this.dialogs != null && this.dialogs.length > 0) {
+ if (matchContainer != null && matchContainer != this.dialog.container.firstChild) {
+ return;
+ }
+
+ var dlg = this.dialogs.pop();
+
+ if (dlg.close(cancel, isEsc) == false) {
+ //add the dialog back if dialog closing is cancelled
+ this.dialogs.push(dlg);
+ return;
+ }
+
+ this.dialog = (this.dialogs.length > 0) ? this.dialogs[this.dialogs.length - 1] : null;
+ this.editor.fireEvent(new mxEventObject('hideDialog'));
+
+ if (this.dialog == null && this.editor.graph.container != null &&
+ this.editor.graph.container.style.visibility != 'hidden') {
+ window.setTimeout(mxUtils.bind(this, function () {
+ if (this.editor != null && (this.dialogs == null || this.dialogs.length == 0)) {
+ if (this.editor.graph.isEditing() && this.editor.graph.cellEditor.textarea != null) {
+ this.editor.graph.cellEditor.textarea.focus();
+ }
+ else {
+ mxUtils.clearSelection();
+ this.editor.graph.container.focus();
+ }
+ }
+ }), 0);
+ }
+ }
+};
+
+/**
+ * Handles ctrl+enter keystroke to clone cells.
+ */
+EditorUi.prototype.ctrlEnter = function () {
+ var graph = this.editor.graph;
+
+ if (graph.isEnabled()) {
+ try {
+ var cells = graph.getSelectionCells();
+ var lookup = new mxDictionary();
+ var newCells = [];
+
+ for (var i = 0; i < cells.length; i++) {
+ // Clones table rows instead of cells
+ var cell = (graph.isTableCell(cells[i])) ? graph.model.getParent(cells[i]) : cells[i];
+
+ if (cell != null && !lookup.get(cell)) {
+ lookup.put(cell, true);
+ newCells.push(cell);
+ }
+ }
+
+ graph.setSelectionCells(graph.duplicateCells(newCells, false));
+ }
+ catch (e) {
+ this.handleError(e);
+ }
+ }
+};
+
+/**
+ * Display a color dialog.
+ */
+EditorUi.prototype.pickColor = function (color, apply) {
+ var graph = this.editor.graph;
+ var selState = graph.cellEditor.saveSelection();
+ var h = 230 + ((Math.ceil(ColorDialog.prototype.presetColors.length / 12) +
+ Math.ceil(ColorDialog.prototype.defaultColors.length / 12)) * 17);
+
+ var dlg = new ColorDialog(this, mxUtils.rgba2hex(color) || 'none', function (color) {
+ graph.cellEditor.restoreSelection(selState);
+ apply(color);
+ }, function () {
+ graph.cellEditor.restoreSelection(selState);
+ });
+
+ this.showDialog(dlg.container, 230, h, true, false);
+ dlg.init();
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+EditorUi.prototype.openFile = function () {
+ // Closes dialog after open
+ window.openFile = new OpenFile(mxUtils.bind(this, function (cancel) {
+ this.hideDialog(cancel);
+ }));
+
+ // Removes openFile if dialog is closed
+ this.showDialog(new OpenDialog(this).container, (Editor.useLocalStorage) ? 640 : 320,
+ (Editor.useLocalStorage) ? 480 : 220, true, true, function () {
+ window.openFile = null;
+ });
+};
+
+/**
+ * Extracs the graph model from the given HTML data from a data transfer event.
+ */
+EditorUi.prototype.extractGraphModelFromHtml = function (data) {
+ var result = null;
+
+ try {
+ var idx = data.indexOf('<mxGraphModel ');
+
+ if (idx >= 0) {
+ var idx2 = data.lastIndexOf('</mxGraphModel>');
+
+ if (idx2 > idx) {
+ result = data.substring(idx, idx2 + 21).replace(/>/g, '>').
+ replace(/</g, '<').replace(/\\"/g, '"').replace(/\n/g, '');
+ }
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+
+ return result;
+};
+
+/**
+ * Opens the given files in the editor.
+ */
+EditorUi.prototype.readGraphModelFromClipboard = function (fn) {
+ this.readGraphModelFromClipboardWithType(mxUtils.bind(this, function (xml) {
+ if (xml != null) {
+ fn(xml);
+ }
+ else {
+ this.readGraphModelFromClipboardWithType(mxUtils.bind(this, function (xml) {
+ if (xml != null) {
+ var tmp = decodeURIComponent(xml);
+
+ if (this.isCompatibleString(tmp)) {
+ xml = tmp;
+ }
+ }
+
+ fn(xml);
+ }), 'text');
+ }
+ }), 'html');
+};
+
+/**
+ * Opens the given files in the editor.
+ */
+EditorUi.prototype.readGraphModelFromClipboardWithType = function (fn, type) {
+ navigator.clipboard.read().then(mxUtils.bind(this, function (data) {
+ if (data != null && data.length > 0 && type == 'html' &&
+ mxUtils.indexOf(data[0].types, 'text/html') >= 0) {
+ data[0].getType('text/html').then(mxUtils.bind(this, function (blob) {
+ blob.text().then(mxUtils.bind(this, function (value) {
+ try {
+ var elt = this.parseHtmlData(value);
+ var asHtml = elt.getAttribute('data-type') != 'text/plain';
+
+ // KNOWN: Paste from IE11 to other browsers on Windows
+ // seems to paste the contents of index.html
+ var xml = (asHtml) ? elt.innerHTML :
+ mxUtils.trim((elt.innerText == null) ?
+ mxUtils.getTextContent(elt) : elt.innerText);
+
+ // Workaround for junk after XML in VM
+ try {
+ var idx = xml.lastIndexOf('%3E');
+
+ if (idx >= 0 && idx < xml.length - 3) {
+ xml = xml.substring(0, idx + 3);
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+
+ // Checks for embedded XML content
+ try {
+ var spans = elt.getElementsByTagName('span');
+ var tmp = (spans != null && spans.length > 0) ?
+ mxUtils.trim(decodeURIComponent(spans[0].textContent)) :
+ decodeURIComponent(xml);
+
+ if (this.isCompatibleString(tmp)) {
+ xml = tmp;
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+ }
+ catch (e) {
+ // ignore
+ }
+
+ fn(this.isCompatibleString(xml) ? xml : null);
+ }))['catch'](function (data) {
+ fn(null);
+ });
+ }))['catch'](function (data) {
+ fn(null);
+ });
+ }
+ else if (data != null && data.length > 0 && type == 'text' &&
+ mxUtils.indexOf(data[0].types, 'text/plain') >= 0) {
+ data[0].getType('text/plain').then(function (blob) {
+ blob.text().then(function (value) {
+ fn(value);
+ })['catch'](function () {
+ fn(null);
+ });
+ })['catch'](function () {
+ fn(null);
+ });
+ }
+ else {
+ fn(null);
+ }
+ }))['catch'](function (data) {
+ fn(null);
+ });
+};
+
+/**
+ * Parses the given HTML data and returns a DIV.
+ */
+EditorUi.prototype.parseHtmlData = function (data) {
+ var elt = null;
+
+ if (data != null && data.length > 0) {
+ var hasMeta = data.substring(0, 6) == '' : '') +
+ Graph.sanitizeHtml(data);
+ asHtml = true;
+
+ // Workaround for innerText not ignoring style elements in Chrome
+ var styles = elt.getElementsByTagName('style');
+
+ if (styles != null) {
+ while (styles.length > 0) {
+ styles[0].parentNode.removeChild(styles[0]);
+ }
+ }
+
+ // Special case of link pasting from Chrome
+ if (elt.firstChild != null && elt.firstChild.nodeType == mxConstants.NODETYPE_ELEMENT &&
+ elt.firstChild.nextSibling != null && elt.firstChild.nextSibling.nodeType == mxConstants.NODETYPE_ELEMENT &&
+ elt.firstChild.nodeName == 'META' && elt.firstChild.nextSibling.nodeName == 'A' &&
+ elt.firstChild.nextSibling.nextSibling == null) {
+ var temp = (elt.firstChild.nextSibling.innerText == null) ?
+ mxUtils.getTextContent(elt.firstChild.nextSibling) :
+ elt.firstChild.nextSibling.innerText;
+
+ if (temp == elt.firstChild.nextSibling.getAttribute('href')) {
+ mxUtils.setTextContent(elt, temp);
+ asHtml = false;
+ }
+ }
+
+ // Extracts single image source address with meta tag in markup
+ var img = (hasMeta && elt.firstChild != null) ? elt.firstChild.nextSibling : elt.firstChild;
+
+ if (img != null && img.nextSibling == null &&
+ img.nodeType == mxConstants.NODETYPE_ELEMENT &&
+ img.nodeName == 'IMG') {
+ var temp = img.getAttribute('src');
+
+ if (temp != null) {
+ if (Editor.isPngDataUrl(temp)) {
+ var xml = Editor.extractGraphModelFromPng(temp);
+
+ if (xml != null && xml.length > 0) {
+ temp = xml;
+ }
+ }
+
+ mxUtils.setTextContent(elt, temp);
+ asHtml = false;
+ }
+ }
+ else {
+ // Extracts embedded XML or image source address from single PNG image
+ var images = elt.getElementsByTagName('img');
+
+ if (images.length == 1) {
+ var img = images[0];
+ var temp = img.getAttribute('src');
+
+ if (temp != null && img.parentNode == elt && elt.children.length == 1) {
+ if (Editor.isPngDataUrl(temp)) {
+ var xml = Editor.extractGraphModelFromPng(temp);
+
+ if (xml != null && xml.length > 0) {
+ temp = xml;
+ }
+ }
+
+ mxUtils.setTextContent(elt, temp);
+ asHtml = false;
+ }
+ }
+ }
+
+ if (asHtml) {
+ Graph.removePasteFormatting(elt);
+ }
+ }
+
+ if (!asHtml) {
+ elt.setAttribute('data-type', 'text/plain');
+ }
+
+ return elt;
+};
+
+/**
+ * Opens the given files in the editor.
+ */
+EditorUi.prototype.extractGraphModelFromEvent = function (evt) {
+ var result = null;
+ var data = null;
+
+ if (evt != null) {
+ var provider = (evt.dataTransfer != null) ?
+ evt.dataTransfer : evt.clipboardData;
+
+ if (provider != null) {
+ if (document.documentMode == 10 || document.documentMode == 11) {
+ data = provider.getData('Text');
+ }
+ else {
+ data = (mxUtils.indexOf(provider.types, 'text/html') >= 0) ?
+ provider.getData('text/html') : null;
+
+ if (mxUtils.indexOf(provider.types, 'text/plain') >= 0 &&
+ (data == null || data.length == 0)) {
+ data = provider.getData('text/plain');
+ }
+ }
+
+ if (data != null) {
+ data = Graph.zapGremlins(mxUtils.trim(data));
+
+ // Tries parsing as HTML document with embedded XML
+ var xml = this.extractGraphModelFromHtml(data);
+
+ if (xml != null) {
+ data = xml;
+ }
+ }
+ }
+ }
+
+ if (data != null && this.isCompatibleString(data)) {
+ result = data;
+ }
+
+ return result;
+};
+
+/**
+ * Hook for subclassers to return true if event data is a supported format.
+ * This implementation always returns false.
+ */
+EditorUi.prototype.isCompatibleString = function (data) {
+ return false;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+EditorUi.prototype.saveFile = function (forceDialog) {
+ if (!forceDialog && this.editor.filename != null) {
+ this.save(this.editor.getOrCreateFilename());
+ }
+ else {
+ var dlg = new FilenameDialog(this, this.editor.getOrCreateFilename(), mxResources.get('save'), mxUtils.bind(this, function (name) {
+ this.save(name);
+ }), null, mxUtils.bind(this, function (name) {
+ if (name != null && name.length > 0) {
+ return true;
+ }
+
+ mxUtils.confirm(mxResources.get('invalidName'));
+
+ return false;
+ }));
+ this.showDialog(dlg.container, 300, 100, true, true);
+ dlg.init();
+ }
+};
+
+/**
+ * Saves the current graph under the given filename.
+ */
+EditorUi.prototype.save = function (name) {
+ if (name != null) {
+ if (this.editor.graph.isEditing()) {
+ this.editor.graph.stopEditing();
+ }
+
+ var xml = mxUtils.getXml(this.editor.getGraphXml());
+
+ try {
+ if (Editor.useLocalStorage) {
+ if (localStorage.getItem(name) != null &&
+ !mxUtils.confirm(mxResources.get('replaceIt', [name]))) {
+ return;
+ }
+
+ localStorage.setItem(name, xml);
+ this.editor.setStatus(mxUtils.htmlEntities(mxResources.get('saved')) + ' ' + new Date());
+ }
+ else {
+ if (xml.length < MAX_REQUEST_SIZE) {
+ new mxXmlRequest(SAVE_URL, 'filename=' + encodeURIComponent(name) +
+ '&xml=' + encodeURIComponent(xml)).simulate(document, '_blank');
+ }
+ else {
+ mxUtils.alert(mxResources.get('drawingTooLarge'));
+ mxUtils.popup(xml);
+
+ return;
+ }
+ }
+
+ this.editor.setModified(false);
+ this.editor.setFilename(name);
+ this.updateDocumentTitle();
+ }
+ catch (e) {
+ this.editor.setStatus(mxUtils.htmlEntities(mxResources.get('errorSavingFile')));
+ }
+ }
+};
+
+/**
+ * Executes the given array of graph layouts using executeLayout and
+ * calls done after the last layout has finished.
+ */
+EditorUi.prototype.executeLayouts = function (layouts, post) {
+ this.executeLayout(mxUtils.bind(this, function () {
+ var layout = new mxCompositeLayout(this.editor.graph, layouts);
+ var cells = this.editor.graph.getSelectionCells();
+
+ layout.execute(this.editor.graph.getDefaultParent(),
+ cells.length == 0 ? null : cells);
+ }), true, post);
+};
+
+/**
+ * Executes the given layout.
+ */
+EditorUi.prototype.executeLayout = function (exec, animate, post) {
+ var graph = this.editor.graph;
+ graph.getModel().beginUpdate();
+ try {
+ exec();
+ }
+ catch (e) {
+ throw e;
+ }
+ finally {
+ // Animates the changes in the graph model
+ if (this.allowAnimation && animate && graph.isEnabled()) {
+ // New API for animating graph layout results asynchronously
+ var morph = new mxMorphing(graph);
+ morph.addListener(mxEvent.DONE, mxUtils.bind(this, function () {
+ graph.getModel().endUpdate();
+
+ if (post != null) {
+ post();
+ }
+ }));
+
+ morph.startAnimation();
+ }
+ else {
+ graph.getModel().endUpdate();
+
+ if (post != null) {
+ post();
+ }
+ }
+ }
+};
+
+/**
+ * Hides the current menu.
+ */
+EditorUi.prototype.showImageDialog = function (title, value, fn, ignoreExisting) {
+ var cellEditor = this.editor.graph.cellEditor;
+ var selState = cellEditor.saveSelection();
+ var newValue = mxUtils.prompt(title, value);
+ cellEditor.restoreSelection(selState);
+
+ if (newValue != null && newValue.length > 0) {
+ var img = new Image();
+
+ img.onload = function () {
+ fn(newValue, img.width, img.height);
+ };
+ img.onerror = function () {
+ fn(null);
+ mxUtils.alert(mxResources.get('fileNotFound'));
+ };
+
+ img.src = newValue;
+ }
+ else {
+ fn(null);
+ }
+};
+
+/**
+ * Hides the current menu.
+ */
+EditorUi.prototype.showLinkDialog = function (value, btnLabel, fn) {
+ var dlg = new LinkDialog(this, value, btnLabel, fn);
+ this.showDialog(dlg.container, 420, 90, true, true);
+ dlg.init();
+};
+
+/**
+ * Hides the current menu.
+ */
+EditorUi.prototype.showDataDialog = function (cell) {
+ if (cell != null && typeof window.EditDataDialog !== 'undefined') {
+ var dlg = new EditDataDialog(this, cell);
+ this.showDialog(dlg.container, 480, 420, true, false, null, false);
+ dlg.init();
+ }
+};
+
+/**
+ * Hides the current menu.
+ */
+EditorUi.prototype.showBackgroundImageDialog = function (apply, img) {
+ apply = (apply != null) ? apply : mxUtils.bind(this, function (image) {
+ var change = new ChangePageSetup(this, null, image);
+ change.ignoreColor = true;
+
+ this.editor.graph.model.execute(change);
+ });
+
+ var newValue = mxUtils.prompt(mxResources.get('backgroundImage'), (img != null) ? img.src : '');
+
+ if (newValue != null && newValue.length > 0) {
+ var img = new Image();
+
+ img.onload = function () {
+ apply(new mxImage(newValue, img.width, img.height), false);
+ };
+ img.onerror = function () {
+ apply(null, true);
+ mxUtils.alert(mxResources.get('fileNotFound'));
+ };
+
+ img.src = newValue;
+ }
+ else {
+ apply(null);
+ }
+};
+
+/**
+ * Loads the stylesheet for this graph.
+ */
+EditorUi.prototype.setBackgroundImage = function (image) {
+ this.editor.graph.setBackgroundImage(image);
+ this.editor.graph.view.validateBackgroundImage();
+
+ this.fireEvent(new mxEventObject('backgroundImageChanged'));
+};
+
+/**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+EditorUi.prototype.confirm = function (msg, okFn, cancelFn) {
+ if (mxUtils.confirm(msg)) {
+ if (okFn != null) {
+ okFn();
+ }
+ }
+ else if (cancelFn != null) {
+ cancelFn();
+ }
+};
+
+/**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+EditorUi.prototype.createOutline = function (wnd) {
+ var outline = new mxOutline(this.editor.graph);
+
+ mxEvent.addListener(window, 'resize', function () {
+ outline.update(false);
+ });
+
+ return outline;
+};
+
+// Alt+Shift+Keycode mapping to action
+EditorUi.prototype.altShiftActions = {
+ 65: 'connectionArrows', // Alt+Shift+A
+ 82: 'clearWaypoints', // Alt+Shift+R
+ 76: 'editLink', // Alt+Shift+L
+ 79: 'connectionPoints', // Alt+Shift+O
+ 81: 'editConnectionPoints', // Alt+Shift+Q
+ 84: 'editTooltip', // Alt+Shift+T
+ 86: 'pasteSize', // Alt+Shift+V
+ 70: 'copySize', // Alt+Shift+F
+ 66: 'copyData', // Alt+Shift+B
+ 69: 'pasteData' // Alt+Shift+E
+};
+
+/**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+EditorUi.prototype.createKeyHandler = function (editor) {
+ var editorUi = this;
+ var graph = this.editor.graph;
+ var keyHandler = new mxKeyHandler(graph);
+
+ var isEventIgnored = keyHandler.isEventIgnored;
+ keyHandler.isEventIgnored = function (evt) {
+ // Handles undo/redo/ctrl+./,/u via action and allows ctrl+b/i
+ // only if editing value is HTML (except for FF and Safari)
+ // 66, 73 are keycodes for editing actions like bold, italic
+ return !(mxEvent.isShiftDown(evt) && evt.keyCode == 9) &&
+ ((!this.isControlDown(evt) || mxEvent.isShiftDown(evt) ||
+ (evt.keyCode != 90 && evt.keyCode != 89 && evt.keyCode != 188 &&
+ evt.keyCode != 190 && evt.keyCode != 85)) && ((evt.keyCode != 66 && evt.keyCode != 73) ||
+ !this.isControlDown(evt) || (this.graph.cellEditor.isContentEditing() &&
+ !mxClient.IS_FF && !mxClient.IS_SF)) &&
+ ((evt.keyCode != 109 && evt.keyCode != 107) ||
+ (!this.isControlDown(evt) && !mxEvent.isShiftDown(evt)) ||
+ (!this.graph.cellEditor.isContentEditing() &&
+ !mxClient.IS_FF && !mxClient.IS_SF)) &&
+ isEventIgnored.apply(this, arguments));
+ };
+
+ // Ignores graph enabled state but not chromeless state
+ keyHandler.isEnabledForEvent = function (evt) {
+ return (!mxEvent.isConsumed(evt) && this.isGraphEvent(evt) && this.isEnabled() &&
+ (editorUi.dialogs == null || editorUi.dialogs.length == 0));
+ };
+
+ // Routes command-key to control-key on Mac
+ keyHandler.isControlDown = function (evt) {
+ return mxEvent.isControlDown(evt) || (mxClient.IS_MAC && evt.metaKey);
+ };
+
+ var thread = null;
+
+ // Helper function to move cells with the cursor keys
+ function nudge(keyCode, stepSize, resize) {
+ if (!graph.isSelectionEmpty() && graph.isEnabled()) {
+ stepSize = (stepSize != null) ? stepSize : 1;
+
+ var cells = graph.getCompositeParents(graph.getSelectionCells());
+ var cell = (cells.length > 0) ? cells[0] : null;
+
+ if (cell != null) {
+ if (resize) {
+ // Resizes all selected vertices
+ graph.getModel().beginUpdate();
+ try {
+ for (var i = 0; i < cells.length; i++) {
+ if (graph.getModel().isVertex(cells[i]) && graph.isCellResizable(cells[i])) {
+ var geo = graph.getCellGeometry(cells[i]);
+
+ if (geo != null) {
+ geo = geo.clone();
+
+ if (keyCode == 37) {
+ geo.width = Math.max(0, geo.width - stepSize);
+ }
+ else if (keyCode == 38) {
+ geo.height = Math.max(0, geo.height - stepSize);
+ }
+ else if (keyCode == 39) {
+ geo.width += stepSize;
+ }
+ else if (keyCode == 40) {
+ geo.height += stepSize;
+ }
+
+ graph.getModel().setGeometry(cells[i], geo);
+ }
+ }
+ }
+ }
+ finally {
+ graph.getModel().endUpdate();
+ }
+ }
+ else {
+ // Moves vertices up/down in a stack layout
+ var parent = graph.model.getParent(cell);
+ var scale = graph.getView().scale;
+ var layout = null;
+
+ if (graph.getSelectionCount() == 1 && graph.model.isVertex(cell) &&
+ graph.layoutManager != null && !graph.isCellLocked(cell)) {
+ layout = graph.layoutManager.getLayout(parent);
+ }
+
+ if (layout != null && layout.constructor == mxStackLayout) {
+ var index = parent.getIndex(cell);
+
+ if (keyCode == 37 || keyCode == 38) {
+ graph.model.add(parent, cell, Math.max(0, index - 1));
+ }
+ else if (keyCode == 39 || keyCode == 40) {
+ graph.model.add(parent, cell, Math.min(graph.model.getChildCount(parent), index + 1));
+ }
+ }
+ else {
+ var handler = graph.graphHandler;
+
+ if (handler != null) {
+ if (handler.first == null) {
+ handler.start(cell, 0, 0, graph.getMovableCells(cells));
+ }
+
+ if (handler.first != null) {
+ var dx = 0;
+ var dy = 0;
+
+ if (keyCode == 37) {
+ dx = -stepSize;
+ }
+ else if (keyCode == 38) {
+ dy = -stepSize;
+ }
+ else if (keyCode == 39) {
+ dx = stepSize;
+ }
+ else if (keyCode == 40) {
+ dy = stepSize;
+ }
+
+ handler.currentDx += dx * scale;
+ handler.currentDy += dy * scale;
+ handler.checkPreview();
+ handler.updatePreview();
+ }
+
+ // Groups move steps in undoable change
+ if (thread != null) {
+ window.clearTimeout(thread);
+ }
+
+ thread = window.setTimeout(function () {
+ if (handler.first != null) {
+ var dx = handler.roundLength(handler.currentDx / scale);
+ var dy = handler.roundLength(handler.currentDy / scale);
+ handler.moveCells(handler.cells, dx, dy);
+ handler.reset();
+ }
+ }, 400);
+ }
+ }
+ }
+ }
+ }
+ };
+
+ // Overridden to handle special alt+shift+cursor keyboard shortcuts
+ var directions = {
+ 37: mxConstants.DIRECTION_WEST, 38: mxConstants.DIRECTION_NORTH,
+ 39: mxConstants.DIRECTION_EAST, 40: mxConstants.DIRECTION_SOUTH
+ };
+ var keyHandlerGetFunction = keyHandler.getFunction;
+
+ mxKeyHandler.prototype.getFunction = function (evt) {
+ if (graph.isEnabled()) {
+ // TODO: Add alt modifier state in core API, here are some specific cases
+ if (mxEvent.isShiftDown(evt) && mxEvent.isAltDown(evt)) {
+ var action = editorUi.actions.get(editorUi.altShiftActions[evt.keyCode]);
+
+ if (action != null) {
+ return action.funct;
+ }
+ }
+
+ if (directions[evt.keyCode] != null && !graph.isSelectionEmpty()) {
+ // On macOS, Control+Cursor is used by Expose so allow for Alt+Control to resize
+ if (!this.isControlDown(evt) && mxEvent.isShiftDown(evt) && mxEvent.isAltDown(evt)) {
+ if (graph.model.isVertex(graph.getSelectionCell())) {
+ return function () {
+ var cells = graph.connectVertex(graph.getSelectionCell(), directions[evt.keyCode],
+ graph.defaultEdgeLength, evt, true);
+
+ if (cells != null && cells.length > 0) {
+ if (cells.length == 1 && graph.model.isEdge(cells[0])) {
+ graph.setSelectionCell(graph.model.getTerminal(cells[0], false));
+ }
+ else {
+ graph.setSelectionCell(cells[cells.length - 1]);
+ }
+
+ graph.scrollCellToVisible(graph.getSelectionCell());
+
+ if (editorUi.hoverIcons != null) {
+ editorUi.hoverIcons.update(graph.view.getState(graph.getSelectionCell()));
+ }
+ }
+ };
+ }
+ }
+ else {
+ // Avoids consuming event if no vertex is selected by returning null below
+ // Cursor keys move and resize (ctrl) cells
+ if (this.isControlDown(evt)) {
+ return function () {
+ nudge(evt.keyCode, (mxEvent.isShiftDown(evt)) ? graph.gridSize : null, true);
+ };
+ }
+ else {
+ return function () {
+ nudge(evt.keyCode, (mxEvent.isShiftDown(evt)) ? graph.gridSize : null);
+ };
+ }
+ }
+ }
+ }
+
+ return keyHandlerGetFunction.apply(this, arguments);
+ };
+
+ // Binds keystrokes to actions
+ keyHandler.bindAction = mxUtils.bind(this, function (code, control, key, shift) {
+ var action = this.actions.get(key);
+
+ if (action != null) {
+ var f = function () {
+ if (action.isEnabled()) {
+ action.funct.apply(this, arguments);
+ }
+ };
+
+ if (control) {
+ if (shift) {
+ keyHandler.bindControlShiftKey(code, f);
+ }
+ else {
+ keyHandler.bindControlKey(code, f);
+ }
+ }
+ else {
+ if (shift) {
+ keyHandler.bindShiftKey(code, f);
+ }
+ else {
+ keyHandler.bindKey(code, f);
+ }
+ }
+ }
+ });
+
+ var ui = this;
+ var keyHandlerEscape = keyHandler.escape;
+ keyHandler.escape = function (evt) {
+ keyHandlerEscape.apply(this, arguments);
+ };
+
+ // Ignores enter keystroke. Remove this line if you want the
+ // enter keystroke to stop editing. N, W, T are reserved.
+ keyHandler.enter = function () { };
+
+ keyHandler.bindControlShiftKey(36, function () { graph.exitGroup(); }); // Ctrl+Shift+Home
+ keyHandler.bindControlShiftKey(35, function () { graph.enterGroup(); }); // Ctrl+Shift+End
+ keyHandler.bindShiftKey(36, function () { graph.home(); }); // Ctrl+Shift+Home
+ keyHandler.bindKey(35, function () { graph.refresh(); }); // End
+ keyHandler.bindAction(107, true, 'zoomIn'); // Ctrl+Plus
+ keyHandler.bindAction(109, true, 'zoomOut'); // Ctrl+Minus
+ keyHandler.bindAction(80, true, 'print'); // Ctrl+P
+
+ if (!this.editor.chromeless || this.editor.editable) {
+ keyHandler.bindAction(79, true, 'outline', true); // Ctrl+Shift+O
+ keyHandler.bindControlKey(36, function () { if (graph.isEnabled()) { graph.foldCells(true); } }); // Ctrl+Home
+ keyHandler.bindControlKey(35, function () { if (graph.isEnabled()) { graph.foldCells(false); } }); // Ctrl+End
+ keyHandler.bindControlKey(13, function () { ui.ctrlEnter(); }); // Ctrl+Enter
+ keyHandler.bindAction(8, false, 'delete'); // Backspace
+ keyHandler.bindAction(8, true, 'deleteAll'); // Ctrl+Backspace
+ keyHandler.bindAction(8, false, 'deleteLabels', true); // Shift+Backspace
+ keyHandler.bindAction(46, false, 'delete'); // Delete
+ keyHandler.bindAction(46, true, 'deleteAll'); // Ctrl+Delete
+ keyHandler.bindAction(46, false, 'deleteLabels', true); // Shift+Delete
+ keyHandler.bindAction(36, false, 'resetView'); // Home
+ keyHandler.bindAction(72, true, 'fitWindow', true); // Ctrl+Shift+H
+ keyHandler.bindAction(74, true, 'fitPage'); // Ctrl+J
+ keyHandler.bindAction(74, true, 'fitTwoPages', true); // Ctrl+Shift+J
+ keyHandler.bindAction(48, true, 'customZoom'); // Ctrl+0
+ keyHandler.bindAction(82, true, 'turn'); // Ctrl+R
+ keyHandler.bindAction(82, true, 'clearDefaultStyle', true); // Ctrl+Shift+R
+ keyHandler.bindAction(83, true, 'save'); // Ctrl+S
+ keyHandler.bindAction(83, true, 'saveAs', true); // Ctrl+Shift+S
+ keyHandler.bindAction(65, true, 'selectAll'); // Ctrl+A
+ keyHandler.bindAction(65, true, 'selectNone', true); // Ctrl+A
+ keyHandler.bindAction(73, true, 'selectVertices', true); // Ctrl+Shift+I
+ keyHandler.bindAction(69, true, 'selectEdges', true); // Ctrl+Shift+E
+ keyHandler.bindAction(69, true, 'editStyle'); // Ctrl+E
+ keyHandler.bindAction(66, true, 'bold'); // Ctrl+B
+ keyHandler.bindAction(66, true, 'toBack', true); // Ctrl+Shift+B
+ keyHandler.bindAction(70, true, 'toFront', true); // Ctrl+Shift+F
+ keyHandler.bindAction(68, true, 'duplicate'); // Ctrl+D
+ keyHandler.bindAction(68, true, 'setAsDefaultStyle', true); // Ctrl+Shift+D
+ keyHandler.bindAction(90, true, 'undo'); // Ctrl+Z
+ keyHandler.bindAction(89, true, 'autosize', true); // Ctrl+Shift+Y
+ keyHandler.bindAction(88, true, 'cut'); // Ctrl+X
+ keyHandler.bindAction(67, true, 'copy'); // Ctrl+C
+ keyHandler.bindAction(86, true, 'paste'); // Ctrl+V
+ keyHandler.bindAction(71, true, 'group'); // Ctrl+G
+ keyHandler.bindAction(77, true, 'editData'); // Ctrl+M
+ keyHandler.bindAction(71, true, 'grid', true); // Ctrl+Shift+G
+ keyHandler.bindAction(73, true, 'italic'); // Ctrl+I
+ keyHandler.bindAction(76, true, 'lockUnlock'); // Ctrl+L
+ keyHandler.bindAction(76, true, 'layers', true); // Ctrl+Shift+L
+ keyHandler.bindAction(80, true, 'format', true); // Ctrl+Shift+P
+ keyHandler.bindAction(85, true, 'underline'); // Ctrl+U
+ keyHandler.bindAction(85, true, 'ungroup', true); // Ctrl+Shift+U
+ keyHandler.bindAction(109, true, 'decreaseFontSize', true); // Ctrl+Shift+Minus
+ keyHandler.bindAction(107, true, 'increaseFontSize', true); // Ctrl+Shift+Plus
+ keyHandler.bindAction(219, true, 'decreaseFontSize', true); // Ctrl+{
+ keyHandler.bindAction(221, true, 'increaseFontSize', true); // Ctrl+}
+ keyHandler.bindAction(190, true, 'superscript'); // Ctrl+.
+ keyHandler.bindAction(188, true, 'subscript'); // Ctrl+,
+ keyHandler.bindAction(13, false, 'keyPressEnter'); // Enter
+ keyHandler.bindKey(113, function () { if (graph.isEnabled()) { graph.startEditingAtCell(); } }); // F2
+ }
+
+ if (!mxClient.IS_WIN) {
+ keyHandler.bindAction(90, true, 'redo', true); // Ctrl+Shift+Z
+ }
+ else {
+ keyHandler.bindAction(89, true, 'redo'); // Ctrl+Y
+ }
+
+ return keyHandler;
+};
+
+/**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+EditorUi.prototype.destroy = function () {
+ var graph = this.editor.graph;
+
+ if (graph != null && this.selectionStateListener != null) {
+ graph.getSelectionModel().removeListener(mxEvent.CHANGE, this.selectionStateListener);
+ graph.getModel().removeListener(mxEvent.CHANGE, this.selectionStateListener);
+ graph.removeListener(mxEvent.EDITING_STARTED, this.selectionStateListener);
+ graph.removeListener(mxEvent.EDITING_STOPPED, this.selectionStateListener);
+ graph.getView().removeListener('unitChanged', this.selectionStateListener);
+ this.selectionStateListener = null;
+ }
+
+ if (this.editor != null) {
+ this.editor.destroy();
+ this.editor = null;
+ }
+
+ if (this.menubar != null) {
+ this.menubar.destroy();
+ this.menubar = null;
+ }
+
+ if (this.toolbar != null) {
+ this.toolbar.destroy();
+ this.toolbar = null;
+ }
+
+ if (this.sidebar != null) {
+ this.sidebar.destroy();
+ this.sidebar = null;
+ }
+
+ if (this.keyHandler != null) {
+ this.keyHandler.destroy();
+ this.keyHandler = null;
+ }
+
+ if (this.keydownHandler != null) {
+ mxEvent.removeListener(document, 'keydown', this.keydownHandler);
+ this.keydownHandler = null;
+ }
+
+ if (this.keyupHandler != null) {
+ mxEvent.removeListener(document, 'keyup', this.keyupHandler);
+ this.keyupHandler = null;
+ }
+
+ if (this.resizeHandler != null) {
+ mxEvent.removeListener(window, 'resize', this.resizeHandler);
+ this.resizeHandler = null;
+ }
+
+ if (this.gestureHandler != null) {
+ mxEvent.removeGestureListeners(document, this.gestureHandler);
+ this.gestureHandler = null;
+ }
+
+ if (this.orientationChangeHandler != null) {
+ mxEvent.removeListener(window, 'orientationchange', this.orientationChangeHandler);
+ this.orientationChangeHandler = null;
+ }
+
+ if (this.scrollHandler != null) {
+ mxEvent.removeListener(window, 'scroll', this.scrollHandler);
+ this.scrollHandler = null;
+ }
+
+ if (this.destroyFunctions != null) {
+ for (var i = 0; i < this.destroyFunctions.length; i++) {
+ this.destroyFunctions[i]();
+ }
+
+ this.destroyFunctions = null;
+ }
+
+ var c = [this.menubarContainer, this.toolbarContainer, this.sidebarContainer,
+ this.formatContainer, this.diagramContainer, this.footerContainer,
+ this.chromelessToolbar, this.hsplit, this.layersDialog];
+
+ for (var i = 0; i < c.length; i++) {
+ if (c[i] != null && c[i].parentNode != null) {
+ c[i].parentNode.removeChild(c[i]);
+ }
+ }
+};
+
+EditorUi.prototype.exportImage = function (scale, transparentBackground, ignoreSelection, addShadow, editable, border, noCrop, format, exportHandler) {
+ format = (format != null) ? format : 'png';
+
+ var selectionEmpty = this.editor.graph.isSelectionEmpty();
+ ignoreSelection = (ignoreSelection != null) ? ignoreSelection : selectionEmpty;
+
+ // Caches images
+ if (this.thumbImageCache == null) {
+ this.thumbImageCache = new Object();
+ }
+
+ try {
+ this.exportToCanvas(mxUtils.bind(this, function (canvas) {
+
+ try {
+ this.saveCanvas(canvas, (editable) ? this.getFileData(true, null,
+ null, null, ignoreSelection) : null, format, exportHandler);
+ }
+ catch (e) {
+ this.handleError(e);
+ }
+ }), null, this.thumbImageCache, null, mxUtils.bind(this, function (e) {
+ this.handleError(e);
+ }), null, ignoreSelection, scale || 1, transparentBackground,
+ addShadow, null, null, border, noCrop);
+ }
+ catch (e) {
+ this.handleError(e);
+ }
+};
+
+EditorUi.prototype.handleError = function (error) {
+ throw error;
+}
+
+/**
+ *
+ */
+EditorUi.prototype.exportToCanvas = function (callback, width, imageCache, background, error, limitHeight,
+ ignoreSelection, scale, transparentBackground, addShadow, converter, graph, border, noCrop) {
+ limitHeight = (limitHeight != null) ? limitHeight : true;
+ ignoreSelection = (ignoreSelection != null) ? ignoreSelection : true;
+ graph = (graph != null) ? graph : this.editor.graph;
+ border = (border != null) ? border : 0;
+
+ this.convertImages(graph.getSvg(null, null, null),
+ mxUtils.bind(this, function (svgRoot) {
+ var img = new Image();
+
+
+ img.onload = mxUtils.bind(this, function () {
+ try {
+ var canvas = document.createElement('canvas');
+ var w = parseInt(svgRoot.getAttribute('width'));
+ var h = parseInt(svgRoot.getAttribute('height'));
+ scale = (scale != null) ? scale : 1;
+
+ if (width != null) {
+ scale = (!limitHeight) ? width / w : Math.min(1, Math.min((width * 3) / (h * 4), width / w));
+ }
+
+ w = Math.ceil(scale * w) + 2 * border;
+ h = Math.ceil(scale * h) + 2 * border;
+
+ canvas.setAttribute('width', w);
+ canvas.setAttribute('height', h);
+ var ctx = canvas.getContext('2d');
+
+ ctx.scale(scale, scale);
+
+ // Workaround for broken data URI images in Safari on first export
+ if (mxClient.IS_SF) {
+ window.setTimeout(function () {
+ ctx.drawImage(img, border / scale, border / scale);
+ callback(canvas);
+ }, 0);
+ }
+ else {
+ ctx.drawImage(img, border / scale, border / scale);
+ callback(canvas);
+ }
+ }
+ catch (e) {
+ this.handleError(e);
+ }
+ });
+
+ img.onerror = function (e) {
+ this.handleError(e);
+ };
+
+ try {
+ if (addShadow) {
+ this.editor.graph.addSvgShadow(svgRoot);
+ }
+
+ var done = mxUtils.bind(this, function () {
+ if (this.editor.resolvedFontCss != null) {
+ var st = document.createElement('style');
+ st.setAttribute('type', 'text/css');
+ st.innerHTML = this.editor.resolvedFontCss;
+
+ // Must be in defs section for FF to work
+ var defs = svgRoot.getElementsByTagName('defs');
+ defs[0].appendChild(st);
+ }
+ img.src = this.createSvgDataUri(mxUtils.getXml(svgRoot));
+ });
+
+ this.loadFonts(done);
+ }
+ catch (e) {
+ //console.log('src', e, img.src);
+ this.handleError(e);
+ }
+ }), imageCache, converter);
+};
+
+/**
+ * Converts all images in the SVG output to data URIs for immediate rendering
+ */
+EditorUi.prototype.convertImages = function (svgRoot, callback, imageCache, converter) {
+ // Converts images to data URLs for immediate painting
+ if (converter == null) {
+ converter = this.createImageUrlConverter();
+ }
+
+ // Barrier for asynchronous image loading
+ var counter = 0;
+
+ function inc() {
+ counter++;
+ };
+
+ function dec() {
+ counter--;
+
+ if (counter == 0) {
+ callback(svgRoot);
+ }
+ };
+
+ var cache = imageCache || new Object();
+
+ var convertImages = mxUtils.bind(this, function (tagName, srcAttr) {
+ var images = svgRoot.getElementsByTagName(tagName);
+
+ for (var i = 0; i < images.length; i++) {
+ (mxUtils.bind(this, function (img) {
+ var src = converter.convert(img.getAttribute(srcAttr));
+
+ // Data URIs are pass-through
+ if (src != null && src.substring(0, 5) != 'data:') {
+ var tmp = cache[src];
+
+ if (tmp == null) {
+ inc();
+
+ this.convertImageToDataUri(src, function (uri) {
+ if (uri != null) {
+ cache[src] = uri;
+ img.setAttribute(srcAttr, uri);
+ }
+
+ dec();
+ });
+ }
+ else {
+ img.setAttribute(srcAttr, tmp);
+ }
+ }
+ else if (src != null) {
+ img.setAttribute(srcAttr, src);
+ }
+ }))(images[i]);
+ }
+ });
+
+ // Converts all known image tags in output
+ // LATER: Add support for images in CSS
+ convertImages('image', 'xlink:href');
+ convertImages('img', 'src');
+
+ // All from cache or no images
+ if (counter == 0) {
+ callback(svgRoot);
+ }
+};
+
+/**
+ * Converts all images in the SVG output to data URIs for immediate rendering
+ */
+EditorUi.prototype.createImageUrlConverter = function () {
+ var converter = new mxUrlConverter();
+ converter.updateBaseUrl();
+
+ // Extends convert to avoid CORS using an image proxy server where needed
+ var convert = converter.convert;
+ var self = this;
+
+ converter.convert = function (src) {
+ // if (src != null)
+ // {
+ // var remote = src.substring(0, 7) == 'http://' || src.substring(0, 8) == 'https://';
+
+ // if (remote && !navigator.onLine)
+ // {
+ // src = self.svgBrokenImage.src;
+ // }
+ // else if (remote && src.substring(0, converter.baseUrl.length) != converter.baseUrl &&
+ // (!self.crossOriginImages || !self.isCorsEnabledForUrl(src)))
+ // {
+ // src = PROXY_URL + '?url=' + encodeURIComponent(src);
+ // }
+ // else if (src.substring(0, 19) != 'chrome-extension://')
+ // {
+ // src = convert.apply(this, arguments);
+ // }
+ // }
+
+ return src;
+ };
+
+ return converter;
+};
+
+/**
+ * For the fontCSS to be applied when rendering images on canvas, the actual
+ * font data must be made available via a data URI encoding of the file.
+ */
+EditorUi.prototype.loadFonts = function (then) {
+ if (this.editor.fontCss != null && this.editor.resolvedFontCss == null) {
+ var parts = this.editor.fontCss.split('url(');
+ var waiting = 0;
+ var fonts = {};
+
+ // Strips leading and trailing quotes and spaces
+ function trimString(str) {
+ return str.replace(new RegExp("^[\\s\"']+", "g"), "").replace(new RegExp("[\\s\"']+$", "g"), "");
+ };
+
+ var finish = mxUtils.bind(this, function () {
+ if (waiting == 0) {
+ // Constructs string
+ var result = [parts[0]];
+
+ for (var j = 1; j < parts.length; j++) {
+ var idx = parts[j].indexOf(')');
+ result.push('url("');
+ result.push(fonts[trimString(parts[j].substring(0, idx))]);
+ result.push('"' + parts[j].substring(idx));
+ }
+
+ this.editor.resolvedFontCss = result.join('');
+ then();
+ }
+ });
+
+ if (parts.length > 0) {
+ for (var i = 1; i < parts.length; i++) {
+ var idx = parts[i].indexOf(')');
+ var format = null;
+
+ // Checks if there is a format directive
+ var fmtIdx = parts[i].indexOf('format(', idx);
+
+ if (fmtIdx > 0) {
+ format = trimString(parts[i].substring(fmtIdx + 7, parts[i].indexOf(')', fmtIdx)));
+ }
+
+ (mxUtils.bind(this, function (url) {
+ if (fonts[url] == null) {
+ // Mark font es being fetched and fetch it
+ fonts[url] = url;
+ waiting++;
+
+ var mime = 'application/x-font-ttf';
+
+ // See https://stackoverflow.com/questions/2871655/proper-mime-type-for-fonts
+ if (format == 'svg' || /(\.svg)($|\?)/i.test(url)) {
+ mime = 'image/svg+xml';
+ }
+ else if (format == 'otf' || format == 'embedded-opentype' || /(\.otf)($|\?)/i.test(url)) {
+ mime = 'application/x-font-opentype';
+ }
+ else if (format == 'woff' || /(\.woff)($|\?)/i.test(url)) {
+ mime = 'application/font-woff';
+ }
+ else if (format == 'woff2' || /(\.woff2)($|\?)/i.test(url)) {
+ mime = 'application/font-woff2';
+ }
+ else if (format == 'eot' || /(\.eot)($|\?)/i.test(url)) {
+ mime = 'application/vnd.ms-fontobject';
+ }
+ else if (format == 'sfnt' || /(\.sfnt)($|\?)/i.test(url)) {
+ mime = 'application/font-sfnt';
+ }
+
+ var realUrl = url;
+
+ if ((/^https?:\/\//.test(realUrl)) && !this.isCorsEnabledForUrl(realUrl)) {
+ realUrl = PROXY_URL + '?url=' + encodeURIComponent(url);
+ }
+
+ // LATER: Remove cache-control header
+ this.loadUrl(realUrl, mxUtils.bind(this, function (uri) {
+ fonts[url] = uri;
+ waiting--;
+ finish();
+ }), mxUtils.bind(this, function (err) {
+ // LATER: handle error
+ waiting--;
+ finish();
+ }), true, null, 'data:' + mime + ';charset=utf-8;base64,');
+ }
+ }))(trimString(parts[i].substring(0, idx)), format);
+ }
+ }
+ }
+ else {
+ then();
+ }
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.createSvgDataUri = function (svg) {
+ return 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svg)));
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.getFileData = function (forceXml, forceSvg, forceHtml, embeddedCallback, ignoreSelection, currentPage, node, compact, file) {
+ ignoreSelection = (ignoreSelection != null) ? ignoreSelection : true;
+ currentPage = (currentPage != null) ? currentPage : false;
+
+ node = this.editor.getGraphXml(ignoreSelection);
+ var graph = this.editor.graph;
+
+
+ var result = this.createFileData(node, graph, file, window.location.href,
+ forceXml, forceSvg, forceHtml, embeddedCallback, ignoreSelection, compact);
+
+ // Removes temporary graph from DOM
+ if (graph != this.editor.graph) {
+ graph.container.parentNode.removeChild(graph.container);
+ }
+
+ return result;
+};
+
+/**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+EditorUi.prototype.createFileData = function (node, graph, file, url, forceXml, forceSvg, forceHtml, embeddedCallback, ignoreSelection, compact) {
+ graph = (graph != null) ? graph : this.editor.graph;
+ forceXml = (forceXml != null) ? forceXml : false;
+ ignoreSelection = (ignoreSelection != null) ? ignoreSelection : true;
+
+ var editLink = null;
+ var redirect = null;
+
+ if (file == null || file.getMode() == App.MODE_DEVICE || file.getMode() == App.MODE_BROWSER) {
+ editLink = '_blank';
+ }
+ else {
+ editLink = url;
+ redirect = editLink;
+ }
+
+ if (node == null) {
+ return '';
+ }
+ else {
+ var fileNode = node;
+
+ // Ignores case for possible HTML or XML nodes
+ if (fileNode.nodeName.toLowerCase() != 'mxfile') {
+ // Removes control chars in input for correct roundtrip check
+ var text = graph.zapGremlins(mxUtils.getXml(node));
+ var data = graph.compress(text);
+
+ // Fallback to plain XML for invalid compression
+ // TODO: Remove this fallback with active pages
+ if (graph.decompress(data) != text) {
+ return text;
+ }
+ else {
+ var diagramNode = node.ownerDocument.createElement('diagram');
+ diagramNode.setAttribute('id', 'tapd-' + Editor.guid());
+ mxUtils.setTextContent(diagramNode, data);
+
+ fileNode = node.ownerDocument.createElement('mxfile');
+ fileNode.appendChild(diagramNode);
+ }
+ }
+
+ if (!compact) {
+ // Removes old metadata
+ fileNode.removeAttribute('userAgent');
+ fileNode.removeAttribute('version');
+ fileNode.removeAttribute('editor');
+ fileNode.removeAttribute('type');
+
+ // Adds new metadata
+ fileNode.setAttribute('modified', new Date().toISOString());
+ fileNode.setAttribute('host', window.location.hostname);
+ fileNode.setAttribute('agent', navigator.userAgent);
+ fileNode.setAttribute('version', EditorUi.VERSION);
+ fileNode.setAttribute('etag', 'tapd-' + Editor.guid());
+
+ var md = (file != null) ? file.getMode() : this.mode;
+
+ if (md != null) {
+ fileNode.setAttribute('type', md);
+ }
+ }
+ else {
+ fileNode = fileNode.cloneNode(true);
+ fileNode.removeAttribute('userAgent');
+ fileNode.removeAttribute('version');
+ fileNode.removeAttribute('editor');
+ fileNode.removeAttribute('type');
+ }
+
+ var xml = mxUtils.getXml(fileNode);
+
+ return xml;
+ }
+};
+
+/**
+ *
+ */
+EditorUi.prototype.saveCanvas = function (canvas, xml, format, exportHandler) {
+ var ext = ((format == 'jpeg') ? 'jpg' : format);
+ var filename = this.getBaseFilename() + '.' + ext;
+ var data = this.createImageDataUri(canvas, xml, format);
+
+ if (exportHandler && typeof exportHandler === 'function') {
+ exportHandler(data, filename);
+ } else {
+ this.doDownloadFile(data.substring(data.lastIndexOf(',') + 1), filename, 'image/' + format, true, format);
+ }
+
+};
+
+
+EditorUi.prototype.getBaseFilename = function () {
+ return this.editor.getFilename();
+};
+
+
+EditorUi.prototype.createImageDataUri = function (canvas, xml, format) {
+ var data = canvas.toDataURL('image/' + format);
+
+ // Checks if output is invalid or empty
+ if (data.length <= 6 || data == canvas.cloneNode(false).toDataURL('image/' + format)) {
+ throw { message: 'Invalid image' };
+ }
+
+ if (xml != null) {
+ data = this.writeGraphModelToPng(data, 'zTXt', 'mxGraphModel', atob(this.editor.graph.compress(xml)));
+ }
+
+ return data;
+};
+
+/**
+ * Adds the given text to the compressed or non-compressed text chunk.
+ */
+EditorUi.prototype.writeGraphModelToPng = function (data, type, key, value, error) {
+ var base64 = data.substring(data.indexOf(',') + 1);
+ var f = (window.atob) ? atob(base64) : Base64.decode(base64, true);
+ var pos = 0;
+
+ function fread(d, count) {
+ var start = pos;
+ pos += count;
+
+ return d.substring(start, pos);
+ };
+
+ // Reads unsigned long 32 bit big endian
+ function _freadint(d) {
+ var bytes = fread(d, 4);
+
+ return bytes.charCodeAt(3) + (bytes.charCodeAt(2) << 8) +
+ (bytes.charCodeAt(1) << 16) + (bytes.charCodeAt(0) << 24);
+ };
+
+ function writeInt(num) {
+ return String.fromCharCode((num >> 24) & 0x000000ff, (num >> 16) & 0x000000ff,
+ (num >> 8) & 0x000000ff, num & 0x000000ff);
+ };
+
+ // Checks signature
+ if (fread(f, 8) != String.fromCharCode(137) + 'PNG' + String.fromCharCode(13, 10, 26, 10)) {
+ if (error != null) {
+ error();
+ }
+
+ return;
+ }
+
+ // Reads header chunk
+ fread(f, 4);
+
+ if (fread(f, 4) != 'IHDR') {
+ if (error != null) {
+ error();
+ }
+
+ return;
+ }
+
+ fread(f, 17);
+ var result = f.substring(0, pos);
+
+ do {
+ var n = _freadint(f);
+ var chunk = fread(f, 4);
+
+ if (chunk == 'IDAT') {
+ result = f.substring(0, pos - 8);
+
+ var chunkData = key + String.fromCharCode(0) +
+ ((type == 'zTXt') ? String.fromCharCode(0) : '') +
+ value;
+
+ // FIXME: Wrong crc
+ var crc = 0xffffffff;
+ crc = this.updateCRC(crc, type, 0, 4);
+ crc = this.updateCRC(crc, chunkData, 0, chunkData.length);
+
+ result += writeInt(chunkData.length) + type + chunkData + writeInt(crc ^ 0xffffffff);
+ result += f.substring(pos - 8, f.length);
+
+ break;
+ }
+
+ result += f.substring(pos - 8, pos - 4 + n);
+ fread(f, n);
+ fread(f, 4);
+ }
+ while (n);
+
+ return 'data:image/png;base64,' + ((window.btoa) ? btoa(result) : Base64.encode(result, true));
+};
+
+EditorUi.prototype.crcTable = [];
+
+for (var n = 0; n < 256; n++) {
+ var c = n;
+
+ for (var k = 0; k < 8; k++) {
+ if ((c & 1) == 1) {
+ c = 0xedb88320 ^ (c >>> 1);
+ }
+ else {
+ c >>>= 1;
+ }
+
+ EditorUi.prototype.crcTable[n] = c;
+ }
+}
+
+EditorUi.prototype.updateCRC = function (crc, data, off, len) {
+ var c = crc;
+
+ for (var n = 0; n < len; n++) {
+ c = EditorUi.prototype.crcTable[(c ^ data[off + n]) & 0xff] ^ (c >>> 8);
+ }
+
+ return c;
+};
diff --git a/oaweb/public/cherry/drawio/Format.js b/oaweb/public/cherry/drawio/Format.js
new file mode 100644
index 0000000..e3ad097
--- /dev/null
+++ b/oaweb/public/cherry/drawio/Format.js
@@ -0,0 +1,8103 @@
+/**
+ * Copyright (c) 2006-2012, JGraph Ltd
+ */
+Format = function(editorUi, container)
+{
+ this.editorUi = editorUi;
+ this.container = container;
+};
+
+/**
+ * Background color for inactive tabs.
+ */
+Format.inactiveTabBackgroundColor = '#e4e4e4';
+
+/**
+ * Icons for markers (24x16).
+ */
+Format.classicFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.classicThinFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.openFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.openThinFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.openAsyncFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.blockFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.blockThinFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.asyncFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ovalFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.diamondFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.diamondThinFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.classicMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.classicThinMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.blockMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.blockThinMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.asyncMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ovalMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.diamondMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.diamondThinMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.boxMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.halfCircleMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.dashMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.crossMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.circlePlusMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.circleMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ERmandOneMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ERmanyMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ERoneToManyMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ERzeroToOneMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.ERzeroToManyMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.EROneMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.baseDashMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.doubleBlockMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+Format.doubleBlockFilledMarkerImage = Graph.createSvgImage(20, 22, '', 32, 20);
+
+/**
+ * Adds a style change item to the given menu.
+ */
+Format.processMenuIcon = function(elt, transform)
+{
+ var imgs = elt.getElementsByTagName('img');
+
+ if (imgs.length > 0)
+ {
+ imgs[0].className = 'geIcon geAdaptiveAsset';
+ imgs[0].style.padding = '0px';
+ imgs[0].style.margin = '0 0 0 2px';
+
+ if (transform != null)
+ {
+ mxUtils.setPrefixedStyle(imgs[0].style, 'transform', transform);
+ }
+ }
+
+ return elt;
+};
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.labelIndex = 0;
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.diagramIndex = 0;
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.currentIndex = 0;
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.showCloseButton = true;
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.rounded = false;
+
+/**
+ * Returns information about the current selection.
+ */
+Format.prototype.curved = false;
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+Format.prototype.init = function()
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ this.update = mxUtils.bind(this, function(sender, evt)
+ {
+ this.refresh();
+ });
+
+ graph.getSelectionModel().addListener(mxEvent.CHANGE, this.update);
+ graph.getModel().addListener(mxEvent.CHANGE, this.update);
+ graph.addListener(mxEvent.EDITING_STARTED, this.update);
+ graph.addListener(mxEvent.EDITING_STOPPED, this.update);
+ graph.getView().addListener('unitChanged', this.update);
+ editor.addListener('autosaveChanged', this.update);
+ graph.addListener(mxEvent.ROOT, this.update);
+ ui.addListener('styleChanged', this.update);
+ ui.addListener('darkModeChanged', this.update);
+
+ this.refresh();
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+Format.prototype.clear = function()
+{
+ this.container.innerText = '';
+
+ // Destroy existing panels
+ if (this.panels != null)
+ {
+ for (var i = 0; i < this.panels.length; i++)
+ {
+ this.panels[i].destroy();
+ }
+ }
+
+ this.panels = [];
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+Format.prototype.refresh = function()
+{
+ if (this.pendingRefresh != null)
+ {
+ window.clearTimeout(this.pendingRefresh);
+ this.pendingRefresh = null;
+ }
+
+ this.pendingRefresh = window.setTimeout(mxUtils.bind(this, function()
+ {
+ this.immediateRefresh();
+ }));
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+Format.prototype.immediateRefresh = function()
+{
+ // Performance tweak: No refresh needed if not visible
+ if (this.container.style.width == '0px')
+ {
+ return;
+ }
+
+ this.clear();
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+
+ var div = document.createElement('div');
+ div.style.whiteSpace = 'nowrap';
+ div.style.color = 'rgb(112, 112, 112)';
+ div.style.textAlign = 'left';
+ div.style.cursor = 'default';
+
+ var label = document.createElement('div');
+ label.className = 'geFormatSection';
+ label.style.textAlign = 'center';
+ label.style.fontWeight = 'bold';
+ label.style.paddingTop = '8px';
+ label.style.fontSize = '13px';
+ label.style.borderWidth = '0px 0px 1px 1px';
+ label.style.borderStyle = 'solid';
+ label.style.display = 'inline-block';
+ label.style.height = '25px';
+ label.style.overflow = 'hidden';
+ label.style.width = '100%';
+ this.container.appendChild(div);
+
+ // Prevents text selection
+ mxEvent.addListener(label, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
+ mxUtils.bind(this, function(evt)
+ {
+ evt.preventDefault();
+ }));
+
+ var ss = ui.getSelectionState();
+ var containsLabel = ss.containsLabel;
+ var currentLabel = null;
+ var currentPanel = null;
+
+ var addClickHandler = mxUtils.bind(this, function(elt, panel, index, lastEntry)
+ {
+ var clickHandler = mxUtils.bind(this, function(evt)
+ {
+ if (currentLabel != elt)
+ {
+ if (containsLabel)
+ {
+ this.labelIndex = index;
+ }
+ else if (graph.isSelectionEmpty())
+ {
+ this.diagramIndex = index;
+ }
+ else
+ {
+ this.currentIndex = index;
+ }
+
+ if (currentLabel != null)
+ {
+ currentLabel.style.backgroundColor = Format.inactiveTabBackgroundColor;
+ currentLabel.style.borderBottomWidth = '1px';
+ }
+
+ currentLabel = elt;
+ currentLabel.style.backgroundColor = '';
+ currentLabel.style.borderBottomWidth = '0px';
+
+ if (currentPanel != panel)
+ {
+ if (currentPanel != null)
+ {
+ currentPanel.style.display = 'none';
+ }
+
+ currentPanel = panel;
+ currentPanel.style.display = '';
+ }
+ }
+ });
+
+ mxEvent.addListener(elt, 'click', clickHandler);
+
+ // Prevents text selection
+ mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
+ mxUtils.bind(this, function(evt)
+ {
+ evt.preventDefault();
+ }));
+
+ if ((lastEntry && currentLabel == null) ||
+ (index == ((containsLabel) ? this.labelIndex : ((graph.isSelectionEmpty()) ?
+ this.diagramIndex : this.currentIndex))))
+ {
+ // Invokes handler directly as a workaround for no click on DIV in KHTML.
+ clickHandler();
+ }
+ });
+
+ var idx = 0;
+
+ if (graph.isSelectionEmpty())
+ {
+ mxUtils.write(label, mxResources.get('diagram'));
+ label.style.borderLeftWidth = '0px';
+
+ div.appendChild(label);
+ var diagramPanel = div.cloneNode(false);
+ this.panels.push(new DiagramFormatPanel(this, ui, diagramPanel));
+ this.container.appendChild(diagramPanel);
+
+ if (Editor.styles != null)
+ {
+ diagramPanel.style.display = 'none';
+ label.style.width = (this.showCloseButton) ? '106px' : '50%';
+ label.style.cursor = 'pointer';
+ label.style.backgroundColor = Format.inactiveTabBackgroundColor;
+
+ var label2 = label.cloneNode(false);
+ label2.style.borderLeftWidth = '1px';
+ label2.style.borderRightWidth = '1px';
+ label2.style.backgroundColor = Format.inactiveTabBackgroundColor;
+
+ addClickHandler(label, diagramPanel, idx++);
+
+ var stylePanel = div.cloneNode(false);
+ stylePanel.style.display = 'none';
+ mxUtils.write(label2, mxResources.get('style'));
+ div.appendChild(label2);
+ this.panels.push(new DiagramStylePanel(this, ui, stylePanel));
+ this.container.appendChild(stylePanel);
+
+ addClickHandler(label2, stylePanel, idx++);
+ }
+
+ // Adds button to hide the format panel since
+ // people don't seem to find the toolbar button
+ // and the menu item in the format menu
+ if (this.showCloseButton)
+ {
+ var label2 = label.cloneNode(false);
+ label2.style.borderLeftWidth = '1px';
+ label2.style.borderRightWidth = '1px';
+ label2.style.borderBottomWidth = '1px';
+ label2.style.backgroundColor = Format.inactiveTabBackgroundColor;
+ label2.style.position = 'absolute';
+ label2.style.right = '0px';
+ label2.style.top = '0px';
+ label2.style.width = '25px';
+
+ var img = document.createElement('img');
+ img.setAttribute('border', '0');
+ img.setAttribute('src', Dialog.prototype.closeImage);
+ img.setAttribute('title', mxResources.get('hide'));
+ img.style.position = 'absolute';
+ img.style.display = 'block';
+ img.style.right = '0px';
+ img.style.top = '8px';
+ img.style.cursor = 'pointer';
+ img.style.marginTop = '1px';
+ img.style.marginRight = '6px';
+ img.style.border = '1px solid transparent';
+ img.style.padding = '1px';
+ img.style.opacity = 0.5;
+ label2.appendChild(img)
+
+ mxEvent.addListener(img, 'click', function()
+ {
+ ui.actions.get('format').funct();
+ });
+
+ div.appendChild(label2);
+ }
+ }
+ else if (graph.isEditing())
+ {
+ mxUtils.write(label, mxResources.get('text'));
+ div.appendChild(label);
+ label.style.borderLeftStyle = 'none';
+ this.panels.push(new TextFormatPanel(this, ui, div));
+ }
+ else
+ {
+ label.style.backgroundColor = Format.inactiveTabBackgroundColor;
+ label.style.borderLeftWidth = '1px';
+ label.style.cursor = 'pointer';
+ label.style.width = ss.cells.length == 0 ? '100%' :
+ (containsLabel ? '50%' : '33.3%');
+ var label2 = label.cloneNode(false);
+ var label3 = label2.cloneNode(false);
+
+ // Workaround for ignored background in IE
+ label2.style.backgroundColor = Format.inactiveTabBackgroundColor;
+ label3.style.backgroundColor = Format.inactiveTabBackgroundColor;
+
+ // Style
+ if (containsLabel)
+ {
+ label2.style.borderLeftWidth = '0px';
+ }
+ else if (ss.cells.length > 0)
+ {
+ label.style.borderLeftWidth = '0px';
+ mxUtils.write(label, mxResources.get('style'));
+ div.appendChild(label);
+
+ var stylePanel = div.cloneNode(false);
+ stylePanel.style.display = 'none';
+ this.panels.push(new StyleFormatPanel(this, ui, stylePanel));
+ this.container.appendChild(stylePanel);
+
+ addClickHandler(label, stylePanel, idx++);
+ }
+
+ // Text
+ mxUtils.write(label2, mxResources.get('text'));
+ div.appendChild(label2);
+
+ var textPanel = div.cloneNode(false);
+ textPanel.style.display = 'none';
+ this.panels.push(new TextFormatPanel(this, ui, textPanel));
+ this.container.appendChild(textPanel);
+
+ // Arrange
+ mxUtils.write(label3, mxResources.get('arrange'));
+ div.appendChild(label3);
+
+ var arrangePanel = div.cloneNode(false);
+ arrangePanel.style.display = 'none';
+ this.panels.push(new ArrangePanel(this, ui, arrangePanel));
+ this.container.appendChild(arrangePanel);
+
+ if (ss.cells.length > 0)
+ {
+ addClickHandler(label2, textPanel, idx + 1);
+ }
+ else
+ {
+ label2.style.display = 'none';
+ }
+
+ addClickHandler(label3, arrangePanel, idx++, true);
+ }
+};
+
+/**
+ * Base class for format panels.
+ */
+BaseFormatPanel = function(format, editorUi, container)
+{
+ this.format = format;
+ this.editorUi = editorUi;
+ this.container = container;
+ this.listeners = [];
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.buttonBackgroundColor = 'transparent';
+
+/**
+ * Install input handler.
+ */
+BaseFormatPanel.prototype.installInputHandler = function(input, key, defaultValue, min, max, unit, textEditFallback, isFloat)
+{
+ unit = (unit != null) ? unit : '';
+ isFloat = (isFloat != null) ? isFloat : false;
+
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+
+ min = (min != null) ? min : 1;
+ max = (max != null) ? max : 999;
+
+ var selState = null;
+ var updating = false;
+
+ var update = mxUtils.bind(this, function(evt)
+ {
+ var value = (isFloat) ? parseFloat(input.value) : parseInt(input.value);
+
+ // Special case: angle mod 360
+ if (!isNaN(value) && key == mxConstants.STYLE_ROTATION)
+ {
+ // Workaround for decimal rounding errors in floats is to
+ // use integer and round all numbers to two decimal point
+ value = mxUtils.mod(Math.round(value * 100), 36000) / 100;
+ }
+
+ value = Math.min(max, Math.max(min, (isNaN(value)) ? defaultValue : value));
+
+ if (graph.cellEditor.isContentEditing() && textEditFallback)
+ {
+ if (!updating)
+ {
+ updating = true;
+
+ if (selState != null)
+ {
+ graph.cellEditor.restoreSelection(selState);
+ selState = null;
+ }
+
+ textEditFallback(value);
+ input.value = value + unit;
+
+ // Restore focus and selection in input
+ updating = false;
+ }
+ }
+ else if (value != mxUtils.getValue(ui.getSelectionState().style, key, defaultValue))
+ {
+ if (graph.isEditing())
+ {
+ graph.stopEditing(true);
+ }
+
+ graph.getModel().beginUpdate();
+ try
+ {
+ var cells = ui.getSelectionState().cells;
+ graph.setCellStyles(key, value, cells);
+
+ // Handles special case for fontSize where HTML labels are parsed and updated
+ if (key == mxConstants.STYLE_FONTSIZE)
+ {
+ graph.updateLabelElements(cells, function(elt)
+ {
+ elt.style.fontSize = value + 'px';
+ elt.removeAttribute('size');
+ });
+ }
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (graph.model.getChildCount(cells[i]) == 0)
+ {
+ graph.autoSizeCell(cells[i], false);
+ }
+ }
+
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', [key],
+ 'values', [value], 'cells', cells));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+ }
+
+ input.value = value + unit;
+ mxEvent.consume(evt);
+ });
+
+ if (textEditFallback && graph.cellEditor.isContentEditing())
+ {
+ // KNOWN: Arrow up/down clear selection text in quirks/IE 8
+ // Text size via arrow button limits to 16 in IE11. Why?
+ mxEvent.addListener(input, 'mousedown', function()
+ {
+ if (document.activeElement == graph.cellEditor.textarea)
+ {
+ selState = graph.cellEditor.saveSelection();
+ }
+ });
+
+ mxEvent.addListener(input, 'touchstart', function()
+ {
+ if (document.activeElement == graph.cellEditor.textarea)
+ {
+ selState = graph.cellEditor.saveSelection();
+ }
+ });
+ }
+
+ mxEvent.addListener(input, 'change', update);
+ mxEvent.addListener(input, 'blur', update);
+
+ return update;
+};
+
+/**
+ * Adds the given option.
+ */
+BaseFormatPanel.prototype.createPanel = function()
+{
+ var div = document.createElement('div');
+ div.className = 'geFormatSection';
+ div.style.padding = '12px 0px 8px 14px';
+
+ return div;
+};
+
+/**
+ * Adds the given option.
+ */
+BaseFormatPanel.prototype.createTitle = function(title)
+{
+ var div = document.createElement('div');
+ div.style.padding = '0px 0px 6px 0px';
+ div.style.whiteSpace = 'nowrap';
+ div.style.overflow = 'hidden';
+ div.style.width = '200px';
+ div.style.fontWeight = 'bold';
+ mxUtils.write(div, title);
+
+ return div;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addAction = function(div, name)
+{
+ var action = this.editorUi.actions.get(name);
+ var btn = null;
+
+ if (action != null && action.isEnabled())
+ {
+ btn = mxUtils.button(action.label, mxUtils.bind(this, function(evt)
+ {
+ try
+ {
+ action.funct(evt, evt);
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }));
+
+ var short = (action.shortcut != null) ? ' (' + action.shortcut + ')' : '';
+ btn.setAttribute('title', action.label + short);
+ btn.style.marginBottom = '2px';
+ btn.style.width = '210px';
+ div.appendChild(btn);
+ result = true;
+ }
+
+ return btn;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addActions = function(div, names)
+{
+ var lastBr = null;
+ var last = null;
+ var count = 0;
+
+ for (var i = 0; i < names.length; i++)
+ {
+ var btn = this.addAction(div, names[i]);
+
+ if (btn != null)
+ {
+ count++;
+
+ if (mxUtils.mod(count, 2) == 0)
+ {
+ last.style.marginRight = '2px';
+ last.style.width = '104px';
+ btn.style.width = '104px';
+ lastBr.parentNode.removeChild(lastBr);
+ }
+
+ lastBr = mxUtils.br(div);
+ last = btn;
+ }
+ }
+
+ return count;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.createStepper = function(input, update, step, height, disableFocus, defaultValue, isFloat)
+{
+ step = (step != null) ? step : 1;
+ height = (height != null) ? height : 9;
+ var bigStep = 10 * step;
+
+ var stepper = document.createElement('div');
+ stepper.className = 'geBtnStepper';
+ stepper.style.position = 'absolute';
+
+ var up = document.createElement('div');
+ up.style.position = 'relative';
+ up.style.height = height + 'px';
+ up.style.width = '10px';
+ up.className = 'geBtnUp';
+ stepper.appendChild(up);
+
+ var down = up.cloneNode(false);
+ down.style.border = 'none';
+ down.style.height = height + 'px';
+ down.className = 'geBtnDown';
+ stepper.appendChild(down);
+
+ mxEvent.addGestureListeners(down, function(evt)
+ {
+ // Stops text selection on shift+click
+ mxEvent.consume(evt);
+ }, null, function(evt)
+ {
+ if (input.value == '')
+ {
+ input.value = defaultValue || '2';
+ }
+
+ var val = isFloat? parseFloat(input.value) : parseInt(input.value);
+
+ if (!isNaN(val))
+ {
+ input.value = val - (mxEvent.isShiftDown(evt) ? bigStep : step);
+
+ if (update != null)
+ {
+ update(evt);
+ }
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ mxEvent.addGestureListeners(up, function(evt)
+ {
+ // Stops text selection on shift+click
+ mxEvent.consume(evt);
+ }, null, function(evt)
+ {
+ if (input.value == '')
+ {
+ input.value = defaultValue || '0';
+ }
+
+ var val = isFloat? parseFloat(input.value) : parseInt(input.value);
+
+ if (!isNaN(val))
+ {
+ input.value = val + (mxEvent.isShiftDown(evt) ? bigStep : step);
+
+ if (update != null)
+ {
+ update(evt);
+ }
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ // Disables transfer of focus to DIV but also :active CSS
+ // so it's only used for fontSize where the focus should
+ // stay on the selected text, but not for any other input.
+ if (disableFocus)
+ {
+ var currentSelection = null;
+
+ mxEvent.addGestureListeners(stepper,
+ function(evt)
+ {
+ mxEvent.consume(evt);
+ },
+ null,
+ function(evt)
+ {
+ // Workaround for lost current selection in page because of focus in IE
+ if (currentSelection != null)
+ {
+ try
+ {
+ currentSelection.select();
+ }
+ catch (e)
+ {
+ // ignore
+ }
+
+ currentSelection = null;
+ mxEvent.consume(evt);
+ }
+ }
+ );
+ }
+ else
+ {
+ // Stops propagation on checkbox labels
+ mxEvent.addListener(stepper, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+ }
+
+ return stepper;
+};
+
+/**
+ * Adds the given option.
+ */
+BaseFormatPanel.prototype.createOption = function(label, isCheckedFn, setCheckedFn, listener, fn)
+{
+ var div = document.createElement('div');
+ div.style.display = 'flex';
+ div.style.alignItems = 'center';
+ div.style.padding = '3px 0px 3px 0px';
+ div.style.height = '18px';
+
+ var cb = document.createElement('input');
+ cb.setAttribute('type', 'checkbox');
+ cb.style.margin = '1px 6px 0px 0px';
+ cb.style.verticalAlign = 'top';
+ div.appendChild(cb);
+
+ var elt = document.createElement('div');
+ elt.style.display = 'inline-block';
+ elt.style.whiteSpace = 'nowrap';
+ elt.style.textOverflow = 'ellipsis';
+ elt.style.overflow = 'hidden';
+ elt.style.maxWidth = '160px';
+ elt.style.maxWidth = '160px';
+ elt.style.userSelect = 'none';
+ mxUtils.write(elt, label);
+ div.appendChild(elt);
+
+ var applying = false;
+ var value = isCheckedFn();
+
+ var apply = function(newValue, evt)
+ {
+ if (!applying)
+ {
+ applying = true;
+
+ if (newValue)
+ {
+ cb.setAttribute('checked', 'checked');
+ cb.defaultChecked = true;
+ cb.checked = true;
+ }
+ else
+ {
+ cb.removeAttribute('checked');
+ cb.defaultChecked = false;
+ cb.checked = false;
+ }
+
+ if (value != newValue)
+ {
+ value = newValue;
+
+ // Checks if the color value needs to be updated in the model
+ if (isCheckedFn() != value)
+ {
+ setCheckedFn(value, evt);
+ }
+ }
+
+ applying = false;
+ }
+ };
+
+ mxEvent.addListener(div, 'click', function(evt)
+ {
+ if (cb.getAttribute('disabled') != 'disabled')
+ {
+ // Toggles checkbox state for click on label
+ var source = mxEvent.getSource(evt);
+
+ if (source == div || source == elt)
+ {
+ cb.checked = !cb.checked;
+ }
+
+ apply(cb.checked, evt);
+ }
+ });
+
+ apply(value);
+
+ if (listener != null)
+ {
+ listener.install(apply);
+ this.listeners.push(listener);
+ }
+
+ if (fn != null)
+ {
+ fn(div);
+ }
+
+ return div;
+};
+
+/**
+ * The string 'null' means use null in values.
+ */
+BaseFormatPanel.prototype.createCellOption = function(label, key, defaultValue, enabledValue, disabledValue, fn, action, stopEditing, cells)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ enabledValue = (enabledValue != null) ? ((enabledValue == 'null') ? null : enabledValue) : 1;
+ disabledValue = (disabledValue != null) ? ((disabledValue == 'null') ? null : disabledValue) : 0;
+
+ var style = (cells != null) ? graph.getCommonStyle(cells) : ui.getSelectionState().style;
+
+ return this.createOption(label, function()
+ {
+ return mxUtils.getValue(style, key, defaultValue) != disabledValue;
+ }, function(checked)
+ {
+ if (stopEditing)
+ {
+ graph.stopEditing();
+ }
+
+ if (action != null)
+ {
+ action.funct();
+ }
+ else
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var temp = (cells != null) ? cells : ui.getSelectionState().cells;
+ var value = (checked) ? enabledValue : disabledValue;
+ graph.setCellStyles(key, value, temp);
+
+ if (fn != null)
+ {
+ fn(temp, value);
+ }
+
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys',
+ [key], 'values', [value], 'cells', temp));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+ }
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(mxUtils.getValue(style, key, defaultValue) != disabledValue);
+ };
+
+ graph.getModel().addListener(mxEvent.CHANGE, this.listener);
+ },
+ destroy: function()
+ {
+ graph.getModel().removeListener(this.listener);
+ }
+ });
+};
+
+/**
+ * Adds the given color option.
+ */
+BaseFormatPanel.prototype.createColorOption = function(label, getColorFn, setColorFn,
+ defaultColor, listener, callbackFn, hideCheckbox, defaultColorValue)
+{
+ var graph = this.editorUi.editor.graph;
+
+ var div = document.createElement('div');
+ div.style.padding = '3px 0px 3px 0px';
+ div.style.whiteSpace = 'nowrap';
+ div.style.overflow = 'hidden';
+ div.style.width = '200px';
+ div.style.height = '18px';
+
+ var cb = document.createElement('input');
+ cb.setAttribute('type', 'checkbox');
+ cb.style.margin = '1px 6px 0px 0px';
+ cb.style.verticalAlign = 'top';
+
+ if (!hideCheckbox)
+ {
+ div.appendChild(cb);
+ }
+
+ var span = document.createElement('span');
+ span.style.verticalAlign = 'top';
+ mxUtils.write(span, label);
+ div.appendChild(span);
+
+ var value = getColorFn();
+ var applying = false;
+ var dropper = null;
+ var btn = null;
+
+ var clrInput = document.createElement('input');
+ clrInput.setAttribute('type', 'color');
+ clrInput.style.position = 'relative';
+ clrInput.style.visibility = 'hidden';
+ clrInput.style.top = '10px';
+ clrInput.style.width = '0px';
+ clrInput.style.height = '0px';
+ clrInput.style.border = 'none';
+
+ // Adds native color dialog
+ if (!mxClient.IS_IE && !mxClient.IS_IE11 && !mxClient.IS_TOUCH)
+ {
+ dropper = document.createElement('img');
+ dropper.src = Editor.colorDropperImage;
+ dropper.className = 'geColorDropper geAdaptiveAsset';
+ dropper.style.position = 'relative';
+ dropper.style.right = '-20px';
+ dropper.style.top = '-1px';
+ dropper.style.width = 'auto';
+ dropper.style.height = '14px';
+
+ mxEvent.addListener(dropper, 'click', function(evt)
+ {
+ var color = value;
+
+ if (color == 'default')
+ {
+ color = defaultColorValue;
+ }
+
+ clrInput.value = color;
+ clrInput.click();
+
+ mxEvent.consume(evt);
+ });
+ }
+
+ var apply = function(color, disableUpdate, forceUpdate)
+ {
+ if (!applying)
+ {
+ var defaultValue = (defaultColor == 'null') ? null : defaultColor;
+
+ applying = true;
+ color = (/(^#?[a-zA-Z0-9]*$)/.test(color)) ? color : defaultValue;
+ var tempColor = (color != null && color != mxConstants.NONE) ? color : defaultValue;
+
+ var div = document.createElement('div');
+ div.style.width = '21px';
+ div.style.height = '12px';
+ div.style.margin = '2px 18px 2px 3px';
+ div.style.border = '1px solid black';
+ div.style.backgroundColor = (tempColor == 'default') ? defaultColorValue : tempColor;
+ btn.innerText = '';
+ btn.appendChild(div);
+
+ if (dropper != null)
+ {
+ div.style.width = '21px';
+ div.style.margin = '2px 18px 2px 3px';
+ div.appendChild(dropper);
+ }
+ else
+ {
+ div.style.width = '36px';
+ div.style.margin = '3px';
+ }
+
+ if (color != null && color != mxConstants.NONE && color.length > 1 && typeof color === 'string')
+ {
+ var clr = (color.charAt(0) == '#') ? color.substring(1).toUpperCase() : color;
+ var name = ColorDialog.prototype.colorNames[clr];
+
+ if (name != null)
+ {
+ btn.setAttribute('title', name);
+ }
+ }
+
+ if (color != null && color != mxConstants.NONE &&
+ !graph.isSpecialColor(color))
+ {
+ cb.setAttribute('checked', 'checked');
+ cb.defaultChecked = true;
+ cb.checked = true;
+ }
+ else
+ {
+ cb.removeAttribute('checked');
+ cb.defaultChecked = false;
+ cb.checked = false;
+ }
+
+ btn.style.display = (cb.checked || hideCheckbox) ? '' : 'none';
+
+ if (callbackFn != null)
+ {
+ callbackFn(color == 'null' ? null : color);
+ }
+
+ value = color;
+
+ if (!disableUpdate)
+ {
+ // Checks if the color value needs to be updated in the model
+ if (forceUpdate || hideCheckbox || getColorFn() != value)
+ {
+ setColorFn(value == 'null' ? null : value, value);
+ }
+ }
+
+ applying = false;
+ }
+ };
+
+ div.appendChild(clrInput);
+
+ mxEvent.addListener(clrInput, 'change', function()
+ {
+ apply(clrInput.value, null, true);
+ });
+
+ btn = mxUtils.button('', mxUtils.bind(this, function(evt)
+ {
+ var color = value;
+
+ if (color == 'default')
+ {
+ color = defaultColorValue;
+ }
+
+ this.editorUi.pickColor(color, function(newColor)
+ {
+ apply(newColor, null, true);
+ }, defaultColorValue);
+
+ mxEvent.consume(evt);
+ }));
+
+ btn.style.position = 'absolute';
+ btn.style.marginTop = '-3px';
+ btn.style.left = '178px';
+ btn.style.height = '22px';
+ btn.className = 'geColorBtn';
+ btn.style.display = (cb.checked || hideCheckbox) ? '' : 'none';
+ div.appendChild(btn);
+
+ var clr = (value != null && typeof value === 'string' && value.charAt(0) == '#') ? value.substring(1).toUpperCase() : value;
+ var name = ColorDialog.prototype.colorNames[clr];
+
+ if (name != null)
+ {
+ btn.setAttribute('title', name);
+ }
+
+ mxEvent.addListener(div, 'click', function(evt)
+ {
+ var source = mxEvent.getSource(evt);
+
+ if (source == cb || source.nodeName != 'INPUT')
+ {
+ // Toggles checkbox state for click on label
+ if (source != cb)
+ {
+ cb.checked = !cb.checked;
+ }
+
+ // Overrides default value with current value to make it easier
+ // to restore previous value if the checkbox is clicked twice
+ if (!cb.checked && value != null && value != mxConstants.NONE &&
+ defaultColor != mxConstants.NONE)
+ {
+ defaultColor = value;
+ }
+
+ apply((cb.checked) ? defaultColor : mxConstants.NONE);
+ }
+ });
+
+ apply(value, true);
+
+ if (listener != null)
+ {
+ listener.install(apply);
+ this.listeners.push(listener);
+ }
+
+ return div;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.createCellColorOption = function(label, colorKey, defaultColor, callbackFn, setStyleFn, defaultColorValue)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ return this.createColorOption(label, function()
+ {
+ // Seems to be null sometimes, not sure why...
+ var state = graph.view.getState(ui.getSelectionState().cells[0]);
+
+ if (state != null)
+ {
+ return mxUtils.getValue(state.style, colorKey, null);
+ }
+
+ return null;
+ }, function(color)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var cells = ui.getSelectionState().cells;
+ graph.setCellStyles(colorKey, color, cells);
+
+ if (setStyleFn != null)
+ {
+ setStyleFn(color);
+ }
+
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', [colorKey],
+ 'values', [color], 'cells', cells));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+ }, defaultColor || mxConstants.NONE,
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ // Seems to be null sometimes, not sure why...
+ var state = graph.view.getState(ui.getSelectionState().cells[0]);
+
+ if (state != null)
+ {
+ apply(mxUtils.getValue(state.style, colorKey, null), true);
+ }
+ };
+
+ graph.getModel().addListener(mxEvent.CHANGE, this.listener);
+ },
+ destroy: function()
+ {
+ graph.getModel().removeListener(this.listener);
+ }
+ }, callbackFn, null, defaultColorValue);
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addArrow = function(elt)
+{
+ elt.className = 'geColorBtn';
+ elt.style.display = 'inline-flex';
+ elt.style.alignItems = 'top';
+ elt.style.boxSizing = 'border-box';
+ elt.style.width = '64px';
+ elt.style.height = '22px';
+ elt.style.borderWidth = '1px';
+ elt.style.borderStyle = 'solid';
+ elt.style.margin = '2px 2px 2px 3px';
+
+ var arrow = document.createElement('div');
+ arrow.className = 'geAdaptiveAsset';
+ arrow.style.display = 'inline-block';
+ arrow.style.backgroundImage = 'url(' + Editor.thinExpandImage + ')';
+ arrow.style.backgroundRepeat = 'no-repeat';
+ arrow.style.backgroundPosition = '-2px 1px';
+ arrow.style.backgroundSize = '18px 18px';
+ arrow.style.opacity = '0.5';
+ arrow.style.height = '100%';
+ arrow.style.width = '14px';
+
+ elt.appendChild(arrow);
+
+ var symbol = elt.getElementsByTagName('div')[0];
+
+ if (symbol != null)
+ {
+ symbol.style.display = 'inline-block';
+ symbol.style.backgroundPositionX = 'center';
+ symbol.style.textAlign = 'center';
+ symbol.style.height = '100%';
+ symbol.style.flexGrow = '1';
+ symbol.style.opacity = '0.6';
+ }
+
+ return symbol;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addUnitInput = function(container, unit, right, width, update, step, marginTop, disableFocus, isFloat)
+{
+ marginTop = (marginTop != null) ? marginTop : 0;
+
+ var input = document.createElement('input');
+ input.style.position = 'absolute';
+ input.style.textAlign = 'right';
+ input.style.marginTop = '-2px';
+ input.style.left = (228 - right - width) + 'px';
+ input.style.width = width + 'px';
+ input.style.height = '21px';
+ input.style.borderWidth = '1px';
+ input.style.borderStyle = 'solid';
+ input.style.boxSizing = 'border-box';
+
+ container.appendChild(input);
+
+ var stepper = this.createStepper(input, update, step, null, disableFocus, null, isFloat);
+ stepper.style.marginTop = (marginTop - 2) + 'px';
+ stepper.style.left = (228 - right) + 'px';
+ container.appendChild(stepper);
+
+ return input;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addGenericInput = function(container, unit, left, width, readFn, writeFn)
+{
+ var graph = this.editorUi.editor.graph;
+
+ var update = function()
+ {
+ writeFn(input.value);
+ };
+
+ var input = this.addUnitInput(container, unit, left, width, update);
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ if (force || input != document.activeElement)
+ {
+ input.value = readFn() + unit;
+ }
+ });
+
+ mxEvent.addListener(input, 'keydown', function(e)
+ {
+ if (e.keyCode == 13)
+ {
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ else if (e.keyCode == 27)
+ {
+ listener(null, null, true);
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+
+ return input;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.createRelativeOption = function(label, key, width, handler, init)
+{
+ width = (width != null) ? width : 52;
+
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var div = this.createPanel();
+ div.style.paddingTop = '10px';
+ div.style.paddingBottom = '12px';
+ mxUtils.write(div, label);
+ div.style.fontWeight = 'bold';
+
+ var update = mxUtils.bind(this, function(evt)
+ {
+ if (handler != null)
+ {
+ handler(input);
+ }
+ else
+ {
+ var value = parseInt(input.value);
+ value = Math.min(100, Math.max(0, (isNaN(value)) ? 100 : value));
+ var state = graph.view.getState(ui.getSelectionState().cells[0]);
+
+ if (state != null && value != mxUtils.getValue(state.style, key, 100))
+ {
+ // Removes entry in style (assumes 100 is default for relative values)
+ if (value == 100)
+ {
+ value = null;
+ }
+
+ var cells = ui.getSelectionState().cells;
+ graph.setCellStyles(key, value, cells);
+ this.editorUi.fireEvent(new mxEventObject('styleChanged', 'keys', [key],
+ 'values', [value], 'cells', cells));
+ }
+
+ input.value = ((value != null) ? value : '100') + ' %';
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ var input = this.addUnitInput(div, '%', 16, width, update, 10,
+ (mxClient.IS_MAC && mxClient.IS_GC) ? -14 :
+ ((mxClient.IS_WIN) ? -16 : -15), handler != null);
+
+ if (key != null)
+ {
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ if (force || input != document.activeElement)
+ {
+ var ss = ui.getSelectionState();
+ var tmp = parseInt(mxUtils.getValue(ss.style, key, 100));
+ input.value = (isNaN(tmp)) ? '' : tmp + ' %';
+ }
+ });
+
+ mxEvent.addListener(input, 'keydown', function(e)
+ {
+ if (e.keyCode == 13)
+ {
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ else if (e.keyCode == 27)
+ {
+ listener(null, null, true);
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+ }
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+
+ if (init != null)
+ {
+ init(input);
+ }
+
+ return div;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addLabel = function(div, title, right, width)
+{
+ width = (width != null) ? width : 61;
+
+ var label = document.createElement('div');
+ mxUtils.write(label, title);
+ label.style.position = 'absolute';
+ label.style.left = (240 - right - width) + 'px';
+ label.style.width = width + 'px';
+ label.style.marginTop = '6px';
+ label.style.display = 'flex';
+ label.style.justifyContent = 'center';
+ div.appendChild(label);
+
+ return label;
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.addKeyHandler = function(input, listener)
+{
+ mxEvent.addListener(input, 'keydown', mxUtils.bind(this, function(e)
+ {
+ if (e.keyCode == 13)
+ {
+ this.editorUi.editor.graph.container.focus();
+ mxEvent.consume(e);
+ }
+ else if (e.keyCode == 27)
+ {
+ if (listener != null)
+ {
+ listener(null, null, true);
+ }
+
+ this.editorUi.editor.graph.container.focus();
+ mxEvent.consume(e);
+ }
+ }));
+};
+
+/**
+ *
+ */
+BaseFormatPanel.prototype.styleButtons = function(elts)
+{
+ for (var i = 0; i < elts.length; i++)
+ {
+ mxUtils.setPrefixedStyle(elts[i].style, 'borderRadius', '3px');
+ mxUtils.setOpacity(elts[i], 100);
+ elts[i].style.border = '1px solid #a0a0a0';
+ elts[i].style.padding = '4px';
+ elts[i].style.paddingTop = '3px';
+ elts[i].style.paddingRight = '1px';
+ elts[i].style.margin = '1px';
+ elts[i].style.marginRight = '2px';
+ elts[i].style.width = '24px';
+ elts[i].style.height = '20px';
+ elts[i].className += ' geColorBtn';
+ }
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+BaseFormatPanel.prototype.destroy = function()
+{
+ if (this.listeners != null)
+ {
+ for (var i = 0; i < this.listeners.length; i++)
+ {
+ this.listeners[i].destroy();
+ }
+
+ this.listeners = null;
+ }
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+ArrangePanel = function(format, editorUi, container)
+{
+ BaseFormatPanel.call(this, format, editorUi, container);
+ this.init();
+};
+
+mxUtils.extend(ArrangePanel, BaseFormatPanel);
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+ArrangePanel.prototype.init = function()
+{
+ var ss = this.editorUi.getSelectionState();
+
+ if (ss.cells.length > 0)
+ {
+ this.container.appendChild(this.addLayerOps(this.createPanel()));
+
+ // Special case that adds two panels
+ this.addGeometry(this.container);
+ this.addEdgeGeometry(this.container);
+
+ if (!ss.containsLabel || ss.edges.length == 0)
+ {
+ this.container.appendChild(this.addAngle(this.createPanel()));
+ }
+
+ if (!ss.containsLabel)
+ {
+ this.container.appendChild(this.addFlip(this.createPanel()));
+ }
+
+ this.container.appendChild(this.addAlign(this.createPanel()));
+
+ if (ss.vertices.length > 1 && !ss.cell && !ss.row)
+ {
+ this.container.appendChild(this.addDistribute(this.createPanel()));
+ }
+
+ this.container.appendChild(this.addTable(this.createPanel()));
+ }
+
+ // Allows to lock/unload button to be added
+ this.container.appendChild(this.addGroupOps(this.createPanel()));
+
+ if (ss.containsLabel)
+ {
+ // Adds functions from hidden style format panel
+ var span = document.createElement('div');
+ span.style.width = '100%';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+ span.style.padding = '10px 0 0 14px';
+ mxUtils.write(span, mxResources.get('style'));
+ this.container.appendChild(span);
+
+ new StyleFormatPanel(this.format, this.editorUi, this.container);
+ }
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addTable = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var ss = ui.getSelectionState();
+ div.style.paddingTop = '6px';
+ div.style.paddingBottom = '10px';
+
+ var span = document.createElement('div');
+ span.style.marginTop = '0px';
+ span.style.marginBottom = '6px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('table'));
+ div.appendChild(span);
+
+ var panel = document.createElement('div');
+ panel.style.position = 'relative';
+ panel.style.paddingLeft = '0px';
+ panel.style.borderWidth = '0px';
+ panel.style.width = '220px';
+ panel.className = 'geToolbarContainer';
+
+ var cell = ss.vertices[0];
+
+ if (graph.getSelectionCount() > 1)
+ {
+ if (graph.isTableCell(cell))
+ {
+ cell = graph.model.getParent(cell);
+ }
+
+ if (graph.isTableRow(cell))
+ {
+ cell = graph.model.getParent(cell);
+ }
+ }
+
+ var isTable = ss.table || ss.row || ss.cell;
+ var isStack = graph.isStack(cell) ||
+ graph.isStackChild(cell);
+
+ var showCols = isTable;
+ var showRows = isTable;
+
+ if (isStack)
+ {
+ var style = (graph.isStack(cell)) ? ss.style :
+ graph.getCellStyle(graph.model.getParent(cell));
+
+ showRows = style['horizontalStack'] == '0';
+ showCols = !showRows;
+ }
+
+ var btns = [];
+
+ if (showCols)
+ {
+ btns = btns.concat([
+ ui.toolbar.addButton('geSprite-insertcolumnbefore', mxResources.get('insertColumnBefore'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.insertLane(cell, true);
+ }
+ else
+ {
+ graph.insertTableColumn(cell, true);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel),
+ ui.toolbar.addButton('geSprite-insertcolumnafter', mxResources.get('insertColumnAfter'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.insertLane(cell, false);
+ }
+ else
+ {
+ graph.insertTableColumn(cell, false);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel),
+ ui.toolbar.addButton('geSprite-deletecolumn', mxResources.get('deleteColumn'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.deleteLane(cell);
+ }
+ else
+ {
+ graph.deleteTableColumn(cell);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel)]);
+ }
+
+ if (showRows)
+ {
+ btns = btns.concat([ui.toolbar.addButton('geSprite-insertrowbefore', mxResources.get('insertRowBefore'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.insertLane(cell, true);
+ }
+ else
+ {
+ graph.insertTableRow(cell, true);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel),
+ ui.toolbar.addButton('geSprite-insertrowafter', mxResources.get('insertRowAfter'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.insertLane(cell, false);
+ }
+ else
+ {
+ graph.insertTableRow(cell, false);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel),
+ ui.toolbar.addButton('geSprite-deleterow', mxResources.get('deleteRow'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (isStack)
+ {
+ graph.deleteLane(cell);
+ }
+ else
+ {
+ graph.deleteTableRow(cell);
+ }
+ }
+ catch (e)
+ {
+ ui.handleError(e);
+ }
+ }), panel)]);
+ }
+
+ if (btns.length > 0)
+ {
+ this.styleButtons(btns);
+ div.appendChild(panel);
+
+ if (btns.length > 3)
+ {
+ btns[2].style.marginRight = '10px';
+ }
+
+ var count = 0;
+
+ if (ss.mergeCell != null)
+ {
+ count += this.addActions(div, ['mergeCells']);
+ }
+ else if (ss.style['colspan'] > 1 || ss.style['rowspan'] > 1)
+ {
+ count += this.addActions(div, ['unmergeCells']);
+ }
+
+ if (count > 0)
+ {
+ panel.style.paddingBottom = '2px';
+ }
+ }
+ else
+ {
+ div.style.display = 'none';
+ }
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addLayerOps = function(div)
+{
+ this.addActions(div, ['toFront', 'toBack']);
+ this.addActions(div, ['bringForward', 'sendBackward']);
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addGroupOps = function(div)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var ss = ui.getSelectionState();
+
+ div.style.paddingTop = '8px';
+ div.style.paddingBottom = '6px';
+
+ var count = 0;
+
+ if (!ss.cell && !ss.row)
+ {
+ count += this.addActions(div, ['group', 'ungroup', 'copySize', 'pasteSize']) +
+ this.addActions(div, ['removeFromGroup']);
+ }
+
+ var clearWaypoints = this.addAction(div, 'clearWaypoints');
+
+ if (clearWaypoints != null)
+ {
+ mxUtils.br(div);
+ clearWaypoints.setAttribute('title', mxResources.get('clearWaypoints') +
+ ' (' + this.editorUi.actions.get('clearWaypoints').shortcut + ')' +
+ ' Shift+Click to Clear Anchor Points');
+ count++;
+ }
+
+ count += this.addActions(div, ['lockUnlock']);
+
+ if (count == 0)
+ {
+ div.style.display = 'none';
+ }
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addAlign = function(div)
+{
+ var ss = this.editorUi.getSelectionState();
+ var graph = this.editorUi.editor.graph;
+ div.style.paddingTop = '6px';
+ div.style.paddingBottom = '8px';
+ div.appendChild(this.createTitle(mxResources.get('align')));
+
+ var stylePanel = document.createElement('div');
+ stylePanel.style.position = 'relative';
+ stylePanel.style.whiteSpace = 'nowrap';
+ stylePanel.style.paddingLeft = '0px';
+ stylePanel.style.paddingBottom = '2px';
+ stylePanel.style.borderWidth = '0px';
+ stylePanel.style.width = '220px';
+ stylePanel.className = 'geToolbarContainer';
+
+ if (ss.vertices.length > 1)
+ {
+ var left = this.editorUi.toolbar.addButton('geSprite-alignleft', mxResources.get('left'),
+ function() { graph.alignCells(mxConstants.ALIGN_LEFT); }, stylePanel);
+ var center = this.editorUi.toolbar.addButton('geSprite-aligncenter', mxResources.get('center'),
+ function() { graph.alignCells(mxConstants.ALIGN_CENTER); }, stylePanel);
+ var right = this.editorUi.toolbar.addButton('geSprite-alignright', mxResources.get('right'),
+ function() { graph.alignCells(mxConstants.ALIGN_RIGHT); }, stylePanel);
+
+ var top = this.editorUi.toolbar.addButton('geSprite-aligntop', mxResources.get('top'),
+ function() { graph.alignCells(mxConstants.ALIGN_TOP); }, stylePanel);
+ var middle = this.editorUi.toolbar.addButton('geSprite-alignmiddle', mxResources.get('middle'),
+ function() { graph.alignCells(mxConstants.ALIGN_MIDDLE); }, stylePanel);
+ var bottom = this.editorUi.toolbar.addButton('geSprite-alignbottom', mxResources.get('bottom'),
+ function() { graph.alignCells(mxConstants.ALIGN_BOTTOM); }, stylePanel);
+
+ this.styleButtons([left, center, right, top, middle, bottom]);
+ right.style.marginRight = '10px';
+ }
+
+ div.appendChild(stylePanel);
+ this.addActions(div, ['snapToGrid']);
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addFlip = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ div.style.paddingTop = '6px';
+ div.style.paddingBottom = '10px';
+ var ss = this.editorUi.getSelectionState();
+
+ var span = document.createElement('div');
+ span.style.marginTop = '2px';
+ span.style.marginBottom = '8px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('flip'));
+ div.appendChild(span);
+
+ var btn = mxUtils.button(mxResources.get('horizontal'), function(evt)
+ {
+ graph.flipCells(ss.cells, true);
+ })
+
+ btn.setAttribute('title', mxResources.get('horizontal'));
+ btn.style.width = '104px';
+ btn.style.marginRight = '2px';
+ div.appendChild(btn);
+
+ var btn = mxUtils.button(mxResources.get('vertical'), function(evt)
+ {
+ graph.flipCells(ss.cells, false);
+ })
+
+ btn.setAttribute('title', mxResources.get('vertical'));
+ btn.style.width = '104px';
+ div.appendChild(btn);
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addDistribute = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ div.style.paddingTop = '6px';
+ div.style.paddingBottom = '8px';
+
+ div.appendChild(this.createTitle(mxResources.get('distribute')));
+
+ var btn = mxUtils.button(mxResources.get('horizontal'), function(evt)
+ {
+ graph.distributeCells(true, null, cb.checked);
+ })
+
+ btn.setAttribute('title', mxResources.get('horizontal'));
+ btn.style.width = '104px';
+ btn.style.marginRight = '2px';
+ div.appendChild(btn);
+
+ var btn = mxUtils.button(mxResources.get('vertical'), function(evt)
+ {
+ graph.distributeCells(false, null, cb.checked);
+ })
+
+ btn.setAttribute('title', mxResources.get('vertical'));
+ btn.style.width = '104px';
+ div.appendChild(btn);
+
+ mxUtils.br(div);
+
+ var panel = document.createElement('div');
+ panel.style.margin = '6px 0 0 0';
+ panel.style.display = 'flex';
+ panel.style.justifyContent = 'center';
+ panel.style.alignItems = 'center';
+
+ var cb = document.createElement('input');
+ cb.setAttribute('type', 'checkbox');
+ cb.setAttribute('id', 'spacingCheckbox');
+ cb.style.margin = '0 6px 0 0';
+ panel.appendChild(cb);
+
+ var label = document.createElement('label');
+ label.style.verticalAlign = 'top';
+ label.setAttribute('for', 'spacingCheckbox');
+ label.style.userSelect = 'none';
+ mxUtils.write(label, mxResources.get('spacing'));
+ panel.appendChild(label);
+ div.appendChild(panel);
+
+ return div;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addAngle = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var ss = ui.getSelectionState();
+
+ div.style.paddingBottom = '12px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+
+ var input = null;
+ var update = null;
+ var btn = null;
+
+ if (ss.rotatable && !ss.table && !ss.row && !ss.cell)
+ {
+ mxUtils.write(span, mxResources.get('angle'));
+ div.appendChild(span);
+
+ input = this.addUnitInput(div, '°', 16, 52, function()
+ {
+ update.apply(this, arguments);
+ });
+
+ mxUtils.br(div);
+ div.style.paddingTop = '10px';
+ }
+ else
+ {
+ div.style.paddingTop = '8px';
+ }
+
+ if (!ss.containsLabel)
+ {
+ var label = mxResources.get('reverse');
+
+ if (ss.vertices.length > 0 && ss.edges.length > 0)
+ {
+ label = mxResources.get('turn') + ' / ' + label;
+ }
+ else if (ss.vertices.length > 0)
+ {
+ label = mxResources.get('turn');
+ }
+
+ btn = mxUtils.button(label, function(evt)
+ {
+ ui.actions.get('turn').funct(evt);
+ })
+
+ btn.setAttribute('title', label + ' (' + this.editorUi.actions.get('turn').shortcut + ')');
+ btn.style.width = '210px';
+ div.appendChild(btn);
+
+ if (input != null)
+ {
+ btn.style.marginTop = '8px';
+ }
+ }
+
+ if (input != null)
+ {
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ if (force || document.activeElement != input)
+ {
+ ss = ui.getSelectionState();
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_ROTATION, 0));
+ input.value = (isNaN(tmp)) ? '' : tmp + '°';
+ }
+ });
+
+ update = this.installInputHandler(input, mxConstants.STYLE_ROTATION, 0, 0, 360, '°', null, true);
+ this.addKeyHandler(input, listener);
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+ }
+
+ return div;
+};
+
+BaseFormatPanel.prototype.getUnit = function()
+{
+ var unit = this.editorUi.editor.graph.view.unit;
+
+ switch(unit)
+ {
+ case mxConstants.POINTS:
+ return 'pt';
+ case mxConstants.INCHES:
+ return '"';
+ case mxConstants.MILLIMETERS:
+ return 'mm';
+ case mxConstants.METERS:
+ return 'm';
+ }
+};
+
+BaseFormatPanel.prototype.inUnit = function(pixels)
+{
+ return this.editorUi.editor.graph.view.formatUnitText(pixels);
+};
+
+BaseFormatPanel.prototype.fromUnit = function(value)
+{
+ var unit = this.editorUi.editor.graph.view.unit;
+
+ switch(unit)
+ {
+ case mxConstants.POINTS:
+ return value;
+ case mxConstants.INCHES:
+ return value * mxConstants.PIXELS_PER_INCH;
+ case mxConstants.MILLIMETERS:
+ return value * mxConstants.PIXELS_PER_MM;
+ case mxConstants.METERS:
+ return value * mxConstants.PIXELS_PER_MM * 1000;
+ }
+};
+
+BaseFormatPanel.prototype.isFloatUnit = function()
+{
+ return this.editorUi.editor.graph.view.unit != mxConstants.POINTS;
+};
+
+BaseFormatPanel.prototype.getUnitStep = function()
+{
+ var unit = this.editorUi.editor.graph.view.unit;
+
+ switch(unit)
+ {
+ case mxConstants.POINTS:
+ return 1;
+ case mxConstants.INCHES:
+ return 0.1;
+ case mxConstants.MILLIMETERS:
+ return 0.5;
+ case mxConstants.METERS:
+ return 0.001;
+ }
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addGeometry = function(container)
+{
+ var panel = this;
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var model = graph.getModel();
+ var rect = ui.getSelectionState();
+
+ var div = this.createPanel();
+ div.style.paddingBottom = '8px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '50px';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('size'));
+ div.appendChild(span);
+
+ var widthUpdate, heightUpdate, leftUpdate, topUpdate;
+ var width = this.addUnitInput(div, this.getUnit(), 87, 52, function()
+ {
+ widthUpdate.apply(this, arguments);
+ }, this.getUnitStep(), null, null, this.isFloatUnit());
+ var height = this.addUnitInput(div, this.getUnit(), 16, 52, function()
+ {
+ heightUpdate.apply(this, arguments);
+ }, this.getUnitStep(), null, null, this.isFloatUnit());
+
+ var autosizeBtn = document.createElement('div');
+ autosizeBtn.className = 'geSprite geSprite-fit';
+ autosizeBtn.setAttribute('title', mxResources.get('autosize') + ' (' + this.editorUi.actions.get('autosize').shortcut + ')');
+ autosizeBtn.style.position = 'relative';
+ autosizeBtn.style.cursor = 'pointer';
+ autosizeBtn.style.marginTop = '-3px';
+ autosizeBtn.style.border = '0px';
+ autosizeBtn.style.left = '42px';
+ mxUtils.setOpacity(autosizeBtn, 50);
+
+ mxEvent.addListener(autosizeBtn, 'mouseenter', function()
+ {
+ mxUtils.setOpacity(autosizeBtn, 100);
+ });
+
+ mxEvent.addListener(autosizeBtn, 'mouseleave', function()
+ {
+ mxUtils.setOpacity(autosizeBtn, 50);
+ });
+
+ mxEvent.addListener(autosizeBtn, 'click', function()
+ {
+ ui.actions.get('autosize').funct();
+ });
+
+ div.appendChild(autosizeBtn);
+
+ if (rect.row)
+ {
+ width.style.visibility = 'hidden';
+ width.nextSibling.style.visibility = 'hidden';
+ }
+ else
+ {
+ this.addLabel(div, mxResources.get('width'), 87, 64);
+ }
+
+ this.addLabel(div, mxResources.get('height'), 16, 64);
+ mxUtils.br(div);
+
+ var wrapper = document.createElement('div');
+ wrapper.style.paddingTop = '8px';
+ wrapper.style.paddingRight = '20px';
+ wrapper.style.whiteSpace = 'nowrap';
+ wrapper.style.textAlign = 'right';
+ var opt = this.createCellOption(mxResources.get('constrainProportions'),
+ mxConstants.STYLE_ASPECT, null, 'fixed', 'null');
+ opt.style.width = '210px';
+ wrapper.appendChild(opt);
+
+ if (!rect.cell && !rect.row)
+ {
+ div.appendChild(wrapper);
+ }
+ else
+ {
+ autosizeBtn.style.visibility = 'hidden';
+ }
+
+ var constrainCheckbox = opt.getElementsByTagName('input')[0];
+ this.addKeyHandler(width, listener);
+ this.addKeyHandler(height, listener);
+
+ widthUpdate = this.addGeometryHandler(width, function(geo, value, cell)
+ {
+ if (graph.isTableCell(cell))
+ {
+ graph.setTableColumnWidth(cell, value - geo.width, true);
+
+ // Blocks processing in caller
+ return true;
+ }
+ else if (geo.width > 0)
+ {
+ var value = Math.max(1, panel.fromUnit(value));
+
+ if (constrainCheckbox.checked)
+ {
+ geo.height = Math.round((geo.height * value * 100) / geo.width) / 100;
+ }
+
+ geo.width = value;
+ }
+ });
+ heightUpdate = this.addGeometryHandler(height, function(geo, value, cell)
+ {
+ if (graph.isTableCell(cell))
+ {
+ cell = model.getParent(cell);
+ }
+
+ if (graph.isTableRow(cell))
+ {
+ graph.setTableRowHeight(cell, value - geo.height);
+
+ // Blocks processing in caller
+ return true;
+ }
+ else if (geo.height > 0)
+ {
+ var value = Math.max(1, panel.fromUnit(value));
+
+ if (constrainCheckbox.checked)
+ {
+ geo.width = Math.round((geo.width * value * 100) / geo.height) / 100;
+ }
+
+ geo.height = value;
+ }
+ });
+
+ if (rect.resizable || rect.row || rect.cell)
+ {
+ container.appendChild(div);
+ }
+
+ var div2 = this.createPanel();
+ div2.style.paddingBottom = '30px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('position'));
+ div2.appendChild(span);
+
+ var left = this.addUnitInput(div2, this.getUnit(), 87, 52, function()
+ {
+ leftUpdate.apply(this, arguments);
+ }, this.getUnitStep(), null, null, this.isFloatUnit());
+ var top = this.addUnitInput(div2, this.getUnit(), 16, 52, function()
+ {
+ topUpdate.apply(this, arguments);
+ }, this.getUnitStep(), null, null, this.isFloatUnit());
+
+ mxUtils.br(div2);
+
+ var coordinateLabels = true;
+ var dx = null;
+ var dy = null;
+
+ if (rect.movable)
+ {
+ if (rect.edges.length == 0 && rect.vertices.length == 1)
+ {
+ var geo = graph.getCellGeometry(rect.vertices[0]);
+
+ if (geo != null && geo.relative)
+ {
+ mxUtils.br(div2);
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ mxUtils.write(span, mxResources.get('relative'));
+ div2.appendChild(span);
+
+ dx = this.addGenericInput(div2, ' %', 87, 52, function()
+ {
+ return (Math.round(geo.x * 1000) / 10);
+ }, function(value)
+ {
+ value = parseFloat(value);
+
+ if (!isNaN(value))
+ {
+ model.beginUpdate();
+ try
+ {
+ geo = geo.clone();
+ geo.x = parseFloat(value) / 100;
+ model.setGeometry(rect.vertices[0], geo);
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ }
+ });
+
+ if (model.isEdge(model.getParent(rect.vertices[0])))
+ {
+ coordinateLabels = false;
+ var dyUpdate = null;
+
+ dy = this.addUnitInput(div2, this.getUnit(), 16, 52, function()
+ {
+ dyUpdate.apply(this, arguments);
+ });
+
+ dyUpdate = this.addGeometryHandler(dy, function(geo, value)
+ {
+ console.log('value', value);
+
+ geo.y = panel.fromUnit(value);
+ });
+ }
+ else
+ {
+ dy = this.addGenericInput(div2, ' %', 16, 52, function()
+ {
+ return (Math.round(geo.y * 1000) / 10);
+ }, function(value)
+ {
+ value = parseFloat(value);
+
+ if (!isNaN(value))
+ {
+ model.beginUpdate();
+ try
+ {
+ geo = geo.clone();
+ geo.y = parseFloat(value) / 100;
+ model.setGeometry(rect.vertices[0], geo);
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ }
+ });
+ }
+
+ mxUtils.br(div2);
+ }
+ }
+ container.appendChild(div2);
+ }
+
+ this.addLabel(div2, mxResources.get(coordinateLabels ? 'left' : 'line'), 87, 64).style.marginTop = '8px';
+ this.addLabel(div2, mxResources.get(coordinateLabels ? 'top' : 'orthogonal'), 16, 64).style.marginTop = '8px';
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ rect = ui.getSelectionState();
+
+ if (!rect.containsLabel && rect.vertices.length == graph.getSelectionCount() &&
+ rect.width != null && rect.height != null)
+ {
+ div.style.display = '';
+
+ if (force || document.activeElement != width)
+ {
+ width.value = this.inUnit(rect.width) + ' ' + this.getUnit();
+ }
+
+ if (force || document.activeElement != height)
+ {
+ height.value = this.inUnit(rect.height) + ' ' + this.getUnit();
+ }
+ }
+ else
+ {
+ div.style.display = 'none';
+ }
+
+ if (rect.vertices.length == graph.getSelectionCount() &&
+ rect.vertices.length > 0 && rect.x != null &&
+ rect.y != null)
+ {
+ var geo = graph.getCellGeometry(rect.vertices[0]);
+ div2.style.display = '';
+
+ if (force || document.activeElement != left)
+ {
+ left.value = this.inUnit(rect.x) + ' ' + this.getUnit();
+ }
+
+ if (force || document.activeElement != top)
+ {
+ top.value = this.inUnit(rect.y) + ' ' + this.getUnit();
+ }
+
+ if (geo != null && geo.relative)
+ {
+ if (dx != null && (force || document.activeElement != dx))
+ {
+ dx.value = (Math.round(geo.x * 1000) / 10) + ' %';
+ }
+
+ if (dy != null && (force || document.activeElement != dy))
+ {
+ if (model.isEdge(model.getParent(rect.vertices[0])))
+ {
+ dy.value = this.inUnit(geo.y) + ' ' + this.getUnit();
+ }
+ else
+ {
+ dy.value = (Math.round(geo.y * 1000) / 10) + ' %';
+ }
+ }
+ }
+ }
+ else
+ {
+ div2.style.display = 'none';
+ }
+ });
+
+ this.listeners.push({destroy: function() { model.removeListener(listener); }});
+ model.addListener(mxEvent.CHANGE, listener);
+ this.addKeyHandler(left, listener);
+ this.addKeyHandler(top, listener);
+ listener();
+
+ leftUpdate = this.addGeometryHandler(left, function(geo, value)
+ {
+ value = panel.fromUnit(value);
+
+ if (geo.relative)
+ {
+ geo.offset.x = value;
+ }
+ else
+ {
+ geo.x = value;
+ }
+ });
+ topUpdate = this.addGeometryHandler(top, function(geo, value)
+ {
+ value = panel.fromUnit(value);
+
+ if (geo.relative)
+ {
+ geo.offset.y = value;
+ }
+ else
+ {
+ geo.y = value;
+ }
+ });
+
+ if (rect.movable)
+ {
+ if (rect.edges.length == 0 && rect.vertices.length == 1 &&
+ model.isEdge(model.getParent(rect.vertices[0])))
+ {
+ var geo = graph.getCellGeometry(rect.vertices[0]);
+
+ if (geo != null && geo.relative)
+ {
+ var btn = mxUtils.button(mxResources.get('center'), mxUtils.bind(this, function(evt)
+ {
+ model.beginUpdate();
+ try
+ {
+ geo = geo.clone();
+ geo.x = 0;
+ geo.y = 0;
+ geo.offset = new mxPoint();
+ model.setGeometry(rect.vertices[0], geo);
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ }));
+
+ btn.setAttribute('title', mxResources.get('center'));
+ btn.style.width = '134px';
+ btn.style.left = '89px';
+ btn.style.position = 'absolute';
+ mxUtils.br(div2);
+ mxUtils.br(div2);
+ div2.appendChild(btn);
+ }
+ }
+ container.appendChild(div2);
+ }
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addGeometryHandler = function(input, fn)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var initialValue = null;
+ var panel = this;
+
+ function update(evt)
+ {
+ if (input.value != '')
+ {
+ var value = parseFloat(input.value);
+
+ if (isNaN(value))
+ {
+ input.value = initialValue + ' ' + panel.getUnit();
+ }
+ else if (value != initialValue)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var cells = ui.getSelectionState().cells;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (graph.getModel().isVertex(cells[i]))
+ {
+ var geo = graph.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ if (!fn(geo, value, cells[i]))
+ {
+ var state = graph.view.getState(cells[i]);
+
+ if (state != null && graph.isRecursiveVertexResize(state))
+ {
+ graph.resizeChildCells(cells[i], geo);
+ }
+
+ graph.getModel().setGeometry(cells[i], geo);
+ graph.constrainChildCells(cells[i]);
+ }
+ }
+ }
+ }
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+
+ initialValue = value;
+ input.value = value + ' ' + panel.getUnit();
+ }
+ }
+
+ mxEvent.consume(evt);
+ };
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+ mxEvent.addListener(input, 'focus', function()
+ {
+ initialValue = input.value;
+ });
+
+ return update;
+};
+
+ArrangePanel.prototype.addEdgeGeometryHandler = function(input, fn)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var initialValue = null;
+
+ function update(evt)
+ {
+ if (input.value != '')
+ {
+ var value = parseFloat(input.value);
+
+ if (isNaN(value))
+ {
+ input.value = initialValue + ' pt';
+ }
+ else if (value != initialValue)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var cells = ui.getSelectionState().cells;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (graph.getModel().isEdge(cells[i]))
+ {
+ var geo = graph.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+ fn(geo, value);
+
+ graph.getModel().setGeometry(cells[i], geo);
+ }
+ }
+ }
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+
+ initialValue = value;
+ input.value = value + ' pt';
+ }
+ }
+
+ mxEvent.consume(evt);
+ };
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+ mxEvent.addListener(input, 'focus', function()
+ {
+ initialValue = input.value;
+ });
+
+ return update;
+};
+
+/**
+ *
+ */
+ArrangePanel.prototype.addEdgeGeometry = function(container)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var rect = ui.getSelectionState();
+ var div = this.createPanel();
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('width'));
+ div.appendChild(span);
+
+ var widthUpdate, xtUpdate, ytUpdate, xsUpdate, ysUpdate;
+ var width = this.addUnitInput(div, 'pt', 12, 44, function()
+ {
+ widthUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(div);
+ this.addKeyHandler(width, listener);
+
+ var widthUpdate = mxUtils.bind(this, function(evt)
+ {
+ // Maximum stroke width is 999
+ var value = parseInt(width.value);
+ value = Math.min(999, Math.max(1, (isNaN(value)) ? 1 : value));
+
+ if (value != mxUtils.getValue(rect.style, 'width', mxCellRenderer.defaultShapes['flexArrow'].prototype.defaultWidth))
+ {
+ var cells = ui.getSelectionState().cells;
+ graph.setCellStyles('width', value, cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', ['width'],
+ 'values', [value], 'cells', cells));
+ }
+
+ width.value = value + ' pt';
+ mxEvent.consume(evt);
+ });
+
+ mxEvent.addListener(width, 'blur', widthUpdate);
+ mxEvent.addListener(width, 'change', widthUpdate);
+
+ container.appendChild(div);
+
+ var divs = this.createPanel();
+ divs.style.paddingBottom = '30px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ mxUtils.write(span, mxResources.get('linestart'));
+ divs.appendChild(span);
+
+ var xs = this.addUnitInput(divs, 'pt', 87, 52, function()
+ {
+ xsUpdate.apply(this, arguments);
+ });
+ var ys = this.addUnitInput(divs, 'pt', 16, 52, function()
+ {
+ ysUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(divs);
+ this.addLabel(divs, mxResources.get('left'), 87, 64);
+ this.addLabel(divs, mxResources.get('top'), 16, 64);
+ container.appendChild(divs);
+ this.addKeyHandler(xs, listener);
+ this.addKeyHandler(ys, listener);
+
+ var divt = this.createPanel();
+ divt.style.paddingBottom = '30px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ mxUtils.write(span, mxResources.get('lineend'));
+ divt.appendChild(span);
+
+ var xt = this.addUnitInput(divt, 'pt', 87, 52, function()
+ {
+ xtUpdate.apply(this, arguments);
+ });
+ var yt = this.addUnitInput(divt, 'pt', 16, 52, function()
+ {
+ ytUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(divt);
+ this.addLabel(divt, mxResources.get('left'), 87, 64);
+ this.addLabel(divt, mxResources.get('top'), 16, 64);
+ container.appendChild(divt);
+ this.addKeyHandler(xt, listener);
+ this.addKeyHandler(yt, listener);
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ rect = ui.getSelectionState();
+ var cell = rect.cells[0];
+
+ if (rect.style.shape == 'link' || rect.style.shape == 'flexArrow')
+ {
+ div.style.display = '';
+
+ if (force || document.activeElement != width)
+ {
+ var value = mxUtils.getValue(rect.style, 'width',
+ mxCellRenderer.defaultShapes['flexArrow'].prototype.defaultWidth);
+ width.value = value + ' pt';
+ }
+ }
+ else
+ {
+ div.style.display = 'none';
+ }
+
+ if (rect.cells.length == 1 && graph.model.isEdge(cell))
+ {
+ var geo = graph.model.getGeometry(cell);
+
+ if (geo != null && geo.sourcePoint != null &&
+ graph.model.getTerminal(cell, true) == null)
+ {
+ xs.value = geo.sourcePoint.x;
+ ys.value = geo.sourcePoint.y;
+ }
+ else
+ {
+ divs.style.display = 'none';
+ }
+
+ if (geo != null && geo.targetPoint != null &&
+ graph.model.getTerminal(cell, false) == null)
+ {
+ xt.value = geo.targetPoint.x;
+ yt.value = geo.targetPoint.y;
+ }
+ else
+ {
+ divt.style.display = 'none';
+ }
+ }
+ else
+ {
+ divs.style.display = 'none';
+ divt.style.display = 'none';
+ }
+ });
+
+ xsUpdate = this.addEdgeGeometryHandler(xs, function(geo, value)
+ {
+ geo.sourcePoint.x = value;
+ });
+
+ ysUpdate = this.addEdgeGeometryHandler(ys, function(geo, value)
+ {
+ geo.sourcePoint.y = value;
+ });
+
+ xtUpdate = this.addEdgeGeometryHandler(xt, function(geo, value)
+ {
+ geo.targetPoint.x = value;
+ });
+
+ ytUpdate = this.addEdgeGeometryHandler(yt, function(geo, value)
+ {
+ geo.targetPoint.y = value;
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+TextFormatPanel = function(format, editorUi, container)
+{
+ BaseFormatPanel.call(this, format, editorUi, container);
+ this.init();
+};
+
+mxUtils.extend(TextFormatPanel, BaseFormatPanel);
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+TextFormatPanel.prototype.init = function()
+{
+ this.container.style.borderBottom = 'none';
+ this.addFont(this.container);
+
+ // Allows to lock/unload button to be added
+ this.container.appendChild(this.addFontOps(this.createPanel()));
+};
+
+
+/**
+ *
+ */
+TextFormatPanel.prototype.addFontOps = function(div)
+{
+ var ui = this.editorUi;
+ div.style.paddingTop = '8px';
+ div.style.paddingBottom = '6px';
+
+ var count = this.addActions(div, ['removeFormat']);
+
+ if (count == 0)
+ {
+ div.style.display = 'none';
+ }
+
+ return div;
+};
+
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+TextFormatPanel.prototype.addFont = function(container)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var ss = ui.getSelectionState();
+
+ var title = this.createTitle(mxResources.get('font'));
+ title.style.paddingLeft = '14px';
+ title.style.paddingTop = '10px';
+ title.style.paddingBottom = '6px';
+ container.appendChild(title);
+
+ var stylePanel = this.createPanel();
+ stylePanel.style.paddingTop = '2px';
+ stylePanel.style.paddingBottom = '2px';
+ stylePanel.style.position = 'relative';
+ stylePanel.style.marginLeft = '-2px';
+ stylePanel.style.borderWidth = '0px';
+ stylePanel.className = 'geToolbarContainer';
+
+ if (graph.cellEditor.isContentEditing())
+ {
+ var cssPanel = stylePanel.cloneNode();
+
+ var cssMenu = this.editorUi.toolbar.addMenu(mxResources.get('style'),
+ mxResources.get('style'), true, 'formatBlock', cssPanel, null, true);
+ this.addArrow(cssMenu);
+ cssMenu.style.width = '211px';
+ cssMenu.style.alignItems = 'center';
+ cssMenu.style.justifyContent = 'center';
+ cssMenu.style.whiteSpace = 'nowrap';
+ cssMenu.style.overflow = 'hidden';
+ cssMenu.style.margin = '0px';
+ cssMenu.style.position = 'relative';
+
+ var arrow = cssMenu.getElementsByTagName('div')[0];
+ arrow.style.position = 'absolute';
+ arrow.style.right = '2px';
+ container.appendChild(cssPanel);
+ }
+
+ container.appendChild(stylePanel);
+
+ var colorPanel = this.createPanel();
+ colorPanel.style.marginTop = '8px';
+ colorPanel.style.borderWidth = '1px';
+ colorPanel.style.borderStyle = 'solid';
+ colorPanel.style.paddingTop = '6px';
+ colorPanel.style.paddingBottom = '2px';
+
+ var fontMenu = this.editorUi.toolbar.addMenu('Helvetica', mxResources.get('fontFamily'),
+ true, 'fontFamily', stylePanel, null, true);
+
+ this.addArrow(fontMenu);
+ fontMenu.style.width = '211px';
+ fontMenu.style.alignItems = 'center';
+ fontMenu.style.justifyContent = 'center';
+ fontMenu.style.whiteSpace = 'nowrap';
+ fontMenu.style.overflow = 'hidden';
+ fontMenu.style.margin = '0px';
+ fontMenu.style.position = 'relative';
+
+ var arrow = fontMenu.getElementsByTagName('div')[0];
+ arrow.style.position = 'absolute';
+ arrow.style.right = '2px';
+
+ var stylePanel2 = stylePanel.cloneNode(false);
+ stylePanel2.style.marginLeft = '-3px';
+ var fontStyleItems = this.editorUi.toolbar.addItems(['bold', 'italic', 'underline'], stylePanel2, true);
+ fontStyleItems[0].setAttribute('title', mxResources.get('bold') + ' (' + this.editorUi.actions.get('bold').shortcut + ')');
+ fontStyleItems[1].setAttribute('title', mxResources.get('italic') + ' (' + this.editorUi.actions.get('italic').shortcut + ')');
+ fontStyleItems[2].setAttribute('title', mxResources.get('underline') + ' (' + this.editorUi.actions.get('underline').shortcut + ')');
+
+ var verticalItem = this.editorUi.toolbar.addItems(['vertical'], stylePanel2, true)[0];
+
+ container.appendChild(stylePanel2);
+
+ this.styleButtons(fontStyleItems);
+ this.styleButtons([verticalItem]);
+
+ var stylePanel3 = stylePanel.cloneNode(false);
+ stylePanel3.style.marginLeft = '-3px';
+ stylePanel3.style.paddingBottom = '0px';
+
+ // Helper function to return a wrapper function does not pass any arguments
+ var callFn = function(fn)
+ {
+ return function()
+ {
+ return fn();
+ };
+ };
+
+ var left = this.editorUi.toolbar.addButton('geSprite-left', mxResources.get('left'),
+ (graph.cellEditor.isContentEditing()) ?
+ function(evt)
+ {
+ graph.cellEditor.alignText(mxConstants.ALIGN_LEFT, evt);
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_ALIGN],
+ 'values', [mxConstants.ALIGN_LEFT],
+ 'cells', ss.cells));
+ } : callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_ALIGN], [mxConstants.ALIGN_LEFT])), stylePanel3);
+ var center = this.editorUi.toolbar.addButton('geSprite-center', mxResources.get('center'),
+ (graph.cellEditor.isContentEditing()) ?
+ function(evt)
+ {
+ graph.cellEditor.alignText(mxConstants.ALIGN_CENTER, evt);
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_ALIGN],
+ 'values', [mxConstants.ALIGN_CENTER],
+ 'cells', ss.cells));
+ } : callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_ALIGN], [mxConstants.ALIGN_CENTER])), stylePanel3);
+ var right = this.editorUi.toolbar.addButton('geSprite-right', mxResources.get('right'),
+ (graph.cellEditor.isContentEditing()) ?
+ function(evt)
+ {
+ graph.cellEditor.alignText(mxConstants.ALIGN_RIGHT, evt);
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_ALIGN],
+ 'values', [mxConstants.ALIGN_RIGHT],
+ 'cells', ss.cells));
+ } : callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_ALIGN], [mxConstants.ALIGN_RIGHT])), stylePanel3);
+
+ this.styleButtons([left, center, right]);
+
+ // Quick hack for strikethrough
+ // TODO: Add translations and toggle state
+ if (graph.cellEditor.isContentEditing())
+ {
+ var strike = this.editorUi.toolbar.addButton('geSprite-removeformat', mxResources.get('strikethrough'),
+ function()
+ {
+ document.execCommand('strikeThrough', false, null);
+ }, stylePanel2);
+ this.styleButtons([strike]);
+
+ strike.firstChild.style.background = 'url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCI+PGRlZnM+PHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjR2MjRIMFYweiIvPjwvZGVmcz48Y2xpcFBhdGggaWQ9ImIiPjx1c2UgeGxpbms6aHJlZj0iI2EiIG92ZXJmbG93PSJ2aXNpYmxlIi8+PC9jbGlwUGF0aD48cGF0aCBjbGlwLXBhdGg9InVybCgjYikiIGZpbGw9IiMwMTAxMDEiIGQ9Ik03LjI0IDguNzVjLS4yNi0uNDgtLjM5LTEuMDMtLjM5LTEuNjcgMC0uNjEuMTMtMS4xNi40LTEuNjcuMjYtLjUuNjMtLjkzIDEuMTEtMS4yOS40OC0uMzUgMS4wNS0uNjMgMS43LS44My42Ni0uMTkgMS4zOS0uMjkgMi4xOC0uMjkuODEgMCAxLjU0LjExIDIuMjEuMzQuNjYuMjIgMS4yMy41NCAxLjY5Ljk0LjQ3LjQuODMuODggMS4wOCAxLjQzLjI1LjU1LjM4IDEuMTUuMzggMS44MWgtMy4wMWMwLS4zMS0uMDUtLjU5LS4xNS0uODUtLjA5LS4yNy0uMjQtLjQ5LS40NC0uNjgtLjItLjE5LS40NS0uMzMtLjc1LS40NC0uMy0uMS0uNjYtLjE2LTEuMDYtLjE2LS4zOSAwLS43NC4wNC0xLjAzLjEzLS4yOS4wOS0uNTMuMjEtLjcyLjM2LS4xOS4xNi0uMzQuMzQtLjQ0LjU1LS4xLjIxLS4xNS40My0uMTUuNjYgMCAuNDguMjUuODguNzQgMS4yMS4zOC4yNS43Ny40OCAxLjQxLjdINy4zOWMtLjA1LS4wOC0uMTEtLjE3LS4xNS0uMjV6TTIxIDEydi0ySDN2Mmg5LjYyYy4xOC4wNy40LjE0LjU1LjIuMzcuMTcuNjYuMzQuODcuNTEuMjEuMTcuMzUuMzYuNDMuNTcuMDcuMi4xMS40My4xMS42OSAwIC4yMy0uMDUuNDUtLjE0LjY2LS4wOS4yLS4yMy4zOC0uNDIuNTMtLjE5LjE1LS40Mi4yNi0uNzEuMzUtLjI5LjA4LS42My4xMy0xLjAxLjEzLS40MyAwLS44My0uMDQtMS4xOC0uMTNzLS42Ni0uMjMtLjkxLS40MmMtLjI1LS4xOS0uNDUtLjQ0LS41OS0uNzUtLjE0LS4zMS0uMjUtLjc2LS4yNS0xLjIxSDYuNGMwIC41NS4wOCAxLjEzLjI0IDEuNTguMTYuNDUuMzcuODUuNjUgMS4yMS4yOC4zNS42LjY2Ljk4LjkyLjM3LjI2Ljc4LjQ4IDEuMjIuNjUuNDQuMTcuOS4zIDEuMzguMzkuNDguMDguOTYuMTMgMS40NC4xMy44IDAgMS41My0uMDkgMi4xOC0uMjhzMS4yMS0uNDUgMS42Ny0uNzljLjQ2LS4zNC44Mi0uNzcgMS4wNy0xLjI3cy4zOC0xLjA3LjM4LTEuNzFjMC0uNi0uMS0xLjE0LS4zMS0xLjYxLS4wNS0uMTEtLjExLS4yMy0uMTctLjMzSDIxeiIvPjwvc3ZnPg==)';
+ strike.firstChild.style.backgroundPosition = '2px 2px';
+ strike.firstChild.style.backgroundSize = '18px 18px';
+
+ this.styleButtons([strike]);
+ }
+
+ var top = this.editorUi.toolbar.addButton('geSprite-top', mxResources.get('top'),
+ callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_VERTICAL_ALIGN],
+ [mxConstants.ALIGN_TOP])), stylePanel3);
+ var middle = this.editorUi.toolbar.addButton('geSprite-middle', mxResources.get('middle'),
+ callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_VERTICAL_ALIGN],
+ [mxConstants.ALIGN_MIDDLE])), stylePanel3);
+ var bottom = this.editorUi.toolbar.addButton('geSprite-bottom', mxResources.get('bottom'),
+ callFn(this.editorUi.menus.createStyleChangeFunction([mxConstants.STYLE_VERTICAL_ALIGN],
+ [mxConstants.ALIGN_BOTTOM])), stylePanel3);
+
+ this.styleButtons([top, middle, bottom]);
+
+ container.appendChild(stylePanel3);
+
+ // Hack for updating UI state below based on current text selection
+ // currentTable is the current selected DOM table updated below
+ var sub, sup, full, tableWrapper, currentTable, tableCell, tableRow;
+
+ if (graph.cellEditor.isContentEditing())
+ {
+ top.style.display = 'none';
+ middle.style.display = 'none';
+ bottom.style.display = 'none';
+ verticalItem.style.display = 'none';
+
+ full = this.editorUi.toolbar.addButton('geSprite-justifyfull', mxResources.get('block'),
+ function()
+ {
+ if (full.style.opacity == 1)
+ {
+ document.execCommand('justifyfull', false, null);
+ }
+ }, stylePanel3);
+ full.style.marginRight = '9px';
+ full.style.opacity = 1;
+
+ this.styleButtons([full,
+ sub = this.editorUi.toolbar.addButton('geSprite-subscript',
+ mxResources.get('subscript') + ' (' + Editor.ctrlKey + '+,)',
+ function()
+ {
+ document.execCommand('subscript', false, null);
+ }, stylePanel3), sup = this.editorUi.toolbar.addButton('geSprite-superscript',
+ mxResources.get('superscript') + ' (' + Editor.ctrlKey + '+.)',
+ function()
+ {
+ document.execCommand('superscript', false, null);
+ }, stylePanel3)]);
+ sub.style.marginLeft = '10px';
+
+ var tmp = stylePanel3.cloneNode(false);
+ tmp.style.paddingTop = '4px';
+ var btns = [this.editorUi.toolbar.addButton('geSprite-orderedlist', mxResources.get('numberedList'),
+ function()
+ {
+ document.execCommand('insertorderedlist', false, null);
+ }, tmp),
+ this.editorUi.toolbar.addButton('geSprite-unorderedlist', mxResources.get('bulletedList'),
+ function()
+ {
+ document.execCommand('insertunorderedlist', false, null);
+ }, tmp),
+ this.editorUi.toolbar.addButton('geSprite-outdent', mxResources.get('decreaseIndent'),
+ function()
+ {
+ document.execCommand('outdent', false, null);
+ }, tmp),
+ this.editorUi.toolbar.addButton('geSprite-indent', mxResources.get('increaseIndent'),
+ function()
+ {
+ document.execCommand('indent', false, null);
+ }, tmp),
+ this.editorUi.toolbar.addButton('geSprite-removeformat', mxResources.get('removeFormat'),
+ function()
+ {
+ document.execCommand('removeformat', false, null);
+ }, tmp),
+ this.editorUi.toolbar.addButton('geSprite-code', mxResources.get('html'),
+ function()
+ {
+ graph.cellEditor.toggleViewMode();
+ }, tmp)];
+ this.styleButtons(btns);
+ btns[btns.length - 2].style.marginLeft = '10px';
+
+ container.appendChild(tmp);
+ }
+ else
+ {
+ fontStyleItems[2].style.marginRight = '12px';
+ right.style.marginRight = '12px';
+ }
+
+ // Label position
+ var stylePanel4 = stylePanel.cloneNode(false);
+ stylePanel4.removeAttribute('class');
+ stylePanel4.style.marginLeft = '0px';
+ stylePanel4.style.paddingTop = '8px';
+ stylePanel4.style.paddingBottom = '4px';
+ stylePanel4.style.fontWeight = 'normal';
+
+ mxUtils.write(stylePanel4, mxResources.get('position'));
+
+ // Adds label position options
+ var positionSelect = document.createElement('select');
+ positionSelect.style.position = 'absolute';
+ positionSelect.style.left = '126px';
+ positionSelect.style.width = '98px';
+ positionSelect.style.borderWidth = '1px';
+ positionSelect.style.borderStyle = 'solid';
+ positionSelect.style.marginTop = '-3px';
+
+ var directions = ['topLeft', 'top', 'topRight', 'left', 'center', 'right', 'bottomLeft', 'bottom', 'bottomRight'];
+ var lset = {'topLeft': [mxConstants.ALIGN_LEFT, mxConstants.ALIGN_TOP, mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_BOTTOM],
+ 'top': [mxConstants.ALIGN_CENTER, mxConstants.ALIGN_TOP, mxConstants.ALIGN_CENTER, mxConstants.ALIGN_BOTTOM],
+ 'topRight': [mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_TOP, mxConstants.ALIGN_LEFT, mxConstants.ALIGN_BOTTOM],
+ 'left': [mxConstants.ALIGN_LEFT, mxConstants.ALIGN_MIDDLE, mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_MIDDLE],
+ 'center': [mxConstants.ALIGN_CENTER, mxConstants.ALIGN_MIDDLE, mxConstants.ALIGN_CENTER, mxConstants.ALIGN_MIDDLE],
+ 'right': [mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_MIDDLE, mxConstants.ALIGN_LEFT, mxConstants.ALIGN_MIDDLE],
+ 'bottomLeft': [mxConstants.ALIGN_LEFT, mxConstants.ALIGN_BOTTOM, mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_TOP],
+ 'bottom': [mxConstants.ALIGN_CENTER, mxConstants.ALIGN_BOTTOM, mxConstants.ALIGN_CENTER, mxConstants.ALIGN_TOP],
+ 'bottomRight': [mxConstants.ALIGN_RIGHT, mxConstants.ALIGN_BOTTOM, mxConstants.ALIGN_LEFT, mxConstants.ALIGN_TOP]};
+
+ for (var i = 0; i < directions.length; i++)
+ {
+ var positionOption = document.createElement('option');
+ positionOption.setAttribute('value', directions[i]);
+ mxUtils.write(positionOption, mxResources.get(directions[i]));
+ positionSelect.appendChild(positionOption);
+ }
+
+ stylePanel4.appendChild(positionSelect);
+
+ // Writing direction
+ var stylePanel5 = stylePanel.cloneNode(false);
+ stylePanel5.removeAttribute('class');
+ stylePanel5.style.marginLeft = '0px';
+ stylePanel5.style.paddingTop = '4px';
+ stylePanel5.style.paddingBottom = '4px';
+ stylePanel5.style.fontWeight = 'normal';
+
+ mxUtils.write(stylePanel5, mxResources.get('writingDirection'));
+
+ // Adds writing direction options
+ // LATER: Handle reselect of same option in all selects (change event
+ // is not fired for same option so have opened state on click) and
+ // handle multiple different styles for current selection
+ var dirSelect = document.createElement('select');
+ dirSelect.style.position = 'absolute';
+ dirSelect.style.borderWidth = '1px';
+ dirSelect.style.borderStyle = 'solid';
+ dirSelect.style.left = '126px';
+ dirSelect.style.width = '98px';
+ dirSelect.style.marginTop = '-3px';
+
+ // NOTE: For automatic we use the value null since automatic
+ // requires the text to be non formatted and non-wrapped
+ var dirs = ['automatic', 'leftToRight', 'rightToLeft'];
+ var dirSet = {'automatic': null,
+ 'leftToRight': mxConstants.TEXT_DIRECTION_LTR,
+ 'rightToLeft': mxConstants.TEXT_DIRECTION_RTL};
+
+ for (var i = 0; i < dirs.length; i++)
+ {
+ var dirOption = document.createElement('option');
+ dirOption.setAttribute('value', dirs[i]);
+ mxUtils.write(dirOption, mxResources.get(dirs[i]));
+ dirSelect.appendChild(dirOption);
+ }
+
+ stylePanel5.appendChild(dirSelect);
+
+ if (!graph.isEditing())
+ {
+ container.appendChild(stylePanel4);
+
+ mxEvent.addListener(positionSelect, 'change', function(evt)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var vals = lset[positionSelect.value];
+
+ if (vals != null)
+ {
+ graph.setCellStyles(mxConstants.STYLE_LABEL_POSITION, vals[0], ss.cells);
+ graph.setCellStyles(mxConstants.STYLE_VERTICAL_LABEL_POSITION, vals[1], ss.cells);
+ graph.setCellStyles(mxConstants.STYLE_ALIGN, vals[2], ss.cells);
+ graph.setCellStyles(mxConstants.STYLE_VERTICAL_ALIGN, vals[3], ss.cells);
+ }
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ // LATER: Update dir in text editor while editing and update style with label
+ // NOTE: The tricky part is handling and passing on the auto value
+ container.appendChild(stylePanel5);
+
+ mxEvent.addListener(dirSelect, 'change', function(evt)
+ {
+ graph.setCellStyles(mxConstants.STYLE_TEXT_DIRECTION, dirSet[dirSelect.value], ss.cells);
+ mxEvent.consume(evt);
+ });
+ }
+
+ // Fontsize
+ var input = document.createElement('input');
+ input.style.position = 'absolute';
+ input.style.borderWidth = '1px';
+ input.style.borderStyle = 'solid';
+ input.style.textAlign = 'right';
+ input.style.marginTop = '4px';
+ input.style.left = '161px';
+ input.style.width = '53px';
+ input.style.height = '23px';
+ input.style.boxSizing = 'border-box';
+ stylePanel2.appendChild(input);
+
+ // Workaround for font size 4 if no text is selected is update font size below
+ // after first character was entered (as the font element is lazy created)
+ var pendingFontSize = null;
+
+ var inputUpdate = this.installInputHandler(input, mxConstants.STYLE_FONTSIZE, Menus.prototype.defaultFontSize, 1, 999, ' pt',
+ function(fontSize)
+ {
+ // IE does not support containsNode
+ // KNOWN: Fixes font size issues but bypasses undo
+ if (window.getSelection && !mxClient.IS_IE && !mxClient.IS_IE11)
+ {
+ var selection = window.getSelection();
+ var container = (selection.rangeCount > 0) ? selection.getRangeAt(0).commonAncestorContainer :
+ graph.cellEditor.textarea;
+
+ function updateSize(elt, ignoreContains)
+ {
+ if (graph.cellEditor.textarea != null && elt != graph.cellEditor.textarea &&
+ graph.cellEditor.textarea.contains(elt) &&
+ (ignoreContains || selection.containsNode(elt, true)))
+ {
+ if (elt.nodeName == 'FONT')
+ {
+ elt.removeAttribute('size');
+ elt.style.fontSize = fontSize + 'px';
+ }
+ else
+ {
+ var css = mxUtils.getCurrentStyle(elt);
+
+ if (css.fontSize != fontSize + 'px')
+ {
+ if (mxUtils.getCurrentStyle(elt.parentNode).fontSize != fontSize + 'px')
+ {
+ elt.style.fontSize = fontSize + 'px';
+ }
+ else
+ {
+ elt.style.fontSize = '';
+ }
+ }
+ }
+ }
+
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_FONTSIZE],
+ 'values', [fontSize], 'cells', ss.cells));
+ };
+
+ // Wraps text node or mixed selection with leading text in a font element
+ if (container == graph.cellEditor.textarea ||
+ container.nodeType != mxConstants.NODETYPE_ELEMENT)
+ {
+ document.execCommand('fontSize', false, '1');
+ }
+
+ if (container != graph.cellEditor.textarea)
+ {
+ container = container.parentNode;
+ }
+
+ if (container != null && container.nodeType == mxConstants.NODETYPE_ELEMENT)
+ {
+ var elts = container.getElementsByTagName('*');
+ updateSize(container);
+
+ for (var i = 0; i < elts.length; i++)
+ {
+ updateSize(elts[i]);
+ }
+ }
+
+ input.value = fontSize + ' pt';
+ }
+ else if (window.getSelection || document.selection)
+ {
+ // Checks selection
+ var par = null;
+
+ if (document.selection)
+ {
+ par = document.selection.createRange().parentElement();
+ }
+ else
+ {
+ var selection = window.getSelection();
+
+ if (selection.rangeCount > 0)
+ {
+ par = selection.getRangeAt(0).commonAncestorContainer;
+ }
+ }
+
+ // Node.contains does not work for text nodes in IE11
+ function isOrContains(container, node)
+ {
+ while (node != null)
+ {
+ if (node === container)
+ {
+ return true;
+ }
+
+ node = node.parentNode;
+ }
+
+ return false;
+ };
+
+ if (par != null && isOrContains(graph.cellEditor.textarea, par))
+ {
+ pendingFontSize = fontSize;
+
+ // Workaround for can't set font size in px is to change font size afterwards
+ document.execCommand('fontSize', false, '4');
+ var elts = graph.cellEditor.textarea.getElementsByTagName('font');
+
+ for (var i = 0; i < elts.length; i++)
+ {
+ if (elts[i].getAttribute('size') == '4')
+ {
+ elts[i].removeAttribute('size');
+ elts[i].style.fontSize = pendingFontSize + 'px';
+
+ // Overrides fontSize in input with the one just assigned as a workaround
+ // for potential fontSize values of parent elements that don't match
+ window.setTimeout(function()
+ {
+ input.value = pendingFontSize + ' pt';
+ pendingFontSize = null;
+ }, 0);
+
+ break;
+ }
+ }
+ }
+ }
+ }, true);
+
+ var stepper = this.createStepper(input, inputUpdate, 1, 10, true, Menus.prototype.defaultFontSize);
+ stepper.style.display = input.style.display;
+ stepper.style.marginTop = '4px';
+ stepper.style.left = '214px';
+
+ stylePanel2.appendChild(stepper);
+
+ var arrow = fontMenu.getElementsByTagName('div')[0];
+ arrow.style.cssFloat = 'right';
+
+ var bgColorApply = null;
+ var currentBgColor = graph.shapeBackgroundColor;
+
+ var fontColorApply = null;
+ var currentFontColor = graph.shapeForegroundColor;
+
+ var bgPanel = (graph.cellEditor.isContentEditing()) ? this.createColorOption(mxResources.get('backgroundColor'), function()
+ {
+ return currentBgColor;
+ }, function(color)
+ {
+ document.execCommand('backcolor', false, (color != mxConstants.NONE) ? color : 'transparent');
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_LABEL_BACKGROUNDCOLOR],
+ 'values', [color], 'cells', ss.cells));
+ }, graph.shapeBackgroundColor,
+ {
+ install: function(apply) { bgColorApply = apply; },
+ destroy: function() { bgColorApply = null; }
+ }, null, true) : this.createCellColorOption(mxResources.get('backgroundColor'),
+ mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, 'default', null, function(color)
+ {
+ graph.updateLabelElements(ss.cells, function(elt)
+ {
+ elt.style.backgroundColor = null;
+ });
+ }, graph.shapeBackgroundColor);
+ bgPanel.style.fontWeight = 'bold';
+
+ var borderPanel = this.createCellColorOption(mxResources.get('borderColor'),
+ mxConstants.STYLE_LABEL_BORDERCOLOR, 'default', null, null,
+ graph.shapeForegroundColor);
+ borderPanel.style.fontWeight = 'bold';
+
+ var defs = (ss.vertices.length >= 1) ?
+ graph.stylesheet.getDefaultVertexStyle() :
+ graph.stylesheet.getDefaultEdgeStyle();
+
+ var panel = (graph.cellEditor.isContentEditing()) ? this.createColorOption(mxResources.get('fontColor'), function()
+ {
+ return currentFontColor;
+ }, function(color)
+ {
+ if (mxClient.IS_FF)
+ {
+ // Workaround for Firefox that adds the font element around
+ // anchor elements which ignore inherited colors is to move
+ // the font element inside anchor elements
+ var tmp = graph.cellEditor.textarea.getElementsByTagName('font');
+ var oldFonts = [];
+
+ for (var i = 0; i < tmp.length; i++)
+ {
+ oldFonts.push(
+ {
+ node: tmp[i],
+ color: tmp[i].getAttribute('color')
+ });
+ }
+
+ document.execCommand('forecolor', false, (color != mxConstants.NONE) ?
+ color : 'transparent');
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_FONTCOLOR],
+ 'values', [color], 'cells', ss.cells));
+
+ // Finds the new or changed font element
+ var newFonts = graph.cellEditor.textarea.getElementsByTagName('font');
+
+ for (var i = 0; i < newFonts.length; i++)
+ {
+ if (i >= oldFonts.length || newFonts[i] != oldFonts[i].node ||
+ (newFonts[i] == oldFonts[i].node &&
+ newFonts[i].getAttribute('color') != oldFonts[i].color))
+ {
+ var child = newFonts[i].firstChild;
+
+ // Moves the font element to inside the anchor element and adopts all children
+ if (child != null && child.nodeName == 'A' && child.nextSibling == null &&
+ child.firstChild != null)
+ {
+ var parent = newFonts[i].parentNode;
+ parent.insertBefore(child, newFonts[i]);
+ var tmp = child.firstChild;
+
+ while (tmp != null)
+ {
+ var next = tmp.nextSibling;
+ newFonts[i].appendChild(tmp);
+ tmp = next;
+ }
+
+ child.appendChild(newFonts[i]);
+ }
+
+ break;
+ }
+ }
+ }
+ else
+ {
+ document.execCommand('forecolor', false, (color != mxConstants.NONE) ?
+ color : 'transparent');
+ ui.fireEvent(new mxEventObject('styleChanged',
+ 'keys', [mxConstants.STYLE_FONTCOLOR],
+ 'values', [color], 'cells', ss.cells));
+ }
+ }, (defs[mxConstants.STYLE_FONTCOLOR] != null) ? defs[mxConstants.STYLE_FONTCOLOR] : graph.shapeForegroundColor,
+ {
+ install: function(apply) { fontColorApply = apply; },
+ destroy: function() { fontColorApply = null; }
+ }, null, true) : this.createCellColorOption(mxResources.get('fontColor'),
+ mxConstants.STYLE_FONTCOLOR, 'default', function(color)
+ {
+ if (color == mxConstants.NONE)
+ {
+ bgPanel.style.display = 'none';
+ }
+ else
+ {
+ bgPanel.style.display = '';
+ }
+
+ borderPanel.style.display = bgPanel.style.display;
+ }, function(color)
+ {
+ if (color == mxConstants.NONE)
+ {
+ graph.setCellStyles(mxConstants.STYLE_NOLABEL, '1', ss.cells);
+ }
+ else
+ {
+ graph.setCellStyles(mxConstants.STYLE_NOLABEL, null, ss.cells);
+ }
+
+ graph.setCellStyles(mxConstants.STYLE_FONTCOLOR, color, ss.cells);
+
+ graph.updateLabelElements(ss.cells, function(elt)
+ {
+ elt.removeAttribute('color');
+ elt.style.color = null;
+ });
+ }, graph.shapeForegroundColor);
+ panel.style.fontWeight = 'bold';
+
+ colorPanel.appendChild(panel);
+ colorPanel.appendChild(bgPanel);
+
+ if (!graph.cellEditor.isContentEditing())
+ {
+ colorPanel.appendChild(borderPanel);
+ }
+
+ container.appendChild(colorPanel);
+
+ var extraPanel = this.createPanel();
+ extraPanel.style.paddingTop = '2px';
+ extraPanel.style.paddingBottom = '4px';
+
+ var wwCells = graph.filterSelectionCells(mxUtils.bind(this, function(cell)
+ {
+ var state = graph.view.getState(cell);
+
+ return state == null || graph.isAutoSizeState(state) ||
+ graph.getModel().isEdge(cell) || (!graph.isTableRow(cell) &&
+ !graph.isTableCell(cell) && !graph.isCellResizable(cell));
+ }));
+
+ var wwOpt = this.createCellOption(mxResources.get('wordWrap'), mxConstants.STYLE_WHITE_SPACE,
+ null, 'wrap', 'null', null, null, true, wwCells);
+ wwOpt.style.fontWeight = 'bold';
+
+ // Word wrap in edge labels only supported via labelWidth style
+ if (wwCells.length > 0)
+ {
+ extraPanel.appendChild(wwOpt);
+ }
+
+ // Delegates switch of style to formattedText action as it also convertes newlines
+ var htmlOpt = this.createCellOption(mxResources.get('formattedText'), 'html', 0,
+ null, null, null, ui.actions.get('formattedText'));
+ htmlOpt.style.fontWeight = 'bold';
+ extraPanel.appendChild(htmlOpt);
+
+ var spacingPanel = this.createPanel();
+ spacingPanel.style.paddingTop = '10px';
+ spacingPanel.style.paddingBottom = '28px';
+ spacingPanel.style.fontWeight = 'normal';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.width = '70px';
+ span.style.marginTop = '0px';
+ span.style.fontWeight = 'bold';
+ mxUtils.write(span, mxResources.get('spacing'));
+ spacingPanel.appendChild(span);
+
+ var topUpdate, globalUpdate, leftUpdate, bottomUpdate, rightUpdate;
+ var topSpacing = this.addUnitInput(spacingPanel, 'pt', 87, 52, function()
+ {
+ topUpdate.apply(this, arguments);
+ });
+ var globalSpacing = this.addUnitInput(spacingPanel, 'pt', 16, 52, function()
+ {
+ globalUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(spacingPanel);
+ this.addLabel(spacingPanel, mxResources.get('top'), 87, 64);
+ this.addLabel(spacingPanel, mxResources.get('global'), 16, 64);
+ mxUtils.br(spacingPanel);
+ mxUtils.br(spacingPanel);
+
+ var leftSpacing = this.addUnitInput(spacingPanel, 'pt', 158, 52, function()
+ {
+ leftUpdate.apply(this, arguments);
+ });
+ var bottomSpacing = this.addUnitInput(spacingPanel, 'pt', 87, 52, function()
+ {
+ bottomUpdate.apply(this, arguments);
+ });
+ var rightSpacing = this.addUnitInput(spacingPanel, 'pt', 16, 52, function()
+ {
+ rightUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(spacingPanel);
+ this.addLabel(spacingPanel, mxResources.get('left'), 158, 64);
+ this.addLabel(spacingPanel, mxResources.get('bottom'), 87, 64);
+ this.addLabel(spacingPanel, mxResources.get('right'), 16, 64);
+
+ if (!graph.cellEditor.isContentEditing())
+ {
+ container.appendChild(extraPanel);
+ container.appendChild(this.createRelativeOption(mxResources.get('opacity'), mxConstants.STYLE_TEXT_OPACITY));
+ container.appendChild(spacingPanel);
+ }
+ else
+ {
+ var selState = null;
+ var lineHeightInput = null;
+
+ container.appendChild(this.createRelativeOption(mxResources.get('lineheight'), null, null, function(input)
+ {
+ var value = (input.value == '') ? 120 : parseInt(input.value);
+ value = Math.max(0, (isNaN(value)) ? 120 : value);
+
+ if (selState != null)
+ {
+ graph.cellEditor.restoreSelection(selState);
+ selState = null;
+ }
+
+ var blocks = graph.getSelectedTextBlocks();
+
+ // Adds paragraph tags if no block element is selected
+ if (blocks.length == 0 && graph.cellEditor.textarea != null &&
+ graph.cellEditor.textarea.firstChild != null)
+ {
+ if (graph.cellEditor.textarea.firstChild.nodeName != 'P')
+ {
+ graph.cellEditor.textarea.innerHTML = '' + graph.cellEditor.textarea.innerHTML + '
';
+ }
+
+ blocks = [graph.cellEditor.textarea.firstChild];
+ }
+
+ for (var i = 0; i < blocks.length; i++)
+ {
+ blocks[i].style.lineHeight = value + '%';
+ }
+
+ input.value = value + ' %';
+ }, function(input)
+ {
+ // Used in CSS handler to update current value
+ lineHeightInput = input;
+
+ // KNOWN: Arrow up/down clear selection text in quirks/IE 8
+ // Text size via arrow button limits to 16 in IE11. Why?
+ mxEvent.addListener(input, 'mousedown', function()
+ {
+ if (document.activeElement == graph.cellEditor.textarea)
+ {
+ selState = graph.cellEditor.saveSelection();
+ }
+ });
+
+ mxEvent.addListener(input, 'touchstart', function()
+ {
+ if (document.activeElement == graph.cellEditor.textarea)
+ {
+ selState = graph.cellEditor.saveSelection();
+ }
+ });
+
+ input.value = '120 %';
+ }));
+
+ var insertPanel = stylePanel.cloneNode(false);
+ insertPanel.style.paddingLeft = '0px';
+ var insertBtns = this.editorUi.toolbar.addItems(['link', 'image'], insertPanel, true);
+
+ var btns = [
+ this.editorUi.toolbar.addButton('geSprite-horizontalrule', mxResources.get('insertHorizontalRule'),
+ function()
+ {
+ document.execCommand('inserthorizontalrule', false);
+ }, insertPanel),
+ this.editorUi.toolbar.addMenuFunctionInContainer(insertPanel, 'geSprite-table', mxResources.get('table'), false, mxUtils.bind(this, function(menu)
+ {
+ this.editorUi.menus.addInsertTableItem(menu, null, null, false);
+ }))];
+ this.styleButtons(insertBtns);
+ this.styleButtons(btns);
+
+ var wrapper2 = this.createPanel();
+ wrapper2.style.paddingTop = '10px';
+ wrapper2.style.paddingBottom = '10px';
+ wrapper2.appendChild(this.createTitle(mxResources.get('insert')));
+ wrapper2.appendChild(insertPanel);
+ container.appendChild(wrapper2);
+
+ var tablePanel = stylePanel.cloneNode(false);
+ tablePanel.style.paddingLeft = '0px';
+
+ var btns = [
+ this.editorUi.toolbar.addButton('geSprite-insertcolumnbefore', mxResources.get('insertColumnBefore'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null)
+ {
+ graph.insertColumn(currentTable, (tableCell != null) ? tableCell.cellIndex : 0);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel),
+ this.editorUi.toolbar.addButton('geSprite-insertcolumnafter', mxResources.get('insertColumnAfter'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null)
+ {
+ graph.insertColumn(currentTable, (tableCell != null) ? tableCell.cellIndex + 1 : -1);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel),
+ this.editorUi.toolbar.addButton('geSprite-deletecolumn', mxResources.get('deleteColumn'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null && tableCell != null)
+ {
+ graph.deleteColumn(currentTable, tableCell.cellIndex);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel),
+ this.editorUi.toolbar.addButton('geSprite-insertrowbefore', mxResources.get('insertRowBefore'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null && tableRow != null)
+ {
+ graph.insertRow(currentTable, tableRow.sectionRowIndex);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel),
+ this.editorUi.toolbar.addButton('geSprite-insertrowafter', mxResources.get('insertRowAfter'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null && tableRow != null)
+ {
+ graph.insertRow(currentTable, tableRow.sectionRowIndex + 1);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel),
+ this.editorUi.toolbar.addButton('geSprite-deleterow', mxResources.get('deleteRow'),
+ mxUtils.bind(this, function()
+ {
+ try
+ {
+ if (currentTable != null && tableRow != null)
+ {
+ graph.deleteRow(currentTable, tableRow.sectionRowIndex);
+ }
+ }
+ catch (e)
+ {
+ this.editorUi.handleError(e);
+ }
+ }), tablePanel)];
+ this.styleButtons(btns);
+ btns[2].style.marginRight = '10px';
+
+ var wrapper3 = this.createPanel();
+ wrapper3.style.paddingTop = '10px';
+ wrapper3.style.paddingBottom = '10px';
+ wrapper3.appendChild(this.createTitle(mxResources.get('table')));
+ wrapper3.appendChild(tablePanel);
+
+ var tablePanel2 = stylePanel.cloneNode(false);
+ tablePanel2.style.paddingLeft = '0px';
+
+ var btns = [
+ this.editorUi.toolbar.addButton('geSprite-strokecolor', mxResources.get('borderColor'),
+ mxUtils.bind(this, function(evt)
+ {
+ if (currentTable != null)
+ {
+ // Converts rgb(r,g,b) values
+ var color = currentTable.style.borderColor.replace(
+ /\brgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/g,
+ function($0, $1, $2, $3) {
+ return "#" + ("0"+Number($1).toString(16)).substr(-2) + ("0"+Number($2).toString(16)).substr(-2) + ("0"+Number($3).toString(16)).substr(-2);
+ });
+ this.editorUi.pickColor(color, function(newColor)
+ {
+ var targetElt = (tableCell != null && (evt == null || !mxEvent.isShiftDown(evt))) ? tableCell : currentTable;
+
+ graph.processElements(targetElt, function(elt)
+ {
+ elt.style.border = null;
+ });
+
+ if (newColor == null || newColor == mxConstants.NONE)
+ {
+ targetElt.removeAttribute('border');
+ targetElt.style.border = '';
+ targetElt.style.borderCollapse = '';
+ }
+ else
+ {
+ targetElt.setAttribute('border', '1');
+ targetElt.style.border = '1px solid ' + newColor;
+ targetElt.style.borderCollapse = 'collapse';
+ }
+ });
+ }
+ }), tablePanel2),
+ this.editorUi.toolbar.addButton('geSprite-fillcolor', mxResources.get('backgroundColor'),
+ mxUtils.bind(this, function(evt)
+ {
+ // Converts rgb(r,g,b) values
+ if (currentTable != null)
+ {
+ var color = currentTable.style.backgroundColor.replace(
+ /\brgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/g,
+ function($0, $1, $2, $3) {
+ return "#" + ("0"+Number($1).toString(16)).substr(-2) + ("0"+Number($2).toString(16)).substr(-2) + ("0"+Number($3).toString(16)).substr(-2);
+ });
+ this.editorUi.pickColor(color, function(newColor)
+ {
+ var targetElt = (tableCell != null && (evt == null || !mxEvent.isShiftDown(evt))) ? tableCell : currentTable;
+
+ graph.processElements(targetElt, function(elt)
+ {
+ elt.style.backgroundColor = null;
+ });
+
+ if (newColor == null || newColor == mxConstants.NONE)
+ {
+ targetElt.style.backgroundColor = '';
+ }
+ else
+ {
+ targetElt.style.backgroundColor = newColor;
+ }
+ });
+ }
+ }), tablePanel2),
+ this.editorUi.toolbar.addButton('geSprite-fit', mxResources.get('spacing'),
+ function()
+ {
+ if (currentTable != null)
+ {
+ var value = currentTable.getAttribute('cellPadding') || 0;
+
+ var dlg = new FilenameDialog(ui, value, mxResources.get('apply'), mxUtils.bind(this, function(newValue)
+ {
+ if (newValue != null && newValue.length > 0)
+ {
+ currentTable.setAttribute('cellPadding', newValue);
+ }
+ else
+ {
+ currentTable.removeAttribute('cellPadding');
+ }
+ }), mxResources.get('spacing'));
+ ui.showDialog(dlg.container, 300, 80, true, true);
+ dlg.init();
+ }
+ }, tablePanel2),
+ this.editorUi.toolbar.addButton('geSprite-left', mxResources.get('left'),
+ function()
+ {
+ if (currentTable != null)
+ {
+ currentTable.setAttribute('align', 'left');
+ }
+ }, tablePanel2),
+ this.editorUi.toolbar.addButton('geSprite-center', mxResources.get('center'),
+ function()
+ {
+ if (currentTable != null)
+ {
+ currentTable.setAttribute('align', 'center');
+ }
+ }, tablePanel2),
+ this.editorUi.toolbar.addButton('geSprite-right', mxResources.get('right'),
+ function()
+ {
+ if (currentTable != null)
+ {
+ currentTable.setAttribute('align', 'right');
+ }
+ }, tablePanel2)];
+ this.styleButtons(btns);
+ btns[2].style.marginRight = '10px';
+
+ wrapper3.appendChild(tablePanel2);
+ container.appendChild(wrapper3);
+
+ tableWrapper = wrapper3;
+ }
+
+ function setSelected(elt, selected)
+ {
+ elt.style.backgroundImage = (selected) ? (Editor.isDarkMode() ?
+ 'linear-gradient(rgb(0 161 241) 0px, rgb(0, 97, 146) 100%)':
+ 'linear-gradient(#c5ecff 0px,#87d4fb 100%)') : '';
+ };
+
+ // Updates font style state before typing
+ for (var i = 0; i < 3; i++)
+ {
+ (function(index)
+ {
+ mxEvent.addListener(fontStyleItems[index], 'click', function()
+ {
+ setSelected(fontStyleItems[index], fontStyleItems[index].style.backgroundImage == '');
+ });
+ })(i);
+ }
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ ss = ui.getSelectionState();
+ var fontStyle = mxUtils.getValue(ss.style, mxConstants.STYLE_FONTSTYLE, 0);
+ setSelected(fontStyleItems[0], (fontStyle & mxConstants.FONT_BOLD) == mxConstants.FONT_BOLD);
+ setSelected(fontStyleItems[1], (fontStyle & mxConstants.FONT_ITALIC) == mxConstants.FONT_ITALIC);
+ setSelected(fontStyleItems[2], (fontStyle & mxConstants.FONT_UNDERLINE) == mxConstants.FONT_UNDERLINE);
+ fontMenu.firstChild.nodeValue = mxUtils.getValue(ss.style, mxConstants.STYLE_FONTFAMILY, Menus.prototype.defaultFont);
+
+ setSelected(verticalItem, mxUtils.getValue(ss.style, mxConstants.STYLE_HORIZONTAL, '1') == '0');
+
+ if (force || document.activeElement != input)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_FONTSIZE, Menus.prototype.defaultFontSize));
+ input.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ var align = mxUtils.getValue(ss.style, mxConstants.STYLE_ALIGN, mxConstants.ALIGN_CENTER);
+ setSelected(left, align == mxConstants.ALIGN_LEFT);
+ setSelected(center, align == mxConstants.ALIGN_CENTER);
+ setSelected(right, align == mxConstants.ALIGN_RIGHT);
+
+ var valign = mxUtils.getValue(ss.style, mxConstants.STYLE_VERTICAL_ALIGN, mxConstants.ALIGN_MIDDLE);
+ setSelected(top, valign == mxConstants.ALIGN_TOP);
+ setSelected(middle, valign == mxConstants.ALIGN_MIDDLE);
+ setSelected(bottom, valign == mxConstants.ALIGN_BOTTOM);
+
+ var pos = mxUtils.getValue(ss.style, mxConstants.STYLE_LABEL_POSITION, mxConstants.ALIGN_CENTER);
+ var vpos = mxUtils.getValue(ss.style, mxConstants.STYLE_VERTICAL_LABEL_POSITION, mxConstants.ALIGN_MIDDLE);
+
+ if (pos == mxConstants.ALIGN_LEFT && vpos == mxConstants.ALIGN_TOP)
+ {
+ positionSelect.value = 'topLeft';
+ }
+ else if (pos == mxConstants.ALIGN_CENTER && vpos == mxConstants.ALIGN_TOP)
+ {
+ positionSelect.value = 'top';
+ }
+ else if (pos == mxConstants.ALIGN_RIGHT && vpos == mxConstants.ALIGN_TOP)
+ {
+ positionSelect.value = 'topRight';
+ }
+ else if (pos == mxConstants.ALIGN_LEFT && vpos == mxConstants.ALIGN_BOTTOM)
+ {
+ positionSelect.value = 'bottomLeft';
+ }
+ else if (pos == mxConstants.ALIGN_CENTER && vpos == mxConstants.ALIGN_BOTTOM)
+ {
+ positionSelect.value = 'bottom';
+ }
+ else if (pos == mxConstants.ALIGN_RIGHT && vpos == mxConstants.ALIGN_BOTTOM)
+ {
+ positionSelect.value = 'bottomRight';
+ }
+ else if (pos == mxConstants.ALIGN_LEFT)
+ {
+ positionSelect.value = 'left';
+ }
+ else if (pos == mxConstants.ALIGN_RIGHT)
+ {
+ positionSelect.value = 'right';
+ }
+ else
+ {
+ positionSelect.value = 'center';
+ }
+
+ var dir = mxUtils.getValue(ss.style, mxConstants.STYLE_TEXT_DIRECTION, mxConstants.DEFAULT_TEXT_DIRECTION);
+
+ if (dir == mxConstants.TEXT_DIRECTION_RTL)
+ {
+ dirSelect.value = 'rightToLeft';
+ }
+ else if (dir == mxConstants.TEXT_DIRECTION_LTR)
+ {
+ dirSelect.value = 'leftToRight';
+ }
+ else if (dir == mxConstants.TEXT_DIRECTION_AUTO)
+ {
+ dirSelect.value = 'automatic';
+ }
+
+ if (force || document.activeElement != globalSpacing)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_SPACING, 2));
+ globalSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != topSpacing)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_SPACING_TOP, 0));
+ topSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != rightSpacing)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_SPACING_RIGHT, 0));
+ rightSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != bottomSpacing)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_SPACING_BOTTOM, 0));
+ bottomSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != leftSpacing)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_SPACING_LEFT, 0));
+ leftSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+ });
+
+ globalUpdate = this.installInputHandler(globalSpacing, mxConstants.STYLE_SPACING, 2, -999, 999, ' pt');
+ topUpdate = this.installInputHandler(topSpacing, mxConstants.STYLE_SPACING_TOP, 0, -999, 999, ' pt');
+ rightUpdate = this.installInputHandler(rightSpacing, mxConstants.STYLE_SPACING_RIGHT, 0, -999, 999, ' pt');
+ bottomUpdate = this.installInputHandler(bottomSpacing, mxConstants.STYLE_SPACING_BOTTOM, 0, -999, 999, ' pt');
+ leftUpdate = this.installInputHandler(leftSpacing, mxConstants.STYLE_SPACING_LEFT, 0, -999, 999, ' pt');
+
+ this.addKeyHandler(input, listener);
+ this.addKeyHandler(globalSpacing, listener);
+ this.addKeyHandler(topSpacing, listener);
+ this.addKeyHandler(rightSpacing, listener);
+ this.addKeyHandler(bottomSpacing, listener);
+ this.addKeyHandler(leftSpacing, listener);
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+
+ if (graph.cellEditor.isContentEditing())
+ {
+ var updating = false;
+
+ var updateCssHandler = function()
+ {
+ if (!updating)
+ {
+ updating = true;
+
+ window.setTimeout(function()
+ {
+ var node = graph.getSelectedEditingElement();
+
+ if (node != null)
+ {
+ function getRelativeLineHeight(fontSize, css, elt)
+ {
+ if (elt.style != null && css != null)
+ {
+ var lineHeight = css.lineHeight
+
+ if (elt.style.lineHeight != null && elt.style.lineHeight.substring(elt.style.lineHeight.length - 1) == '%')
+ {
+ return parseInt(elt.style.lineHeight) / 100;
+ }
+ else
+ {
+ return (lineHeight.substring(lineHeight.length - 2) == 'px') ?
+ parseFloat(lineHeight) / fontSize : parseInt(lineHeight);
+ }
+ }
+ else
+ {
+ return '';
+ }
+ };
+
+ function getAbsoluteFontSize(css)
+ {
+ var fontSize = (css != null) ? css.fontSize : null;
+
+ if (fontSize != null && fontSize.substring(fontSize.length - 2) == 'px')
+ {
+ return parseFloat(fontSize);
+ }
+ else
+ {
+ return mxConstants.DEFAULT_FONTSIZE;
+ }
+ };
+
+ var css = mxUtils.getCurrentStyle(node);
+ var fontSize = getAbsoluteFontSize(css);
+ var lineHeight = getRelativeLineHeight(fontSize, css, node);
+
+ // Finds common font size
+ var elts = node.getElementsByTagName('*');
+
+ // IE does not support containsNode
+ if (elts.length > 0 && window.getSelection && !mxClient.IS_IE && !mxClient.IS_IE11)
+ {
+ var selection = window.getSelection();
+
+ for (var i = 0; i < elts.length; i++)
+ {
+ if (selection.containsNode(elts[i], true))
+ {
+ temp = mxUtils.getCurrentStyle(elts[i]);
+ fontSize = Math.max(getAbsoluteFontSize(temp), fontSize);
+ var lh = getRelativeLineHeight(fontSize, temp, elts[i]);
+
+ if (lh != lineHeight || isNaN(lh))
+ {
+ lineHeight = '';
+ }
+ }
+ }
+ }
+
+ function hasParentOrOnlyChild(name)
+ {
+ if (graph.getParentByName(node, name, graph.cellEditor.textarea) != null)
+ {
+ return true;
+ }
+ else
+ {
+ var child = node;
+
+ while (child != null && child.childNodes.length == 1)
+ {
+ child = child.childNodes[0];
+
+ if (child.nodeName == name)
+ {
+ return true;
+ }
+ }
+ }
+
+ return false;
+ };
+
+ function isEqualOrPrefixed(str, value)
+ {
+ if (str != null && value != null)
+ {
+ if (str == value)
+ {
+ return true;
+ }
+ else if (str.length > value.length + 1)
+ {
+ return str.substring(str.length - value.length - 1, str.length) == '-' + value;
+ }
+ }
+
+ return false;
+ };
+
+ if (css != null)
+ {
+ setSelected(fontStyleItems[0], css.fontWeight == 'bold' ||
+ css.fontWeight > 400 || hasParentOrOnlyChild('B') ||
+ hasParentOrOnlyChild('STRONG'));
+ setSelected(fontStyleItems[1], css.fontStyle == 'italic' ||
+ hasParentOrOnlyChild('I') || hasParentOrOnlyChild('EM'));
+ setSelected(fontStyleItems[2], hasParentOrOnlyChild('U'));
+ setSelected(sup, hasParentOrOnlyChild('SUP'));
+ setSelected(sub, hasParentOrOnlyChild('SUB'));
+
+ if (!graph.cellEditor.isTableSelected())
+ {
+ var align = graph.cellEditor.align || mxUtils.getValue(ss.style, mxConstants.STYLE_ALIGN, mxConstants.ALIGN_CENTER);
+
+ if (isEqualOrPrefixed(css.textAlign, 'justify'))
+ {
+ setSelected(full, isEqualOrPrefixed(css.textAlign, 'justify'));
+ setSelected(left, false);
+ setSelected(center, false);
+ setSelected(right, false);
+ }
+ else
+ {
+ setSelected(full, false);
+ setSelected(left, align == mxConstants.ALIGN_LEFT);
+ setSelected(center, align == mxConstants.ALIGN_CENTER);
+ setSelected(right, align == mxConstants.ALIGN_RIGHT);
+ }
+ }
+ else
+ {
+ setSelected(full, isEqualOrPrefixed(css.textAlign, 'justify'));
+ setSelected(left, isEqualOrPrefixed(css.textAlign, 'left'));
+ setSelected(center, isEqualOrPrefixed(css.textAlign, 'center'));
+ setSelected(right, isEqualOrPrefixed(css.textAlign, 'right'));
+ }
+
+ currentTable = graph.getParentByName(node, 'TABLE', graph.cellEditor.textarea);
+ tableRow = (currentTable == null) ? null : graph.getParentByName(node, 'TR', currentTable);
+ tableCell = (currentTable == null) ? null : graph.getParentByNames(node, ['TD', 'TH'], currentTable);
+ tableWrapper.style.display = (currentTable != null) ? '' : 'none';
+
+ if (document.activeElement != input)
+ {
+ if (node.nodeName == 'FONT' && node.getAttribute('size') == '4' &&
+ pendingFontSize != null)
+ {
+ node.removeAttribute('size');
+ node.style.fontSize = pendingFontSize + ' pt';
+ pendingFontSize = null;
+ }
+ else
+ {
+ input.value = (isNaN(fontSize)) ? '' : fontSize + ' pt';
+ }
+
+ var lh = parseFloat(lineHeight);
+
+ if (!isNaN(lh))
+ {
+ lineHeightInput.value = Math.round(lh * 100) + ' %';
+ }
+ else
+ {
+ lineHeightInput.value = '100 %';
+ }
+ }
+
+ // Updates the color picker for the current font
+ if (fontColorApply != null)
+ {
+ if (css.color == 'rgba(0, 0, 0, 0)' ||
+ css.color == 'transparent')
+ {
+ currentFontColor = mxConstants.NONE;
+ }
+ else
+ {
+ currentFontColor = mxUtils.rgba2hex(css.color)
+ }
+
+ fontColorApply(currentFontColor, true);
+ }
+
+ if (bgColorApply != null)
+ {
+ if (css.backgroundColor == 'rgba(0, 0, 0, 0)' ||
+ css.backgroundColor == 'transparent')
+ {
+ currentBgColor = mxConstants.NONE;
+ }
+ else
+ {
+ currentBgColor = mxUtils.rgba2hex(css.backgroundColor);
+ }
+
+ bgColorApply(currentBgColor, true);
+ }
+
+ // Workaround for firstChild is null or not an object
+ // in the log which seems to be IE8- only / 29.01.15
+ if (fontMenu.firstChild != null)
+ {
+ fontMenu.firstChild.nodeValue = Graph.stripQuotes(css.fontFamily);
+ }
+ }
+ }
+
+ updating = false;
+ }, 0);
+ }
+ };
+
+ if (mxClient.IS_FF || mxClient.IS_EDGE || mxClient.IS_IE || mxClient.IS_IE11)
+ {
+ mxEvent.addListener(graph.cellEditor.textarea, 'DOMSubtreeModified', updateCssHandler);
+ }
+
+ mxEvent.addListener(graph.cellEditor.textarea, 'input', updateCssHandler);
+ mxEvent.addListener(graph.cellEditor.textarea, 'touchend', updateCssHandler);
+ mxEvent.addListener(graph.cellEditor.textarea, 'mouseup', updateCssHandler);
+ mxEvent.addListener(graph.cellEditor.textarea, 'keyup', updateCssHandler);
+ this.listeners.push({destroy: function()
+ {
+ // No need to remove listener since textarea is destroyed after edit
+ }});
+ updateCssHandler();
+ }
+
+ return container;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel = function(format, editorUi, container)
+{
+ BaseFormatPanel.call(this, format, editorUi, container);
+ this.init();
+};
+
+mxUtils.extend(StyleFormatPanel, BaseFormatPanel);
+
+/**
+ *
+ */
+StyleFormatPanel.prototype.defaultStrokeColor = 'black';
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.init = function()
+{
+ var ui = this.editorUi;
+ var ss = ui.getSelectionState();
+
+ if (!ss.containsLabel && ss.cells.length > 0)
+ {
+ if (ss.containsImage && ss.vertices.length == 1 && ss.style.shape == 'image' &&
+ ss.style.image != null && ss.style.image.substring(0, 19) == 'data:image/svg+xml;')
+ {
+ this.container.appendChild(this.addSvgStyles(this.createPanel()));
+ }
+
+ if (ss.fill)
+ {
+ this.container.appendChild(this.addFill(this.createPanel()));
+ }
+
+ this.container.appendChild(this.addStroke(this.createPanel()));
+ this.container.appendChild(this.addLineJumps(this.createPanel()));
+ var opacityPanel = this.createRelativeOption(mxResources.get('opacity'), mxConstants.STYLE_OPACITY);
+ opacityPanel.style.paddingTop = '8px';
+ opacityPanel.style.paddingBottom = '10px';
+ this.container.appendChild(opacityPanel);
+ this.container.appendChild(this.addEffects(this.createPanel()));
+ }
+
+ var opsPanel = this.createPanel();
+ opsPanel.style.paddingTop = '8px';
+
+ if (ss.cells.length == 1)
+ {
+ this.addEditOps(opsPanel);
+
+ if (opsPanel.firstChild != null)
+ {
+ mxUtils.br(opsPanel);
+ }
+ }
+
+ if (ss.cells.length >= 1)
+ {
+ this.addStyleOps(opsPanel);
+ }
+
+ if (opsPanel.firstChild != null)
+ {
+ this.container.appendChild(opsPanel);
+ }
+};
+
+/**
+ * Use browser for parsing CSS.
+ */
+StyleFormatPanel.prototype.getCssRules = function(css)
+{
+ var doc = document.implementation.createHTMLDocument('');
+ var styleElement = document.createElement('style');
+
+ mxUtils.setTextContent(styleElement, css);
+ doc.body.appendChild(styleElement);
+
+ return styleElement.sheet.cssRules;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addSvgStyles = function(container)
+{
+ var ui = this.editorUi;
+ var ss = ui.getSelectionState();
+ container.style.paddingTop = '6px';
+ container.style.paddingBottom = '6px';
+ container.style.fontWeight = 'bold';
+ container.style.display = 'none';
+
+ try
+ {
+ var exp = ss.style.editableCssRules;
+
+ if (exp != null)
+ {
+ var regex = new RegExp(exp);
+
+ var data = ss.style.image.substring(ss.style.image.indexOf(',') + 1);
+ var xml = (window.atob) ? atob(data) : Base64.decode(data, true);
+ var svg = mxUtils.parseXml(xml);
+
+ if (svg != null)
+ {
+ var styles = svg.getElementsByTagName('style');
+
+ for (var i = 0; i < styles.length; i++)
+ {
+ var rules = this.getCssRules(mxUtils.getTextContent(styles[i]));
+
+ for (var j = 0; j < rules.length; j++)
+ {
+ this.addSvgRule(container, rules[j], svg, styles[i], rules, j, regex);
+ }
+ }
+ }
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+
+ return container;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addSvgRule = function(container, rule, svg, styleElem, rules, ruleIndex, regex)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+
+ if (regex.test(rule.selectorText))
+ {
+ function rgb2hex(rgb)
+ {
+ rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
+
+ return (rgb && rgb.length === 4) ? "#" +
+ ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
+ ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
+ ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
+ };
+
+ var addStyleRule = mxUtils.bind(this, function(rule, key, label)
+ {
+ var value = mxUtils.trim(rule.style[key]);
+
+ if (value != '' && value.substring(0, 4) != 'url(')
+ {
+ var option = this.createColorOption(label + ' ' + rule.selectorText, function()
+ {
+ return rgb2hex(value);
+ }, mxUtils.bind(this, function(color)
+ {
+ rules[ruleIndex].style[key] = color;
+ var cssTxt = '';
+
+ for (var i = 0; i < rules.length; i++)
+ {
+ cssTxt += rules[i].cssText + ' ';
+ }
+
+ styleElem.textContent = cssTxt;
+ var xml = mxUtils.getXml(svg.documentElement);
+
+ graph.setCellStyles(mxConstants.STYLE_IMAGE, 'data:image/svg+xml,' +
+ ((window.btoa) ? btoa(xml) : Base64.encode(xml, true)),
+ ui.getSelectionState().cells);
+ }), '#ffffff',
+ {
+ install: function(apply)
+ {
+ // ignore
+ },
+ destroy: function()
+ {
+ // ignore
+ }
+ });
+
+ container.appendChild(option);
+
+ // Shows container if rules are added
+ container.style.display = '';
+ }
+ });
+
+ addStyleRule(rule, 'fill', mxResources.get('fill'));
+ addStyleRule(rule, 'stroke', mxResources.get('line'));
+ addStyleRule(rule, 'stop-color', mxResources.get('gradient'));
+ }
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addEditOps = function(div)
+{
+ var ss = this.editorUi.getSelectionState();
+
+ if (ss.cells.length == 1)
+ {
+ var editSelect = document.createElement('select');
+ editSelect.style.width = '210px';
+ editSelect.style.textAlign = 'center';
+ editSelect.style.marginBottom = '2px';
+
+ var ops = ['edit', 'editLink', 'editShape', 'editImage', 'editData',
+ 'copyData', 'pasteData', 'editConnectionPoints', 'editGeometry',
+ 'editTooltip', 'editStyle'];
+
+ for (var i = 0; i < ops.length; i++)
+ {
+ var action = this.editorUi.actions.get(ops[i]);
+
+ if (action == null || action.enabled)
+ {
+ var editOption = document.createElement('option');
+ editOption.setAttribute('value', ops[i]);
+ var title = mxResources.get(ops[i]);
+ mxUtils.write(editOption, title + ((ops[i] == 'edit') ? '' : '...'));
+
+ if (action != null && action.shortcut != null)
+ {
+ title += ' (' + action.shortcut + ')';
+ }
+
+ editOption.setAttribute('title', title);
+ editSelect.appendChild(editOption);
+ }
+ }
+
+ if (editSelect.children.length > 1)
+ {
+ div.appendChild(editSelect);
+
+ mxEvent.addListener(editSelect, 'change', mxUtils.bind(this, function(evt)
+ {
+ var action = this.editorUi.actions.get(editSelect.value);
+ editSelect.value = 'edit';
+
+ if (action != null)
+ {
+ action.funct();
+ }
+ }));
+
+ if (ss.image && ss.cells.length > 0)
+ {
+ var graph = this.editorUi.editor.graph;
+ var state = graph.view.getState(graph.getSelectionCell());
+
+ if (state != null && mxUtils.getValue(state.style, mxConstants.STYLE_IMAGE, null) != null)
+ {
+ var btn = mxUtils.button(mxResources.get('crop') + '...',
+ mxUtils.bind(this, function(evt)
+ {
+ this.editorUi.actions.get('crop').funct();
+ }));
+
+ btn.setAttribute('title', mxResources.get('crop'));
+ editSelect.style.width = '104px';
+ btn.style.width = '104px';
+ btn.style.marginLeft = '2px';
+ btn.style.marginBottom = '2px';
+
+ div.appendChild(btn);
+ }
+ }
+ }
+ }
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addFill = function(container)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var ss = ui.getSelectionState();
+ container.style.paddingTop = '6px';
+ container.style.paddingBottom = '6px';
+
+ // Adds gradient direction option
+ var gradientSelect = document.createElement('select');
+ gradientSelect.style.position = 'absolute';
+ gradientSelect.style.left = '104px';
+ gradientSelect.style.width = '70px';
+ gradientSelect.style.height = '22px';
+ gradientSelect.style.padding = '0px';
+ gradientSelect.style.marginTop = '-3px';
+ gradientSelect.style.borderWidth = '1px';
+ gradientSelect.style.borderStyle = 'solid';
+ gradientSelect.style.boxSizing = 'border-box';
+
+ var fillStyleSelect = gradientSelect.cloneNode(false);
+
+ // Stops events from bubbling to color option event handler
+ mxEvent.addListener(gradientSelect, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+ mxEvent.addListener(fillStyleSelect, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+
+ var gradientPanel = this.createCellColorOption(mxResources.get('gradient'),
+ mxConstants.STYLE_GRADIENTCOLOR, 'default', function(color)
+ {
+ if (color == null || color == mxConstants.NONE)
+ {
+ gradientSelect.style.display = 'none';
+ }
+ else
+ {
+ gradientSelect.style.display = '';
+ }
+ }, function(color)
+ {
+ graph.updateCellStyles({'gradientColor': color}, graph.getSelectionCells());
+ }, graph.getDefaultColor(ss.style, mxConstants.STYLE_GRADIENTCOLOR,
+ graph.shapeForegroundColor, graph.shapeBackgroundColor));
+
+ var fillKey = (ss.style.shape == 'image') ? mxConstants.STYLE_IMAGE_BACKGROUND : mxConstants.STYLE_FILLCOLOR;
+
+ var fillPanel = this.createCellColorOption(mxResources.get('fill'),
+ fillKey, 'default', null, mxUtils.bind(this, function(color)
+ {
+ graph.setCellStyles(fillKey, color, ss.cells);
+ }), graph.getDefaultColor(ss.style, fillKey, graph.shapeBackgroundColor,
+ graph.shapeForegroundColor));
+
+ fillPanel.style.fontWeight = 'bold';
+ var tmpColor = mxUtils.getValue(ss.style, fillKey, null);
+ gradientPanel.style.display = (tmpColor != null && tmpColor != mxConstants.NONE &&
+ ss.fill && ss.style.shape != 'image') ? '' : 'none';
+
+ var directions = [mxConstants.DIRECTION_NORTH, mxConstants.DIRECTION_EAST,
+ mxConstants.DIRECTION_SOUTH, mxConstants.DIRECTION_WEST,
+ mxConstants.DIRECTION_RADIAL];
+
+ for (var i = 0; i < directions.length; i++)
+ {
+ var gradientOption = document.createElement('option');
+ gradientOption.setAttribute('value', directions[i]);
+ mxUtils.write(gradientOption, mxResources.get(directions[i]));
+ gradientSelect.appendChild(gradientOption);
+ }
+
+ gradientPanel.appendChild(gradientSelect);
+
+ var curFillStyle;
+
+ function populateFillStyle()
+ {
+ fillStyleSelect.innerHTML = '';
+ curFillStyle = 1;
+
+ for (var i = 0; i < Editor.fillStyles.length; i++)
+ {
+ var fillStyleOption = document.createElement('option');
+ fillStyleOption.setAttribute('value', Editor.fillStyles[i].val);
+ mxUtils.write(fillStyleOption, Editor.fillStyles[i].dispName);
+ fillStyleSelect.appendChild(fillStyleOption);
+ }
+ };
+
+ function populateRoughFillStyle()
+ {
+ fillStyleSelect.innerHTML = '';
+ curFillStyle = 2;
+
+ for (var i = 0; i < Editor.roughFillStyles.length; i++)
+ {
+ var fillStyleOption = document.createElement('option');
+ fillStyleOption.setAttribute('value', Editor.roughFillStyles[i].val);
+ mxUtils.write(fillStyleOption, Editor.roughFillStyles[i].dispName);
+ fillStyleSelect.appendChild(fillStyleOption);
+ }
+
+ fillStyleSelect.value = 'auto';
+ };
+
+ populateFillStyle();
+
+ if (ss.gradient)
+ {
+ fillPanel.appendChild(fillStyleSelect);
+ }
+
+ var listener = mxUtils.bind(this, function()
+ {
+ ss = ui.getSelectionState();
+ var value = mxUtils.getValue(ss.style, mxConstants.STYLE_GRADIENT_DIRECTION,
+ mxConstants.DIRECTION_SOUTH);
+ var fillStyle = mxUtils.getValue(ss.style, 'fillStyle', 'auto');
+
+ // Handles empty string which is not allowed as a value
+ if (value == '')
+ {
+ value = mxConstants.DIRECTION_SOUTH;
+ }
+
+ gradientSelect.value = value;
+ container.style.display = (ss.fill) ? '' : 'none';
+
+ var fillColor = mxUtils.getValue(ss.style, fillKey, null);
+
+ if (!ss.fill || fillColor == null || fillColor == mxConstants.NONE ||
+ ss.style.shape == 'filledEdge')
+ {
+ fillStyleSelect.style.display = 'none';
+ gradientPanel.style.display = 'none';
+ }
+ else
+ {
+ if (ss.style.sketch == '1')
+ {
+ if (curFillStyle != 2)
+ {
+ populateRoughFillStyle()
+ }
+ }
+ else if (curFillStyle != 1)
+ {
+ populateFillStyle();
+ }
+
+ fillStyleSelect.value = fillStyle;
+
+ //In case of switching from sketch to regular and fill type is not there
+ if (!fillStyleSelect.value)
+ {
+ fillStyle = 'auto';
+ fillStyleSelect.value = fillStyle;
+ }
+
+ fillStyleSelect.style.display = ss.style.sketch == '1' ||
+ gradientSelect.style.display == 'none'? '' : 'none';
+ gradientPanel.style.display = (ss.gradient &&
+ !ss.containsImage && (ss.style.sketch != '1' ||
+ fillStyle == 'solid' || fillStyle == 'auto')) ?
+ '' : 'none';
+ }
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+
+ mxEvent.addListener(gradientSelect, 'change', function(evt)
+ {
+ graph.setCellStyles(mxConstants.STYLE_GRADIENT_DIRECTION, gradientSelect.value, ss.cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', [mxConstants.STYLE_GRADIENT_DIRECTION],
+ 'values', [gradientSelect.value], 'cells', ss.cells));
+ mxEvent.consume(evt);
+ });
+
+ mxEvent.addListener(fillStyleSelect, 'change', function(evt)
+ {
+ graph.setCellStyles('fillStyle', fillStyleSelect.value, ss.cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', ['fillStyle'],
+ 'values', [fillStyleSelect.value], 'cells', ss.cells));
+ mxEvent.consume(evt);
+ });
+
+ container.appendChild(fillPanel);
+ container.appendChild(gradientPanel);
+
+ // Adds custom colors
+ var custom = this.getCustomColors();
+
+ for (var i = 0; i < custom.length; i++)
+ {
+ container.appendChild(this.createCellColorOption(custom[i].title,
+ custom[i].key, custom[i].defaultValue));
+ }
+
+ return container;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.getCustomColors = function()
+{
+ var ss = this.editorUi.getSelectionState();
+ var result = [];
+
+ if (ss.swimlane)
+ {
+ result.push({title: mxResources.get('laneColor'),
+ key: 'swimlaneFillColor', defaultValue: 'default'});
+ }
+
+ return result;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addStroke = function(container)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var ss = ui.getSelectionState();
+
+ container.style.paddingTop = '6px';
+ container.style.paddingBottom = '4px';
+ container.style.whiteSpace = 'normal';
+
+ var colorPanel = document.createElement('div');
+ colorPanel.style.fontWeight = 'bold';
+
+ if (!ss.stroke)
+ {
+ colorPanel.style.display = 'none';
+ }
+
+ // Adds gradient direction option
+ var styleSelect = document.createElement('select');
+ styleSelect.style.position = 'absolute';
+ styleSelect.style.height = '22px';
+ styleSelect.style.padding = '0px';
+ styleSelect.style.marginTop = '-3px';
+ styleSelect.style.textAlign = 'center';
+ styleSelect.style.boxSizing = 'border-box';
+ styleSelect.style.left = '90px';
+ styleSelect.style.width = '83px';
+ styleSelect.style.borderWidth = '1px';
+ styleSelect.style.borderStyle = 'solid';
+
+ var styles = ['sharp', 'rounded', 'curved'];
+
+ for (var i = 0; i < styles.length; i++)
+ {
+ var styleOption = document.createElement('option');
+ styleOption.setAttribute('value', styles[i]);
+ mxUtils.write(styleOption, mxResources.get(styles[i]));
+ styleSelect.appendChild(styleOption);
+ }
+
+ mxEvent.addListener(styleSelect, 'change', function(evt)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var keys = [mxConstants.STYLE_ROUNDED, mxConstants.STYLE_CURVED];
+ // Default for rounded is 1
+ var values = ['0', null];
+
+ if (styleSelect.value == 'rounded')
+ {
+ values = ['1', null];
+ }
+ else if (styleSelect.value == 'curved')
+ {
+ values = [null, '1'];
+ }
+
+ for (var i = 0; i < keys.length; i++)
+ {
+ graph.setCellStyles(keys[i], values[i], ss.cells);
+ }
+
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', keys,
+ 'values', values, 'cells', ss.cells));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ // Stops events from bubbling to color option event handler
+ mxEvent.addListener(styleSelect, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+
+ var strokeKey = (ss.style.shape == 'image') ? mxConstants.STYLE_IMAGE_BORDER : mxConstants.STYLE_STROKECOLOR;
+ var label = (ss.style.shape == 'image') ? mxResources.get('border') : mxResources.get('line');
+
+ var lineColor = this.createCellColorOption(label, strokeKey, 'default', null, mxUtils.bind(this, function(color)
+ {
+ graph.setCellStyles(strokeKey, color, ss.cells);
+
+ // Sets strokeColor to inherit for rows and cells in tables
+ if (color == null || color == mxConstants.NONE)
+ {
+ var tableCells = [];
+
+ for (var i = 0; i < ss.cells.length; i++)
+ {
+ if (graph.isTableCell(ss.cells[i]) ||
+ graph.isTableRow(ss.cells[i]))
+ {
+ tableCells.push(ss.cells[i]);
+ }
+ }
+
+ if (tableCells.length > 0)
+ {
+ graph.setCellStyles(strokeKey, 'inherit', tableCells);
+ }
+ }
+ }), graph.shapeForegroundColor);
+
+ lineColor.appendChild(styleSelect);
+ colorPanel.appendChild(lineColor);
+
+ // Used if only edges selected
+ var stylePanel = colorPanel.cloneNode(false);
+ stylePanel.style.display = 'inline-flex';
+ stylePanel.style.alignItems = 'top';
+ stylePanel.style.fontWeight = 'normal';
+ stylePanel.style.whiteSpace = 'nowrap';
+ stylePanel.style.position = 'relative';
+ stylePanel.style.paddingLeft = '5px';
+ stylePanel.style.overflow = 'hidden';
+ stylePanel.style.marginTop = '2px';
+ stylePanel.style.width = '220px';
+
+ var addItem = mxUtils.bind(this, function(menu, width, cssName, keys, values)
+ {
+ var item = this.editorUi.menus.styleChange(menu, '', keys, values, 'geIcon', null);
+
+ var pat = document.createElement('div');
+ pat.style.width = width + 'px';
+ pat.style.height = '1px';
+ pat.style.borderBottom = '1px ' + cssName + ' ' + this.defaultStrokeColor;
+ pat.style.paddingTop = '6px';
+
+ item.firstChild.firstChild.style.padding = '0px 4px 0px 4px';
+ item.firstChild.firstChild.style.width = width + 'px';
+ item.firstChild.firstChild.appendChild(pat);
+
+ return item;
+ });
+
+ var pattern = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel, 'geSprite-orthogonal', mxResources.get('pattern'), false, mxUtils.bind(this, function(menu)
+ {
+ addItem(menu, 75, 'solid', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], [null, null]).setAttribute('title', mxResources.get('solid'));
+ addItem(menu, 75, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', null]).setAttribute('title', mxResources.get('dashed') + ' (1)');
+ addItem(menu, 75, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '8 8']).setAttribute('title', mxResources.get('dashed') + ' (2)');
+ addItem(menu, 75, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '12 12']).setAttribute('title', mxResources.get('dashed') + ' (3)');
+ addItem(menu, 75, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 1']).setAttribute('title', mxResources.get('dotted') + ' (1)');
+ addItem(menu, 75, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 2']).setAttribute('title', mxResources.get('dotted') + ' (2)');
+ addItem(menu, 75, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 4']).setAttribute('title', mxResources.get('dotted') + ' (3)');
+ }));
+
+ // Used for mixed selection (vertices and edges)
+ var altStylePanel = stylePanel.cloneNode(false);
+
+ var edgeShape = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-connection', mxResources.get('connection'), false, mxUtils.bind(this, function(menu)
+ {
+ this.editorUi.menus.styleChange(menu, '', [mxConstants.STYLE_SHAPE, mxConstants.STYLE_STARTSIZE, mxConstants.STYLE_ENDSIZE, 'width'],
+ [null, null, null, null], 'geIcon geSprite geSprite-connection', null, null, null, true).setAttribute('title', mxResources.get('line'));
+ this.editorUi.menus.styleChange(menu, '', [mxConstants.STYLE_SHAPE, mxConstants.STYLE_STARTSIZE, mxConstants.STYLE_ENDSIZE, 'width'],
+ ['link', null, null, null], 'geIcon geSprite geSprite-linkedge', null, null, null, true).setAttribute('title', mxResources.get('link'));
+ this.editorUi.menus.styleChange(menu, '', [mxConstants.STYLE_SHAPE, mxConstants.STYLE_STARTSIZE, mxConstants.STYLE_ENDSIZE, 'width'],
+ ['flexArrow', null, null, null], 'geIcon geSprite geSprite-arrow', null, null, null, true).setAttribute('title', mxResources.get('arrow'));
+ this.editorUi.menus.styleChange(menu, '', [mxConstants.STYLE_SHAPE, mxConstants.STYLE_STARTSIZE, mxConstants.STYLE_ENDSIZE, 'width'],
+ ['arrow', null, null, null], 'geIcon geSprite geSprite-simplearrow', null, null, null, true).setAttribute('title', mxResources.get('simpleArrow'));
+ }));
+
+ var altPattern = this.editorUi.toolbar.addMenuFunctionInContainer(altStylePanel, 'geSprite-orthogonal', mxResources.get('pattern'), false, mxUtils.bind(this, function(menu)
+ {
+ addItem(menu, 33, 'solid', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], [null, null]).setAttribute('title', mxResources.get('solid'));
+ addItem(menu, 33, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', null]).setAttribute('title', mxResources.get('dashed') + ' (1)');
+ addItem(menu, 33, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '8 8']).setAttribute('title', mxResources.get('dashed') + ' (2)');
+ addItem(menu, 33, 'dashed', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '12 12']).setAttribute('title', mxResources.get('dashed') + ' (3)');
+ addItem(menu, 33, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 1']).setAttribute('title', mxResources.get('dotted') + ' (1)');
+ addItem(menu, 33, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 2']).setAttribute('title', mxResources.get('dotted') + ' (2)');
+ addItem(menu, 33, 'dotted', [mxConstants.STYLE_DASHED, mxConstants.STYLE_DASH_PATTERN], ['1', '1 4']).setAttribute('title', mxResources.get('dotted') + ' (3)');
+ }));
+
+ var stylePanel2 = stylePanel.cloneNode(false);
+
+ // Stroke width
+ var input = document.createElement('input');
+ input.style.position = 'absolute';
+ input.style.textAlign = 'right';
+ input.style.marginTop = '2px';
+ input.style.width = '52px';
+ input.style.height = '22px';
+ input.style.left = '146px';
+ input.style.borderWidth = '1px';
+ input.style.borderStyle = 'solid';
+ input.style.boxSizing = 'border-box';
+ input.setAttribute('title', mxResources.get('linewidth'));
+
+ stylePanel.appendChild(input);
+
+ var altInput = input.cloneNode(true);
+ altStylePanel.appendChild(altInput);
+
+ function update(evt)
+ {
+ // Maximum stroke width is 999
+ var value = parseFloat(input.value);
+ value = Math.min(999, Math.max(0, (isNaN(value)) ? 1 : value));
+
+ if (value != mxUtils.getValue(ss.style, mxConstants.STYLE_STROKEWIDTH, 1))
+ {
+ graph.setCellStyles(mxConstants.STYLE_STROKEWIDTH, value, ss.cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', [mxConstants.STYLE_STROKEWIDTH],
+ 'values', [value], 'cells', ss.cells));
+ }
+
+ input.value = value + ' pt';
+ mxEvent.consume(evt);
+ };
+
+ function altUpdate(evt)
+ {
+ // Maximum stroke width is 999
+ var value = parseFloat(altInput.value);
+ value = Math.min(999, Math.max(0, (isNaN(value)) ? 1 : value));
+
+ if (value != mxUtils.getValue(ss.style, mxConstants.STYLE_STROKEWIDTH, 1))
+ {
+ graph.setCellStyles(mxConstants.STYLE_STROKEWIDTH, value, ss.cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', [mxConstants.STYLE_STROKEWIDTH],
+ 'values', [value], 'cells', ss.cells));
+ }
+
+ altInput.value = value + ' pt';
+ mxEvent.consume(evt);
+ };
+
+ var stepper = this.createStepper(input, update, 1, 9);
+ stepper.style.display = input.style.display;
+ stepper.style.top = '2px';
+ stepper.style.left = '198px';
+ stylePanel.appendChild(stepper);
+
+ var altStepper = this.createStepper(altInput, altUpdate, 1, 9);
+ altStepper.style.display = altInput.style.display;
+ altInput.style.position = 'absolute';
+ altStepper.style.top = '2px';
+ altStepper.style.left = '198px';
+ altStylePanel.appendChild(altStepper);
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+
+ mxEvent.addListener(altInput, 'blur', altUpdate);
+ mxEvent.addListener(altInput, 'change', altUpdate);
+
+ var edgeStyle = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-orthogonal', mxResources.get('waypoints'), false, mxUtils.bind(this, function(menu)
+ {
+ if (ss.style.shape != 'arrow')
+ {
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], [null, null, null], 'geIcon geSprite geSprite-straight', null, true).setAttribute('title', mxResources.get('straight'));
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['orthogonalEdgeStyle', null, null], 'geIcon geSprite geSprite-orthogonal', null, true).setAttribute('title', mxResources.get('orthogonal'));
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_ELBOW, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['elbowEdgeStyle', null, null, null], 'geIcon geSprite geSprite-horizontalelbow', null, true).setAttribute('title', mxResources.get('vertical'));
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_ELBOW, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['elbowEdgeStyle', 'vertical', null, null], 'geIcon geSprite geSprite-verticalelbow', null, true).setAttribute('title', mxResources.get('horizontal'));
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_ELBOW, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['isometricEdgeStyle', null, null, null], 'geIcon geSprite geSprite-horizontalisometric', null, true).setAttribute('title', mxResources.get('isometric'));
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_ELBOW, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['isometricEdgeStyle', 'vertical', null, null], 'geIcon geSprite geSprite-verticalisometric', null, true).setAttribute('title', mxResources.get('isometric'));
+
+ if (ss.style.shape == 'connector')
+ {
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['orthogonalEdgeStyle', '1', null], 'geIcon geSprite geSprite-curved', null, true).setAttribute('title', mxResources.get('curved'));
+ }
+
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_EDGE, mxConstants.STYLE_CURVED, mxConstants.STYLE_NOEDGESTYLE], ['entityRelationEdgeStyle', null, null], 'geIcon geSprite geSprite-entity', null, true).setAttribute('title', mxResources.get('entityRelation'));
+ }
+ }));
+
+ var lineStart = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-startclassic', mxResources.get('linestart'), false, mxUtils.bind(this, function(menu)
+ {
+ if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge' || ss.style.shape == 'wire')
+ {
+ var item = this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.NONE, 0], 'geIcon', null, false);
+ item.setAttribute('title', mxResources.get('none'));
+
+ var font = document.createElement('span');
+ font.style.fontSize = '11px';
+ mxUtils.write(font, mxResources.get('none'));
+ item.firstChild.firstChild.appendChild(font);
+
+ if (ss.style.shape == 'connector' || ss.style.shape == 'filledEdge' || ss.style.shape == 'wire')
+ {
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_CLASSIC, 1], null, null, false, Format.classicFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_CLASSIC_THIN, 1], null, null, false, Format.classicThinFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_OPEN, 0], null, null, false, Format.openFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_OPEN_THIN, 0], null, null, false, Format.openThinFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['openAsync', 0], null, null, false, Format.openAsyncFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_BLOCK, 1], null, null, false, Format.blockFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_BLOCK_THIN, 1], null, null, false, Format.blockThinFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['async', 1], null, null, false, Format.asyncFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_OVAL, 1], null, null, false, Format.ovalFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_DIAMOND, 1], null, null, false, Format.diamondFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_DIAMOND_THIN, 1], null, null, false, Format.diamondThinFilledMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_CLASSIC, 0], null, null, false, Format.classicMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_CLASSIC_THIN, 0], null, null, false, Format.classicThinMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_BLOCK, 0], null, null, false, Format.blockMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_BLOCK_THIN, 0], null, null, false, Format.blockThinMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['async', 0], null, null, false, Format.asyncMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_OVAL, 0], null, null, false, Format.ovalMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_DIAMOND, 0], null, null, false, Format.diamondMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], [mxConstants.ARROW_DIAMOND_THIN, 0], null, null, false, Format.diamondThinMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['box', 0], null, null, false, Format.boxMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['halfCircle', 0], null, null, false, Format.halfCircleMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['dash', 0], null, null, false, Format.dashMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['cross', 0], null, null, false, Format.crossMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['circlePlus', 0], null, null, false, Format.circlePlusMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['circle', 1], null, null, false, Format.circleMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['baseDash', 0], null, null, false, Format.baseDashMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERone', 0], null, null, false, Format.EROneMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERmandOne', 0], null, null, false, Format.ERmandOneMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERmany', 0], null, null, false, Format.ERmanyMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERoneToMany', 0], null, null, false, Format.ERoneToManyMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERzeroToOne', 0], null, null, false, Format.ERzeroToOneMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['ERzeroToMany', 0], null, null, false, Format.ERzeroToManyMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['doubleBlock', 0], null, null, false, Format.doubleBlockMarkerImage.src));
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW, 'startFill'], ['doubleBlock', 1], null, null, false, Format.doubleBlockFilledMarkerImage.src));
+ }
+ else
+ {
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_STARTARROW], [mxConstants.ARROW_BLOCK], 'geIcon geSprite geSprite-startblocktrans', null, false).setAttribute('title', mxResources.get('block'));
+ }
+
+ menu.div.style.width = '40px';
+
+ window.setTimeout(mxUtils.bind(this, function()
+ {
+ if (menu.div != null)
+ {
+ mxUtils.fit(menu.div);
+ }
+ }), 0);
+ }
+ }));
+
+ var lineEnd = this.editorUi.toolbar.addMenuFunctionInContainer(stylePanel2, 'geSprite-endclassic', mxResources.get('lineend'), false, mxUtils.bind(this, function(menu)
+ {
+ if (ss.style.shape == 'connector' || ss.style.shape == 'flexArrow' || ss.style.shape == 'filledEdge' || ss.style.shape == 'wire')
+ {
+ var item = this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.NONE, 0], 'geIcon', null, false);
+ item.setAttribute('title', mxResources.get('none'));
+
+ var font = document.createElement('span');
+ font.style.fontSize = '11px';
+ mxUtils.write(font, mxResources.get('none'));
+ item.firstChild.firstChild.appendChild(font);
+
+ if (ss.style.shape == 'connector' || ss.style.shape == 'filledEdge' || ss.style.shape == 'wire')
+ {
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_CLASSIC, 1], null, null, false, Format.classicFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_CLASSIC_THIN, 1], null, null, false, Format.classicThinFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_OPEN, 0], null, null, false, Format.openFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_OPEN_THIN, 0], null, null, false, Format.openThinFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['openAsync', 0], null, null, false, Format.openAsyncFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_BLOCK, 1], null, null, false, Format.blockFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_BLOCK_THIN, 1], null, null, false, Format.blockThinFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['async', 1], null, null, false, Format.asyncFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_OVAL, 1], null, null, false, Format.ovalFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_DIAMOND, 1], null, null, false, Format.diamondFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_DIAMOND_THIN, 1], null, null, false, Format.diamondThinFilledMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_CLASSIC, 0], null, null, false, Format.classicMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_CLASSIC_THIN, 0], null, null, false, Format.classicThinMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_BLOCK, 0], null, null, false, Format.blockMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_BLOCK_THIN, 0], null, null, false, Format.blockThinMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['async', 0], null, null, false, Format.asyncMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_OVAL, 0], null, null, false, Format.ovalMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_DIAMOND, 0], null, null, false, Format.diamondMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], [mxConstants.ARROW_DIAMOND_THIN, 0], null, null, false, Format.diamondThinMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['box', 0], null, null, false, Format.boxMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['halfCircle', 0], null, null, false, Format.halfCircleMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['dash', 0], null, null, false, Format.dashMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['cross', 0], null, null, false, Format.crossMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['circlePlus', 0], null, null, false, Format.circlePlusMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['circle', 0], null, null, false, Format.circleMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['baseDash', 0], null, null, false, Format.baseDashMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERone', 0], null, null, false, Format.EROneMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERmandOne', 0], null, null, false, Format.ERmandOneMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERmany', 0], null, null, false, Format.ERmanyMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERoneToMany', 0], null, null, false, Format.ERoneToManyMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERzeroToOne', 0], null, null, false, Format.ERzeroToOneMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['ERzeroToMany', 0], null, null, false, Format.ERzeroToManyMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['doubleBlock', 0], null, null, false, Format.doubleBlockMarkerImage.src), 'scaleX(-1)');
+ Format.processMenuIcon(this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW, 'endFill'], ['doubleBlock', 1], null, null, false, Format.doubleBlockFilledMarkerImage.src), 'scaleX(-1)');
+ }
+ else
+ {
+ this.editorUi.menus.edgeStyleChange(menu, '', [mxConstants.STYLE_ENDARROW], [mxConstants.ARROW_BLOCK], 'geIcon geSprite geSprite-endblocktrans', null, false).setAttribute('title', mxResources.get('block'));
+ }
+
+ menu.div.style.width = '40px';
+
+ window.setTimeout(mxUtils.bind(this, function()
+ {
+ if (menu.div != null)
+ {
+ mxUtils.fit(menu.div);
+ }
+ }), 0);
+ }
+ }));
+
+ this.addArrow(edgeShape);
+ this.addArrow(edgeStyle).style.marginTop = '-1px';
+ this.addArrow(lineStart);
+ this.addArrow(lineEnd);
+
+ var symbol = this.addArrow(pattern);
+ symbol.className = 'geIcon';
+ pattern.style.width = '134px';
+
+ var altSymbol = this.addArrow(altPattern);
+ altSymbol.className = 'geIcon';
+ altSymbol.style.width = '22px';
+
+ var solid = document.createElement('div');
+ solid.style.width = '102px';
+ solid.style.height = '10px';
+ solid.style.borderBottom = '1px solid ' + this.defaultStrokeColor;
+ solid.style.marginLeft = '10px';
+ symbol.appendChild(solid);
+
+ var altSolid = document.createElement('div');
+ altSolid.style.width = '30px';
+ altSolid.style.height = '10px';
+ altSolid.style.borderBottom = '1px solid ' + this.defaultStrokeColor;
+ altSolid.style.marginLeft = '10px';
+ altSymbol.appendChild(altSolid);
+
+ container.appendChild(colorPanel);
+ container.appendChild(altStylePanel);
+ container.appendChild(stylePanel);
+
+ var arrowPanel = stylePanel.cloneNode(false);
+ arrowPanel.style.display = 'block';
+ arrowPanel.style.padding = '5px 4px 6px 0px';
+ arrowPanel.style.fontWeight = 'normal';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.maxWidth = '78px';
+ span.style.overflow = 'hidden';
+ span.style.textOverflow = 'ellipsis';
+ span.style.marginLeft = '0px';
+ span.style.marginBottom = '12px';
+ span.style.marginTop = '2px';
+ span.style.fontWeight = 'normal';
+
+ mxUtils.write(span, mxResources.get('lineend'));
+ arrowPanel.appendChild(span);
+
+ var endSpacingUpdate, endSizeUpdate;
+ var endSpacing = this.addUnitInput(arrowPanel, 'pt', 98, 52, function()
+ {
+ endSpacingUpdate.apply(this, arguments);
+ });
+ var endSize = this.addUnitInput(arrowPanel, 'pt', 30, 52, function()
+ {
+ endSizeUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(arrowPanel);
+
+ var spacer = document.createElement('div');
+ spacer.style.height = '8px';
+ arrowPanel.appendChild(spacer);
+
+ span = span.cloneNode(false);
+ mxUtils.write(span, mxResources.get('linestart'));
+ arrowPanel.appendChild(span);
+
+ var startSpacingUpdate, startSizeUpdate;
+ var startSpacing = this.addUnitInput(arrowPanel, 'pt', 98, 52, function()
+ {
+ startSpacingUpdate.apply(this, arguments);
+ });
+ var startSize = this.addUnitInput(arrowPanel, 'pt', 30, 52, function()
+ {
+ startSizeUpdate.apply(this, arguments);
+ });
+
+ mxUtils.br(arrowPanel);
+ this.addLabel(arrowPanel, mxResources.get('spacing'),
+ 98, 64).style.fontSize = '11px';
+ this.addLabel(arrowPanel, mxResources.get('size'),
+ 30, 64).style.fontSize = '11px';
+ mxUtils.br(arrowPanel);
+
+ var perimeterPanel = colorPanel.cloneNode(false);
+ perimeterPanel.style.fontWeight = 'normal';
+ perimeterPanel.style.position = 'relative';
+ perimeterPanel.style.paddingLeft = '16px'
+ perimeterPanel.style.marginBottom = '2px';
+ perimeterPanel.style.marginTop = '6px';
+ perimeterPanel.style.borderWidth = '0px';
+ perimeterPanel.style.paddingBottom = '18px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.marginLeft = '3px';
+ span.style.marginBottom = '12px';
+ span.style.marginTop = '1px';
+ span.style.fontWeight = 'normal';
+ span.style.width = '120px';
+ mxUtils.write(span, mxResources.get('perimeter'));
+ perimeterPanel.appendChild(span);
+
+ var perimeterUpdate;
+ var perimeterSpacing = this.addUnitInput(perimeterPanel, 'pt', 30, 52, function()
+ {
+ perimeterUpdate.apply(this, arguments);
+ });
+
+ if (ss.edges.length == ss.cells.length)
+ {
+ container.appendChild(stylePanel2);
+ container.appendChild(arrowPanel);
+ }
+ else if (ss.vertices.length == ss.cells.length)
+ {
+ container.appendChild(perimeterPanel);
+ }
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ ss = ui.getSelectionState();
+
+ if (force || document.activeElement != input)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_STROKEWIDTH, 1));
+ input.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != altInput)
+ {
+ var tmp = parseFloat(mxUtils.getValue(ss.style, mxConstants.STYLE_STROKEWIDTH, 1));
+ altInput.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ styleSelect.style.visibility = (ss.style.shape == 'connector' ||
+ ss.style.shape == 'filledEdge' || ss.style.shape == 'wire') ?
+ '' : 'hidden';
+
+ if (mxUtils.getValue(ss.style, mxConstants.STYLE_CURVED, null) == '1')
+ {
+ styleSelect.value = 'curved';
+ }
+ else if (mxUtils.getValue(ss.style, mxConstants.STYLE_ROUNDED, null) == '1')
+ {
+ styleSelect.value = 'rounded';
+ }
+
+ if (mxUtils.getValue(ss.style, mxConstants.STYLE_DASHED, null) == '1')
+ {
+ if (mxUtils.getValue(ss.style, mxConstants.STYLE_DASH_PATTERN, null) == null ||
+ String(mxUtils.getValue(ss.style, mxConstants.STYLE_DASH_PATTERN, '')).substring(0, 2) != '1 ')
+ {
+ solid.style.borderBottom = '1px dashed ' + this.defaultStrokeColor;
+ }
+ else
+ {
+ solid.style.borderBottom = '1px dotted ' + this.defaultStrokeColor;
+ }
+ }
+ else
+ {
+ solid.style.borderBottom = '1px solid ' + this.defaultStrokeColor;
+ }
+
+ altSolid.style.borderBottom = solid.style.borderBottom;
+
+ // Updates toolbar icon for edge style
+ var edgeStyleDiv = edgeStyle.getElementsByTagName('div')[0];
+
+ if (edgeStyleDiv != null)
+ {
+ var es = mxUtils.getValue(ss.style, mxConstants.STYLE_EDGE, null);
+
+ if (mxUtils.getValue(ss.style, mxConstants.STYLE_NOEDGESTYLE, null) == '1')
+ {
+ es = null;
+ }
+
+ if (es == 'orthogonalEdgeStyle' && mxUtils.getValue(ss.style, mxConstants.STYLE_CURVED, null) == '1')
+ {
+ edgeStyleDiv.className = 'geSprite geSprite-curved';
+ }
+ else if (es == 'straight' || es == 'none' || es == null)
+ {
+ edgeStyleDiv.className = 'geSprite geSprite-straight';
+ }
+ else if (es == 'entityRelationEdgeStyle')
+ {
+ edgeStyleDiv.className = 'geSprite geSprite-entity';
+ }
+ else if (es == 'elbowEdgeStyle')
+ {
+ edgeStyleDiv.className = 'geSprite ' + ((mxUtils.getValue(ss.style,
+ mxConstants.STYLE_ELBOW, null) == 'vertical') ?
+ 'geSprite-verticalelbow' : 'geSprite-horizontalelbow');
+ }
+ else if (es == 'isometricEdgeStyle')
+ {
+ edgeStyleDiv.className = 'geSprite ' + ((mxUtils.getValue(ss.style,
+ mxConstants.STYLE_ELBOW, null) == 'vertical') ?
+ 'geSprite-verticalisometric' : 'geSprite-horizontalisometric');
+ }
+ else
+ {
+ edgeStyleDiv.className = 'geSprite geSprite-orthogonal';
+ }
+ }
+
+ // Updates icon for edge shape
+ var edgeShapeDiv = edgeShape.getElementsByTagName('div')[0];
+
+ if (edgeShapeDiv != null)
+ {
+ if (ss.style.shape == 'link')
+ {
+ edgeShapeDiv.className = 'geSprite geSprite-linkedge';
+ }
+ else if (ss.style.shape == 'flexArrow')
+ {
+ edgeShapeDiv.className = 'geSprite geSprite-arrow';
+ }
+ else if (ss.style.shape == 'arrow')
+ {
+ edgeShapeDiv.className = 'geSprite geSprite-simplearrow';
+ }
+ else
+ {
+ edgeShapeDiv.className = 'geSprite geSprite-connection';
+ }
+ }
+
+ if (ss.edges.length == ss.cells.length)
+ {
+ altStylePanel.style.display = '';
+ stylePanel.style.display = 'none';
+ }
+ else
+ {
+ altStylePanel.style.display = 'none';
+ stylePanel.style.display = '';
+ }
+
+ if (Graph.lineJumpsEnabled && ss.edges.length > 0 &&
+ ss.vertices.length == 0 && ss.lineJumps)
+ {
+ container.style.borderBottomStyle = 'none';
+ }
+
+ function updateArrow(marker, fill, elt, prefix)
+ {
+ var markerDiv = elt.getElementsByTagName('div')[0];
+
+ if (markerDiv != null)
+ {
+ ui.updateCssForMarker(markerDiv, prefix, ss.style.shape, marker, fill);
+ }
+
+ return markerDiv;
+ };
+
+ var sourceDiv = updateArrow(mxUtils.getValue(ss.style, mxConstants.STYLE_STARTARROW, null),
+ mxUtils.getValue(ss.style, 'startFill', '1'), lineStart, 'start');
+ var targetDiv = updateArrow(mxUtils.getValue(ss.style, mxConstants.STYLE_ENDARROW, null),
+ mxUtils.getValue(ss.style, 'endFill', '1'), lineEnd, 'end');
+
+ // Special cases for markers
+ if (sourceDiv != null && targetDiv != null)
+ {
+ if (ss.style.shape == 'arrow')
+ {
+ sourceDiv.className = 'geSprite geSprite-noarrow';
+ targetDiv.className = 'geSprite geSprite-endblocktrans';
+ }
+ else if (ss.style.shape == 'link')
+ {
+ sourceDiv.className = 'geSprite geSprite-noarrow';
+ targetDiv.className = 'geSprite geSprite-noarrow';
+ }
+ }
+
+ mxUtils.setOpacity(edgeStyle, (ss.style.shape == 'arrow') ? 30 : 100);
+
+ if (ss.style.shape != 'connector' && ss.style.shape != 'flexArrow' &&
+ ss.style.shape != 'filledEdge' && ss.style.shape != 'wire')
+ {
+ mxUtils.setOpacity(lineStart, 30);
+ mxUtils.setOpacity(lineEnd, 30);
+ }
+ else
+ {
+ mxUtils.setOpacity(lineStart, 100);
+ mxUtils.setOpacity(lineEnd, 100);
+ }
+
+ if (force || document.activeElement != startSize)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, mxConstants.STYLE_STARTSIZE, mxConstants.DEFAULT_MARKERSIZE));
+ startSize.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != startSpacing)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, mxConstants.STYLE_SOURCE_PERIMETER_SPACING, 0));
+ startSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != endSize)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, mxConstants.STYLE_ENDSIZE, mxConstants.DEFAULT_MARKERSIZE));
+ endSize.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != startSpacing)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, mxConstants.STYLE_TARGET_PERIMETER_SPACING, 0));
+ endSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+
+ if (force || document.activeElement != perimeterSpacing)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, mxConstants.STYLE_PERIMETER_SPACING, 0));
+ perimeterSpacing.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+ });
+
+ startSizeUpdate = this.installInputHandler(startSize, mxConstants.STYLE_STARTSIZE, mxConstants.DEFAULT_MARKERSIZE, 0, 999, ' pt');
+ startSpacingUpdate = this.installInputHandler(startSpacing, mxConstants.STYLE_SOURCE_PERIMETER_SPACING, 0, -999, 999, ' pt');
+ endSizeUpdate = this.installInputHandler(endSize, mxConstants.STYLE_ENDSIZE, mxConstants.DEFAULT_MARKERSIZE, 0, 999, ' pt');
+ endSpacingUpdate = this.installInputHandler(endSpacing, mxConstants.STYLE_TARGET_PERIMETER_SPACING, 0, -999, 999, ' pt');
+ perimeterUpdate = this.installInputHandler(perimeterSpacing, mxConstants.STYLE_PERIMETER_SPACING, 0, 0, 999, ' pt');
+
+ this.addKeyHandler(input, listener);
+ this.addKeyHandler(startSize, listener);
+ this.addKeyHandler(startSpacing, listener);
+ this.addKeyHandler(endSize, listener);
+ this.addKeyHandler(endSpacing, listener);
+ this.addKeyHandler(perimeterSpacing, listener);
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+
+ return container;
+};
+
+/**
+ * Adds UI for configuring line jumps.
+ */
+StyleFormatPanel.prototype.addLineJumps = function(container)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var ss = ui.getSelectionState();
+
+ if (Graph.lineJumpsEnabled && ss.edges.length > 0 &&
+ ss.vertices.length == 0 && ss.lineJumps)
+ {
+ container.style.padding = '2px 0px 24px 14px';
+
+ var span = document.createElement('div');
+ span.style.position = 'absolute';
+ span.style.maxWidth = '78px';
+ span.style.overflow = 'hidden';
+ span.style.textOverflow = 'ellipsis';
+
+ mxUtils.write(span, mxResources.get('lineJumps'));
+ container.appendChild(span);
+
+ var styleSelect = document.createElement('select');
+ styleSelect.style.position = 'absolute';
+ styleSelect.style.height = '21px';
+ styleSelect.style.padding = '0px';
+ styleSelect.style.marginTop = '-2px';
+ styleSelect.style.boxSizing = 'border-box';
+ styleSelect.style.textAlign = 'center';
+ styleSelect.style.right = '84px';
+ styleSelect.style.width = '64px';
+ styleSelect.style.borderWidth = '1px';
+ styleSelect.style.borderStyle = 'solid';
+
+ var styles = ['none', 'arc', 'gap', 'sharp', 'line'];
+
+ for (var i = 0; i < styles.length; i++)
+ {
+ var styleOption = document.createElement('option');
+ styleOption.setAttribute('value', styles[i]);
+ mxUtils.write(styleOption, mxResources.get(styles[i]));
+ styleSelect.appendChild(styleOption);
+ }
+
+ mxEvent.addListener(styleSelect, 'change', function(evt)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ graph.setCellStyles('jumpStyle', styleSelect.value, ss.cells);
+ ui.fireEvent(new mxEventObject('styleChanged', 'keys', ['jumpStyle'],
+ 'values', [styleSelect.value], 'cells', ss.cells));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+
+ mxEvent.consume(evt);
+ });
+
+ // Stops events from bubbling to color option event handler
+ mxEvent.addListener(styleSelect, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+
+ container.appendChild(styleSelect);
+
+ var jumpSizeUpdate;
+
+ var jumpSize = this.addUnitInput(container, 'pt', 16, 52, function()
+ {
+ jumpSizeUpdate.apply(this, arguments);
+ });
+
+ jumpSizeUpdate = this.installInputHandler(jumpSize, 'jumpSize',
+ Graph.defaultJumpSize, 0, 999, ' pt');
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ ss = ui.getSelectionState();
+ styleSelect.value = mxUtils.getValue(ss.style, 'jumpStyle', 'none');
+
+ if (force || document.activeElement != jumpSize)
+ {
+ var tmp = parseInt(mxUtils.getValue(ss.style, 'jumpSize', Graph.defaultJumpSize));
+ jumpSize.value = (isNaN(tmp)) ? '' : tmp + ' pt';
+ }
+ });
+
+ this.addKeyHandler(jumpSize, listener);
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+ }
+ else
+ {
+ container.style.display = 'none';
+ }
+
+ return container;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addEffects = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var ss = ui.getSelectionState();
+
+ div.style.paddingTop = '4px';
+ div.style.paddingBottom = '4px';
+
+ var table = document.createElement('table');
+
+ table.style.width = '210px';
+ table.style.fontWeight = 'bold';
+ table.style.tableLayout = 'fixed';
+ var tbody = document.createElement('tbody');
+ var row = document.createElement('tr');
+ row.style.padding = '0px';
+ var left = document.createElement('td');
+ left.style.padding = '0px';
+ left.style.width = '50%';
+ left.setAttribute('valign', 'top');
+
+ var right = left.cloneNode(true);
+ right.style.paddingLeft = '8px';
+ row.appendChild(left);
+ row.appendChild(right);
+ tbody.appendChild(row);
+ table.appendChild(tbody);
+ div.appendChild(table);
+
+ var current = left;
+
+ var addOption = mxUtils.bind(this, function(label, key, defaultValue, fn)
+ {
+ var opt = this.createCellOption(label, key, defaultValue, null, null, fn);
+ opt.style.width = '100%';
+ current.appendChild(opt);
+ current = (current == left) ? right : left;
+ });
+
+ var listener = mxUtils.bind(this, function(sender, evt, force)
+ {
+ ss = ui.getSelectionState();
+
+ left.innerText = '';
+ right.innerText = '';
+ current = left;
+
+ if (ss.rounded)
+ {
+ addOption(mxResources.get('rounded'), mxConstants.STYLE_ROUNDED, 0);
+ }
+
+ if (ss.swimlane)
+ {
+ addOption(mxResources.get('divider'), 'swimlaneLine', 1);
+ }
+
+ addOption(mxResources.get('sketch'), 'sketch', 0, function(cells, enabled)
+ {
+ graph.updateCellStyles({'sketch': (enabled) ? '1' : null,
+ 'curveFitting': (enabled) ? Editor.sketchDefaultCurveFitting : null,
+ 'jiggle': (enabled) ? Editor.sketchDefaultJiggle : null}, cells);
+ });
+
+ if (ss.glass)
+ {
+ addOption(mxResources.get('glass'), mxConstants.STYLE_GLASS, 0);
+ }
+
+ if (!ss.containsImage)
+ {
+ addOption(mxResources.get('shadow'), mxConstants.STYLE_SHADOW, 0);
+ }
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+ listener();
+
+ return div;
+}
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+StyleFormatPanel.prototype.addStyleOps = function(div)
+{
+ var ss = this.editorUi.getSelectionState();
+
+ if (ss.cells.length == 1)
+ {
+ this.addActions(div, ['setAsDefaultStyle']);
+ }
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramStylePanel = function(format, editorUi, container)
+{
+ BaseFormatPanel.call(this, format, editorUi, container);
+ this.init();
+};
+
+mxUtils.extend(DiagramStylePanel, BaseFormatPanel);
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramStylePanel.prototype.init = function()
+{
+ var ui = this.editorUi;
+
+ this.darkModeChangedListener = mxUtils.bind(this, function()
+ {
+ this.format.cachedStyleEntries = [];
+ });
+
+ ui.addListener('darkModeChanged', this.darkModeChangedListener);
+ this.container.appendChild(this.addView(this.createPanel()));
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramStylePanel.prototype.getGlobalStyleButtons = function()
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ var buttons = [mxUtils.button(mxResources.get('sketch'), mxUtils.bind(this, function(evt)
+ {
+ var value = !Editor.sketchMode;
+ graph.updateCellStyles({'sketch': (value) ? '1' : null,
+ 'curveFitting': (value) ? Editor.sketchDefaultCurveFitting : null,
+ 'jiggle': (value) ? Editor.sketchDefaultJiggle : null},
+ graph.getVerticesAndEdges());
+ ui.setSketchMode(value);
+ mxEvent.consume(evt);
+ })), mxUtils.button(mxResources.get('rounded'), mxUtils.bind(this, function(evt)
+ {
+ // Checks if all cells are rounded
+ var cells = graph.getVerticesAndEdges();
+ var rounded = true;
+
+ if (cells.length > 0)
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var style = graph.getCellStyle(cells[i]);
+
+ if (mxUtils.getValue(style, mxConstants.STYLE_ROUNDED, 0) == 0)
+ {
+ rounded = false;
+ break;
+ }
+ }
+ }
+
+ rounded = !rounded;
+ graph.updateCellStyles({'rounded': (rounded) ? '1' : '0'}, cells);
+
+ if (rounded)
+ {
+ graph.currentEdgeStyle['rounded'] = '1';
+ graph.currentVertexStyle['rounded'] = '1';
+ }
+ else
+ {
+ delete graph.currentEdgeStyle['rounded'];
+ delete graph.currentVertexStyle['rounded'];
+ }
+
+ mxEvent.consume(evt);
+ }))];
+
+ return buttons;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramStylePanel.prototype.addView = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+ var model = graph.getModel();
+ var gridColor = graph.view.gridColor;
+
+ div.style.paddingTop = '2px';
+ div.style.whiteSpace = 'normal';
+
+ var opts = document.createElement('div');
+ opts.style.marginRight = '16px';
+ opts.style.paddingBottom = '2px';
+
+ var table = document.createElement('table');
+ table.style.width = '204px';
+
+ var tbody = document.createElement('tbody');
+ var row = document.createElement('tr');
+ row.style.padding = '0px';
+
+ var left = document.createElement('td');
+ left.style.textAlign = 'center';
+ left.style.padding = '2px';
+ left.style.width = '50%';
+
+ var right = left.cloneNode(true);
+ var buttons = this.getGlobalStyleButtons();
+
+ for (var i = 0; i < buttons.length; i += 2)
+ {
+ var btn = buttons[i];
+ btn.style.height = '22px';
+ btn.style.width = '92px';
+
+ left.appendChild(btn);
+ row.appendChild(left);
+
+ btn = buttons[i + 1];
+
+ if (btn != null)
+ {
+ btn.style.height = '22px';
+ btn.style.width = '92px';
+ right.appendChild(btn);
+ }
+
+ row.appendChild(right);
+ tbody.appendChild(row);
+
+ left = left.cloneNode(false);
+ right = right.cloneNode(false);
+ row = row.cloneNode(false);
+ }
+
+ table.appendChild(tbody);
+ opts.appendChild(table);
+ div.appendChild(opts);
+
+ var defaultStyles = ['fillColor', 'strokeColor', 'fontColor', 'gradientColor'];
+
+ div.style.whiteSpace = 'normal';
+ div.style.paddingLeft = '18px';
+ div.style.paddingTop = '6px';
+
+ var updateCells = mxUtils.bind(this, function(styles, graphStyle)
+ {
+ var cells = graph.getVerticesAndEdges();
+
+ model.beginUpdate();
+ try
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var style = graph.getCellStyle(cells[i]);
+
+ // Handles special label background color
+ if (!ignoreGraphStyle && style['labelBackgroundColor'] != null)
+ {
+ graph.updateCellStyles({'labelBackgroundColor': (graphStyle != null) ?
+ graphStyle.background : null}, [cells[i]]);
+ }
+ else if (ignoreGraphStyle)
+ {
+ graph.updateCellStyles({'labelBackgroundColor': mxConstants.NONE}, [cells[i]]);
+ }
+
+ var edge = model.isEdge(cells[i]);
+ var newStyle = model.getStyle(cells[i]);
+ var current = (edge) ? graph.currentEdgeStyle : graph.currentVertexStyle;
+
+ for (var j = 0; j < styles.length; j++)
+ {
+ if ((style[styles[j]] != null && style[styles[j]] != mxConstants.NONE) ||
+ (styles[j] != mxConstants.STYLE_FILLCOLOR &&
+ styles[j] != mxConstants.STYLE_STROKECOLOR))
+ {
+ if (ignoreGraphStyle && edge && styles[j] == mxConstants.STYLE_FONTCOLOR)
+ {
+ newStyle = mxUtils.setStyle(newStyle, styles[j], 'default');
+ }
+ else
+ {
+ newStyle = mxUtils.setStyle(newStyle, styles[j], current[styles[j]]);
+ }
+ }
+ }
+
+ model.setStyle(cells[i], newStyle);
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ });
+
+ var removeStyles = mxUtils.bind(this, function(style, styles, defaultStyle)
+ {
+ if (style != null)
+ {
+ for (var j = 0; j < styles.length; j++)
+ {
+ if (((style[styles[j]] != null &&
+ style[styles[j]] != mxConstants.NONE) ||
+ (styles[j] != mxConstants.STYLE_FILLCOLOR &&
+ styles[j] != mxConstants.STYLE_STROKECOLOR)))
+ {
+ style[styles[j]] = defaultStyle[styles[j]];
+ }
+ }
+ }
+ });
+
+ var ignoreGraphStyle = true;
+
+ var applyStyle = mxUtils.bind(this, function(style, result, cell, graphStyle, theGraph)
+ {
+ if (style != null)
+ {
+ if (cell != null)
+ {
+ // Handles special label background color
+ if (!ignoreGraphStyle && result['labelBackgroundColor'] != null)
+ {
+ var bg = (graphStyle != null) ? graphStyle.background : null;
+ theGraph = (theGraph != null) ? theGraph : graph;
+
+ if (bg == null)
+ {
+ bg = theGraph.background;
+ }
+
+ if (bg == null)
+ {
+ bg = theGraph.defaultPageBackgroundColor;
+ }
+
+ result['labelBackgroundColor'] = bg;
+ }
+ else if (ignoreGraphStyle)
+ {
+ result['labelBackgroundColor'] = mxConstants.NONE;
+ }
+ }
+
+ for (var key in style)
+ {
+ if (cell == null || ((result[key] != null &&
+ result[key] != mxConstants.NONE) ||
+ (key != mxConstants.STYLE_FILLCOLOR &&
+ key != mxConstants.STYLE_STROKECOLOR)))
+ {
+ if (ignoreGraphStyle && model.isEdge(cell) &&
+ key == mxConstants.STYLE_FONTCOLOR)
+ {
+ result[key] = 'default';
+ }
+ else
+ {
+ result[key] = style[key];
+ }
+ }
+ }
+ }
+ });
+
+ var createPreview = mxUtils.bind(this, function(commonStyle, vertexStyle, edgeStyle, graphStyle, container)
+ {
+ // Wrapper needed to catch events
+ var div = document.createElement('div');
+ div.style.background = (Editor.isDarkMode() ? '#2a252f' : '#f1f3f4');
+ div.style.position = 'absolute';
+ div.style.display = 'inline-block';
+ div.style.overflow = 'hidden';
+ div.style.pointerEvents = 'none';
+ div.style.width = '100%';
+ div.style.height = '100%';
+ container.appendChild(div);
+
+ var graph2 = new Graph(div, null, null, graph.getStylesheet());
+ graph2.shapeBackgroundColor = div.style.background;
+ graph2.resetViewOnRootChange = false;
+ graph2.foldingEnabled = false;
+ graph2.gridEnabled = false;
+ graph2.autoScroll = false;
+ graph2.setTooltips(false);
+ graph2.setConnectable(false);
+ graph2.setPanning(false);
+ graph2.setEnabled(false);
+
+ graph2.getCellStyle = function(cell, resolve)
+ {
+ resolve = (resolve != null) ? resolve : true;
+ var result = mxUtils.clone(graph.getCellStyle.apply(this, arguments));
+ var defaultStyle = graph.stylesheet.getDefaultVertexStyle();
+ var appliedStyle = vertexStyle;
+
+ if (model.isEdge(cell))
+ {
+ defaultStyle = graph.stylesheet.getDefaultEdgeStyle();
+ appliedStyle = edgeStyle;
+ }
+
+ removeStyles(result, defaultStyles, defaultStyle);
+ applyStyle(commonStyle, result, cell, graphStyle, graph2);
+ applyStyle(appliedStyle, result, cell, graphStyle, graph2);
+
+ if (resolve)
+ {
+ result = graph.postProcessCellStyle(cell, result);
+ }
+
+ return result;
+ };
+
+ // Avoid HTML labels to capture events in bubble phase
+ graph2.model.beginUpdate();
+ try
+ {
+ var v1 = graph2.insertVertex(graph2.getDefaultParent(), null, 'Shape', 14, 8, 70, 36, 'strokeWidth=2;');
+ var e1 = graph2.insertEdge(graph2.getDefaultParent(), null, 'Connector', v1, v1,
+ 'edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;endSize=5;strokeWidth=2;')
+ e1.geometry.points = [new mxPoint(32, 66)];
+ e1.geometry.offset = new mxPoint(0, 8);
+ }
+ finally
+ {
+ graph2.model.endUpdate();
+ }
+ });
+
+ // Entries
+ var entries = document.createElement('div');
+ entries.style.position = 'relative';
+ entries.style.width = '210px';
+ div.appendChild(entries);
+
+ // Cached entries
+ if (this.format.cachedStyleEntries == null)
+ {
+ this.format.cachedStyleEntries = [];
+ }
+
+ function addKeys(style, result)
+ {
+ for (var key in style)
+ {
+ result.push(key);
+ }
+
+ return result;
+ };
+
+ var addEntry = mxUtils.bind(this, function(commonStyle, vertexStyle, edgeStyle, graphStyle, index)
+ {
+ var panel = this.format.cachedStyleEntries[index];
+
+ if (panel == null)
+ {
+ panel = document.createElement('div');
+ panel.style.display = 'inline-block';
+ panel.style.position = 'relative';
+ panel.style.width = '96px';
+ panel.style.height = '86px';
+ panel.style.cursor = 'pointer';
+ panel.style.border = '1px solid gray';
+ panel.style.borderRadius = '8px';
+ panel.style.margin = '1px 2px';
+ panel.style.overflow = 'hidden';
+
+ if (!ignoreGraphStyle && graphStyle != null && graphStyle.background != null)
+ {
+ panel.style.backgroundColor = graphStyle.background;
+ }
+
+ createPreview(commonStyle, vertexStyle, edgeStyle, graphStyle, panel);
+
+ mxEvent.addGestureListeners(panel, mxUtils.bind(this, function(evt)
+ {
+ panel.style.opacity = 0.5;
+ }), null, mxUtils.bind(this, function(evt)
+ {
+ panel.style.opacity = 1;
+ graph.currentVertexStyle = mxUtils.clone(graph.defaultVertexStyle);
+ graph.currentEdgeStyle = mxUtils.clone(graph.defaultEdgeStyle);
+
+ applyStyle(commonStyle, graph.currentVertexStyle);
+ applyStyle(commonStyle, graph.currentEdgeStyle);
+ applyStyle(vertexStyle, graph.currentVertexStyle);
+ applyStyle(edgeStyle, graph.currentEdgeStyle);
+
+ model.beginUpdate();
+ try
+ {
+ updateCells(addKeys(commonStyle, defaultStyles.slice()), graphStyle);
+
+ if (!ignoreGraphStyle)
+ {
+ var change = new ChangePageSetup(ui, (graphStyle != null) ? graphStyle.background : null);
+ change.ignoreImage = true;
+ model.execute(change);
+
+ model.execute(new ChangeGridColor(ui,
+ (graphStyle != null && graphStyle.gridColor != null) ?
+ graphStyle.gridColor : gridColor));
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ }));
+
+ mxEvent.addListener(panel, 'mouseenter', mxUtils.bind(this, function(evt)
+ {
+ var prev = graph.getCellStyle;
+ var prevBg = graph.background;
+ var prevGrid = graph.view.gridColor;
+
+ if (!ignoreGraphStyle)
+ {
+ graph.background = (graphStyle != null) ? graphStyle.background : null;
+ graph.view.gridColor = (graphStyle != null && graphStyle.gridColor != null) ?
+ graphStyle.gridColor : gridColor;
+ }
+
+ graph.getCellStyle = function(cell, resolve)
+ {
+ resolve = (resolve != null) ? resolve : true;
+ var result = mxUtils.clone(prev.apply(this, arguments));
+
+ var defaultStyle = graph.stylesheet.getDefaultVertexStyle();
+ var appliedStyle = vertexStyle;
+
+ if (model.isEdge(cell))
+ {
+ defaultStyle = graph.stylesheet.getDefaultEdgeStyle();
+ appliedStyle = edgeStyle;
+ }
+
+ removeStyles(result, defaultStyles, defaultStyle);
+ applyStyle(commonStyle, result, cell, graphStyle);
+ applyStyle(appliedStyle, result, cell, graphStyle);
+
+ if (resolve)
+ {
+ result = this.postProcessCellStyle(cell, result);
+ }
+
+ return result;
+ };
+
+ graph.refresh();
+ graph.getCellStyle = prev;
+ graph.background = prevBg;
+ graph.view.gridColor = prevGrid;
+ }));
+
+ mxEvent.addListener(panel, 'mouseleave', mxUtils.bind(this, function(evt)
+ {
+ graph.refresh();
+ }));
+
+ // Workaround for broken cache in IE11
+ if (!mxClient.IS_IE && !mxClient.IS_IE11)
+ {
+ this.format.cachedStyleEntries[index] = panel;
+ }
+ }
+
+ entries.appendChild(panel);
+ });
+
+ // Maximum palettes to switch the switcher
+ var maxEntries = 10;
+ var pageCount = Math.ceil(Editor.styles.length / maxEntries);
+ this.format.currentStylePage = (this.format.currentStylePage != null) ? this.format.currentStylePage : 0;
+ var dots = [];
+
+ var addEntries = mxUtils.bind(this, function()
+ {
+ if (dots.length > 0)
+ {
+ dots[this.format.currentStylePage].style.background = '#84d7ff';
+ }
+
+ for (var i = this.format.currentStylePage * maxEntries;
+ i < Math.min((this.format.currentStylePage + 1) * maxEntries,
+ Editor.styles.length); i++)
+ {
+ var s = Editor.styles[i];
+ addEntry(s.commonStyle, s.vertexStyle, s.edgeStyle, s.graph, i);
+ }
+ });
+
+ var selectPage = mxUtils.bind(this, function(index)
+ {
+ if (index >= 0 && index < pageCount)
+ {
+ dots[this.format.currentStylePage].style.background = 'transparent';
+ entries.innerText = '';
+ this.format.currentStylePage = index;
+ addEntries();
+ }
+ });
+
+ if (pageCount > 1)
+ {
+ // Selector
+ var switcher = document.createElement('div');
+ switcher.style.whiteSpace = 'nowrap';
+ switcher.style.position = 'relative';
+ switcher.style.textAlign = 'center';
+ switcher.style.paddingTop = '4px';
+ switcher.style.width = '210px';
+
+ for (var i = 0; i < pageCount; i++)
+ {
+ var dot = document.createElement('div');
+ dot.style.display = 'inline-block';
+ dot.style.width = '6px';
+ dot.style.height = '6px';
+ dot.style.marginLeft = '4px';
+ dot.style.marginRight = '3px';
+ dot.style.borderRadius = '3px';
+ dot.style.cursor = 'pointer';
+ dot.style.background = 'transparent';
+ dot.style.border = '1px solid #b5b6b7';
+
+ (mxUtils.bind(this, function(index, elt)
+ {
+ mxEvent.addListener(dot, 'click', mxUtils.bind(this, function()
+ {
+ selectPage(index);
+ }));
+ }))(i, dot);
+
+ switcher.appendChild(dot);
+ dots.push(dot);
+ }
+
+ div.appendChild(switcher);
+ addEntries();
+
+ if (pageCount < 15)
+ {
+ var left = document.createElement('div');
+ left.className = 'geAdaptiveAsset';
+ left.style.position = 'absolute';
+ left.style.left = '0px';
+ left.style.top = '0px';
+ left.style.bottom = '0px';
+ left.style.width = '24px';
+ left.style.height = '24px';
+ left.style.margin = '0px';
+ left.style.cursor = 'pointer';
+ left.style.opacity = '0.5';
+ left.style.backgroundRepeat = 'no-repeat';
+ left.style.backgroundPosition = 'center center';
+ left.style.backgroundSize = '24px 24px';
+ left.style.backgroundImage = 'url(' + Editor.previousImage + ')';
+
+ var right = left.cloneNode(false);
+ right.style.backgroundImage = 'url(' + Editor.nextImage + ')';
+ right.style.left = '';
+ right.style.right = '2px';
+
+ switcher.appendChild(left);
+ switcher.appendChild(right);
+
+ mxEvent.addListener(left, 'click', mxUtils.bind(this, function()
+ {
+ selectPage(mxUtils.mod(this.format.currentStylePage - 1, pageCount));
+ }));
+
+ mxEvent.addListener(right, 'click', mxUtils.bind(this, function()
+ {
+ selectPage(mxUtils.mod(this.format.currentStylePage + 1, pageCount));
+ }));
+
+ // Hover state
+ function addHoverState(elt)
+ {
+ mxEvent.addListener(elt, 'mouseenter', function()
+ {
+ elt.style.opacity = '1';
+ });
+ mxEvent.addListener(elt, 'mouseleave', function()
+ {
+ elt.style.opacity = '0.5';
+ });
+ };
+
+ addHoverState(left);
+ addHoverState(right);
+ }
+ }
+ else
+ {
+ addEntries();
+ }
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramStylePanel.prototype.destroy = function()
+{
+ BaseFormatPanel.prototype.destroy.apply(this, arguments);
+
+ if (this.darkModeChangedListener)
+ {
+ this.editorUi.removeListener(this.darkModeChangedListener);
+ this.darkModeChangedListener = null;
+ }
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel = function(format, editorUi, container)
+{
+ BaseFormatPanel.call(this, format, editorUi, container);
+ this.init();
+};
+
+mxUtils.extend(DiagramFormatPanel, BaseFormatPanel);
+
+/**
+ * Switch to disable page view.
+ */
+DiagramFormatPanel.showPageView = true;
+
+/**
+ * Specifies if the background image option should be shown. Default is true.
+ */
+DiagramFormatPanel.prototype.showBackgroundImageOption = true;
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.init = function()
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ this.container.appendChild(this.addView(this.createPanel()));
+
+ if (graph.isEnabled())
+ {
+ this.container.appendChild(this.addOptions(this.createPanel()));
+ this.container.appendChild(this.addPaperSize(this.createPanel()));
+ this.container.appendChild(this.addStyleOps(this.createPanel()));
+ }
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.addView = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ div.appendChild(this.createTitle(mxResources.get('view')));
+
+ // Grid
+ this.addGridOption(div);
+
+ // Page View
+ if (DiagramFormatPanel.showPageView)
+ {
+ div.appendChild(this.createOption(mxResources.get('pageView'), function()
+ {
+ return graph.pageVisible;
+ }, function(checked)
+ {
+ ui.actions.get('pageView').funct();
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.pageVisible);
+ };
+
+ ui.addListener('pageViewChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ }));
+ }
+
+ if (graph.isEnabled())
+ {
+ if (this.showBackgroundImageOption)
+ {
+ var bg = this.createOption(mxResources.get('background'), function()
+ {
+ return graph.backgroundImage != null;
+ }, function(checked)
+ {
+ if (!checked)
+ {
+ var change = new ChangePageSetup(ui, null, null);
+ change.ignoreColor = true;
+
+ graph.model.execute(change);
+ }
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.backgroundImage != null);
+ };
+
+ ui.addListener('backgroundImageChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ });
+
+ var input = bg.getElementsByTagName('input')[0];
+
+ if (input != null)
+ {
+ input.style.visibility = graph.backgroundImage != null ? 'visible' : 'hidden';
+ }
+
+ var label = bg.getElementsByTagName('div')[0];
+
+ if (label != null)
+ {
+ label.style.display = 'inline-block';
+ label.style.textOverflow = 'ellipsis';
+ label.style.overflow = 'hidden';
+ label.style.maxWidth = '80px';
+ }
+
+ if (mxClient.IS_FF)
+ {
+ label.style.marginTop = '1px';
+ }
+
+ var btn = mxUtils.button(mxResources.get('change') + '...', function(evt)
+ {
+ ui.showBackgroundImageDialog(null,
+ ui.editor.graph.backgroundImage,
+ ui.editor.graph.background);
+ mxEvent.consume(evt);
+ })
+
+ btn.style.position = 'absolute';
+ btn.style.height = '22px';
+ btn.style.left = '47%';
+ btn.style.marginLeft = '1px';
+ btn.style.width = '110px';
+ btn.style.maxWidth = '110px';
+
+ bg.appendChild(btn);
+ div.appendChild(bg);
+ }
+
+ var bgColor = this.createColorOption(mxResources.get('backgroundColor'), function()
+ {
+ return graph.background;
+ }, function(color)
+ {
+ var change = new ChangePageSetup(ui, color);
+ change.ignoreImage = true;
+
+ graph.model.execute(change);
+ }, '#ffffff');
+
+ bgColor.style.padding = '5px 0 1px 0';
+ div.appendChild(bgColor);
+
+ var option = this.createOption(mxResources.get('shadow'), function()
+ {
+ return graph.shadowVisible;
+ }, function(checked)
+ {
+ var change = new ChangePageSetup(ui);
+ change.ignoreColor = true;
+ change.ignoreImage = true;
+ change.shadowVisible = checked;
+
+ graph.model.execute(change);
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.shadowVisible);
+ };
+
+ ui.addListener('shadowVisibleChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ });
+
+ if (!Editor.enableShadowOption)
+ {
+ option.getElementsByTagName('input')[0].setAttribute('disabled', 'disabled');
+ mxUtils.setOpacity(option, 60);
+ }
+
+ option.style.display = 'inline-flex';
+ option.style.width = '100px';
+ option.style.maxWidth = '100px';
+ option.style.marginRight = '4px';
+ div.appendChild(option);
+
+ var sketchOption = this.createOption(mxResources.get('sketch'), function()
+ {
+ return Editor.sketchMode;
+ }, function(checked)
+ {
+ ui.setSketchMode(checked);
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(Editor.sketchMode);
+ };
+
+ ui.addListener('sketchModeChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ });
+
+ sketchOption.style.display = 'inline-flex';
+ sketchOption.style.width = '104px';
+ sketchOption.style.maxWidth = '104px';
+ div.appendChild(sketchOption);
+ }
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.addOptions = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ div.appendChild(this.createTitle(mxResources.get('options')));
+
+ if (graph.isEnabled())
+ {
+ // Connection arrows
+ div.appendChild(this.createOption(mxResources.get('connectionArrows'), function()
+ {
+ return graph.connectionArrowsEnabled;
+ }, function(checked)
+ {
+ ui.actions.get('connectionArrows').funct();
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.connectionArrowsEnabled);
+ };
+
+ ui.addListener('connectionArrowsChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ }));
+
+ // Connection points
+ div.appendChild(this.createOption(mxResources.get('connectionPoints'), function()
+ {
+ return graph.connectionHandler.isEnabled();
+ }, function(checked)
+ {
+ ui.actions.get('connectionPoints').funct();
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.connectionHandler.isEnabled());
+ };
+
+ ui.addListener('connectionPointsChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ }));
+
+ // Guides
+ div.appendChild(this.createOption(mxResources.get('guides'), function()
+ {
+ return graph.graphHandler.guidesEnabled;
+ }, function(checked)
+ {
+ ui.actions.get('guides').funct();
+ },
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply(graph.graphHandler.guidesEnabled);
+ };
+
+ ui.addListener('guidesEnabledChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ }));
+ }
+
+ return div;
+};
+
+/**
+ *
+ */
+DiagramFormatPanel.prototype.addGridOption = function(container)
+{
+ var fPanel = this;
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+
+ var input = document.createElement('input');
+ input.style.position = 'absolute';
+ input.style.textAlign = 'right';
+ input.style.width = '48px';
+ input.style.marginTop = '-2px';
+ input.style.height = '21px';
+ input.style.borderWidth = '1px';
+ input.style.borderStyle = 'solid';
+ input.style.boxSizing = 'border-box';
+ input.value = this.inUnit(graph.getGridSize()) + ' ' + this.getUnit();
+
+ var stepper = this.createStepper(input, update, this.getUnitStep(), null, null, null, this.isFloatUnit());
+ input.style.display = (graph.isGridEnabled()) ? '' : 'none';
+ stepper.style.display = input.style.display;
+
+ mxEvent.addListener(input, 'keydown', function(e)
+ {
+ if (e.keyCode == 13)
+ {
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ else if (e.keyCode == 27)
+ {
+ input.value = graph.getGridSize();
+ graph.container.focus();
+ mxEvent.consume(e);
+ }
+ });
+
+ function update(evt)
+ {
+ var value = fPanel.isFloatUnit()? parseFloat(input.value) : parseInt(input.value);
+ value = fPanel.fromUnit(Math.max(fPanel.inUnit(1), (isNaN(value)) ? fPanel.inUnit(10) : value));
+
+ if (value != graph.getGridSize())
+ {
+ mxGraph.prototype.gridSize = value;
+ graph.setGridSize(value)
+ }
+
+ input.value = fPanel.inUnit(value) + ' ' + fPanel.getUnit();
+ mxEvent.consume(evt);
+ };
+
+ mxEvent.addListener(input, 'blur', update);
+ mxEvent.addListener(input, 'change', update);
+
+ input.style.right = '78px';
+ stepper.style.marginTop = (mxClient.IS_MAC && mxClient.IS_GC) ?
+ '-16px' : ((mxClient.IS_WIN) ? '-18px' : '-17px');
+ stepper.style.right = '66px';
+
+ var panel = this.createColorOption(mxResources.get('grid'), function()
+ {
+ var color = graph.view.gridColor;
+
+ return (graph.isGridEnabled()) ? color : null;
+ }, function(color)
+ {
+ var enabled = graph.isGridEnabled();
+
+ if (color == mxConstants.NONE)
+ {
+ graph.setGridEnabled(false);
+ }
+ else
+ {
+ graph.setGridEnabled(true);
+ ui.setGridColor(color);
+ }
+
+ input.style.display = (graph.isGridEnabled()) ? '' : 'none';
+ stepper.style.display = input.style.display;
+
+ if (enabled != graph.isGridEnabled())
+ {
+ graph.defaultGridEnabled = graph.isGridEnabled();
+ ui.fireEvent(new mxEventObject('gridEnabledChanged'));
+ }
+ }, Editor.isDarkMode() ? graph.view.defaultDarkGridColor : graph.view.defaultGridColor,
+ {
+ install: function(apply)
+ {
+ this.listener = function()
+ {
+ apply((graph.isGridEnabled()) ? graph.view.gridColor : null);
+ };
+
+ ui.addListener('gridColorChanged', this.listener);
+ ui.addListener('gridEnabledChanged', this.listener);
+ },
+ destroy: function()
+ {
+ ui.removeListener(this.listener);
+ }
+ });
+
+ panel.style.padding = '6px 0 0 0';
+ panel.appendChild(input);
+ panel.appendChild(stepper);
+ container.appendChild(panel);
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.addDocumentProperties = function(div)
+{
+ // Hook for subclassers
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ div.appendChild(this.createTitle(mxResources.get('options')));
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.addPaperSize = function(div)
+{
+ var ui = this.editorUi;
+ var editor = ui.editor;
+ var graph = editor.graph;
+
+ div.appendChild(this.createTitle(mxResources.get('paperSize')));
+
+ var accessor = PageSetupDialog.addPageFormatPanel(div, 'formatpanel', graph.pageFormat, function(pageFormat)
+ {
+ if (graph.pageFormat == null || graph.pageFormat.width != pageFormat.width ||
+ graph.pageFormat.height != pageFormat.height)
+ {
+ var change = new ChangePageSetup(ui, null, null, pageFormat);
+ change.ignoreColor = true;
+ change.ignoreImage = true;
+
+ graph.model.execute(change);
+ }
+ });
+
+ this.addKeyHandler(accessor.widthInput, function()
+ {
+ accessor.set(graph.pageFormat);
+ });
+
+ this.addKeyHandler(accessor.heightInput, function()
+ {
+ accessor.set(graph.pageFormat);
+ });
+
+ var listener = function()
+ {
+ accessor.set(graph.pageFormat);
+ };
+
+ ui.addListener('pageFormatChanged', listener);
+ this.listeners.push({destroy: function() { ui.removeListener(listener); }});
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+ this.listeners.push({destroy: function() { graph.getModel().removeListener(listener); }});
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.addStyleOps = function(div)
+{
+ this.addActions(div, ['editData']);
+ this.addActions(div, ['clearDefaultStyle']);
+
+ return div;
+};
+
+/**
+ * Adds the label menu items to the given menu and parent.
+ */
+DiagramFormatPanel.prototype.destroy = function()
+{
+ BaseFormatPanel.prototype.destroy.apply(this, arguments);
+
+ if (this.gridEnabledListener)
+ {
+ this.editorUi.removeListener(this.gridEnabledListener);
+ this.gridEnabledListener = null;
+ }
+};
+
+
+/**
+ * Configures global color schemes.
+ */
+StyleFormatPanel.prototype.defaultColorSchemes = [[{fill: '', stroke: ''}, {fill: '#f5f5f5', stroke: '#666666', font: '#333333'},
+{fill: '#dae8fc', stroke: '#6c8ebf'}, {fill: '#d5e8d4', stroke: '#82b366'},
+{fill: '#ffe6cc', stroke: '#d79b00'}, {fill: '#fff2cc', stroke: '#d6b656'},
+{fill: '#f8cecc', stroke: '#b85450'}, {fill: '#e1d5e7', stroke: '#9673a6'}],
+[{fill: '', stroke: ''}, {fill: '#60a917', stroke: '#2D7600', font: '#ffffff'},
+{fill: '#008a00', stroke: '#005700', font: '#ffffff'}, {fill: '#1ba1e2', stroke: '#006EAF', font: '#ffffff'},
+{fill: '#0050ef', stroke: '#001DBC', font: '#ffffff'}, {fill: '#6a00ff', stroke: '#3700CC', font: '#ffffff'},
+//{fill: '#aa00ff', stroke: '#7700CC', font: '#ffffff'},
+{fill: '#d80073', stroke: '#A50040', font: '#ffffff'}, {fill: '#a20025', stroke: '#6F0000', font: '#ffffff'}],
+[{fill: '#e51400', stroke: '#B20000', font: '#ffffff'}, {fill: '#fa6800', stroke: '#C73500', font: '#000000'},
+{fill: '#f0a30a', stroke: '#BD7000', font: '#000000'}, {fill: '#e3c800', stroke: '#B09500', font: '#000000'},
+{fill: '#6d8764', stroke: '#3A5431', font: '#ffffff'}, {fill: '#647687', stroke: '#314354', font: '#ffffff'},
+{fill: '#76608a', stroke: '#432D57', font: '#ffffff'}, {fill: '#a0522d', stroke: '#6D1F00', font: '#ffffff'}],
+[{fill: '', stroke: ''}, {fill: mxConstants.NONE, stroke: ''},
+{fill: '#fad7ac', stroke: '#b46504'}, {fill: '#fad9d5', stroke: '#ae4132'},
+{fill: '#b0e3e6', stroke: '#0e8088'}, {fill: '#b1ddf0', stroke: '#10739e'},
+{fill: '#d0cee2', stroke: '#56517e'}, {fill: '#bac8d3', stroke: '#23445d'}],
+[{fill: '', stroke: ''},
+{fill: '#f5f5f5', stroke: '#666666', gradient: '#b3b3b3'},
+{fill: '#dae8fc', stroke: '#6c8ebf', gradient: '#7ea6e0'},
+{fill: '#d5e8d4', stroke: '#82b366', gradient: '#97d077'},
+{fill: '#ffcd28', stroke: '#d79b00', gradient: '#ffa500'},
+{fill: '#fff2cc', stroke: '#d6b656', gradient: '#ffd966'},
+{fill: '#f8cecc', stroke: '#b85450', gradient: '#ea6b66'},
+{fill: '#e6d0de', stroke: '#996185', gradient: '#d5739d'}],
+[{fill: '', stroke: ''}, {fill: '#eeeeee', stroke: '#36393d'},
+{fill: '#f9f7ed', stroke: '#36393d'}, {fill: '#ffcc99', stroke: '#36393d'},
+{fill: '#cce5ff', stroke: '#36393d'}, {fill: '#ffff88', stroke: '#36393d'},
+{fill: '#cdeb8b', stroke: '#36393d'}, {fill: '#ffcccc', stroke: '#36393d'}]];
+
+/**
+* Configures custom color schemes.
+*/
+StyleFormatPanel.prototype.customColorSchemes = null;
+
+StyleFormatPanel.prototype.findCommonProperties = function(cell, properties, addAll)
+{
+if (properties == null) return;
+
+var handleCustomProp = function(custProperties)
+{
+ if (custProperties != null)
+ {
+ if (addAll)
+ {
+ for (var i = 0; i < custProperties.length; i++)
+ {
+ properties[custProperties[i].name] = custProperties[i];
+ }
+ }
+ else
+ {
+ for (var key in properties)
+ {
+ var found = false;
+
+ for (var i = 0; i < custProperties.length; i++)
+ {
+ if (custProperties[i].name == key && custProperties[i].type == properties[key].type)
+ {
+ found = true;
+ break;
+ }
+ }
+
+ if (!found)
+ {
+ delete properties[key];
+ }
+ }
+ }
+ }
+};
+
+var view = this.editorUi.editor.graph.view;
+var state = view.getState(cell);
+
+if (state != null && state.shape != null)
+{
+ //Add common properties to all shapes
+ if (!state.shape.commonCustomPropAdded)
+ {
+ state.shape.commonCustomPropAdded = true;
+ state.shape.customProperties = state.shape.customProperties || [];
+
+ if (state.cell.vertex)
+ {
+ Array.prototype.push.apply(state.shape.customProperties, Editor.commonVertexProperties);
+ }
+ else
+ {
+ Array.prototype.push.apply(state.shape.customProperties, Editor.commonEdgeProperties);
+ }
+ }
+
+ handleCustomProp(state.shape.customProperties);
+}
+
+//This currently is not needed but let's keep it in case we needed in the future
+var userCustomProp = cell.getAttribute('customProperties');
+
+if (userCustomProp != null)
+{
+ try
+ {
+ handleCustomProp(JSON.parse(userCustomProp));
+ }
+ catch(e){}
+}
+};
+
+/**
+* Adds predefiend styles.
+*/
+var styleFormatPanelInit = StyleFormatPanel.prototype.init;
+
+StyleFormatPanel.prototype.init = function()
+{
+var sstate = this.editorUi.getSelectionState();
+
+if (this.defaultColorSchemes != null && this.defaultColorSchemes.length > 0 &&
+ sstate.style.shape != 'image' && !sstate.containsLabel &&
+ sstate.cells.length > 0)
+{
+ this.container.appendChild(this.addStyles(this.createPanel()));
+}
+
+styleFormatPanelInit.apply(this, arguments);
+
+if (Editor.enableCustomProperties)
+{
+ var properties = {};
+ var vertices = sstate.vertices;
+ var edges = sstate.edges;
+
+ for (var i = 0; i < vertices.length; i++)
+ {
+ this.findCommonProperties(vertices[i], properties, i == 0);
+ }
+
+ for (var i = 0; i < edges.length; i++)
+ {
+ this.findCommonProperties(edges[i], properties, vertices.length == 0 && i == 0);
+ }
+
+ if (Object.getOwnPropertyNames != null && Object.getOwnPropertyNames(properties).length > 0)
+ {
+ this.container.appendChild(this.addProperties(this.createPanel(), properties, sstate));
+ }
+}
+};
+
+/**
+* Overridden to add copy and paste style.
+*/
+var styleFormatPanelAddStyleOps = StyleFormatPanel.prototype.addStyleOps;
+
+StyleFormatPanel.prototype.addStyleOps = function(div)
+{
+var ss = this.editorUi.getSelectionState();
+
+if (ss.cells.length == 1)
+{
+ this.addActions(div, ['copyStyle', 'pasteStyle']);
+}
+else if (ss.cells.length >= 1)
+{
+ this.addActions(div, ['pasteStyle', 'pasteData']);
+}
+
+return styleFormatPanelAddStyleOps.apply(this, arguments);
+};
+
+/**
+* Initial collapsed state of the properties panel.
+*/
+EditorUi.prototype.propertiesCollapsed = true;
+
+/**
+* Create Properties Panel
+*/
+StyleFormatPanel.prototype.addProperties = function(div, properties, state)
+{
+var that = this;
+var graph = this.editorUi.editor.graph;
+var secondLevel = [];
+
+function insertAfter(newElem, curElem)
+{
+ curElem.parentNode.insertBefore(newElem, curElem.nextSibling);
+};
+
+function applyStyleVal(pName, newVal, prop, delIndex)
+{
+ graph.getModel().beginUpdate();
+ try
+ {
+ var changedProps = [];
+ var changedVals = [];
+
+ if (prop.index != null)
+ {
+ var allVals = [];
+ var curVal = prop.parentRow.nextSibling;
+
+ while(curVal && curVal.getAttribute('data-pName') == pName)
+ {
+ allVals.push(curVal.getAttribute('data-pValue'));
+ curVal = curVal.nextSibling;
+ }
+
+ if (prop.index < allVals.length)
+ {
+ if (delIndex != null)
+ {
+ allVals.splice(delIndex, 1);
+ }
+ else
+ {
+ allVals[prop.index] = newVal;
+ }
+ }
+ else
+ {
+ allVals.push(newVal);
+ }
+
+ if (prop.size != null && allVals.length > prop.size) //trim the array to the specifies size
+ {
+ allVals = allVals.slice(0, prop.size);
+ }
+
+ newVal = allVals.join(',');
+
+ if (prop.countProperty != null)
+ {
+ graph.setCellStyles(prop.countProperty, allVals.length, graph.getSelectionCells());
+
+ changedProps.push(prop.countProperty);
+ changedVals.push(allVals.length);
+ }
+ }
+
+ graph.setCellStyles(pName, newVal, graph.getSelectionCells());
+ changedProps.push(pName);
+ changedVals.push(newVal);
+
+ if (prop.dependentProps != null)
+ {
+ for (var i = 0; i < prop.dependentProps.length; i++)
+ {
+ var defVal = prop.dependentPropsDefVal[i];
+ var vals = prop.dependentPropsVals[i];
+
+ if (vals.length > newVal)
+ {
+ vals = vals.slice(0, newVal);
+ }
+ else
+ {
+ for (var j = vals.length; j < newVal; j++)
+ {
+ vals.push(defVal);
+ }
+ }
+
+ vals = vals.join(',');
+ graph.setCellStyles(prop.dependentProps[i], vals, graph.getSelectionCells());
+ changedProps.push(prop.dependentProps[i]);
+ changedVals.push(vals);
+ }
+ }
+
+ if (typeof(prop.onChange) == 'function')
+ {
+ prop.onChange(graph, newVal);
+ }
+
+ that.editorUi.fireEvent(new mxEventObject('styleChanged', 'keys', changedProps,
+ 'values', changedVals, 'cells', graph.getSelectionCells()));
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+}
+
+function setElementPos(td, elem, adjustHeight)
+{
+ var divPos = mxUtils.getOffset(div, true);
+ var pos = mxUtils.getOffset(td, true);
+ elem.style.position = 'absolute';
+ elem.style.left = (pos.x - divPos.x) + 'px';
+ elem.style.top = (pos.y - divPos.y) + 'px';
+ elem.style.width = td.offsetWidth + 'px';
+ elem.style.height = (td.offsetHeight - (adjustHeight? 4 : 0)) + 'px';
+ elem.style.zIndex = 5;
+};
+
+function createColorBtn(pName, pValue, prop)
+{
+ var clrDiv = document.createElement('div');
+ clrDiv.style.width = '32px';
+ clrDiv.style.height = '4px';
+ clrDiv.style.margin = '2px';
+ clrDiv.style.border = '1px solid black';
+ clrDiv.style.background = !pValue || pValue == 'none'? 'url(\'' + Dialog.prototype.noColorImage + '\')' : pValue;
+
+ btn = mxUtils.button('', mxUtils.bind(that, function(evt)
+ {
+ this.editorUi.pickColor(pValue, function(color)
+ {
+ clrDiv.style.background = color == 'none'? 'url(\'' + Dialog.prototype.noColorImage + '\')' : color;
+ applyStyleVal(pName, color, prop);
+ });
+ mxEvent.consume(evt);
+ }));
+
+ btn.style.height = '12px';
+ btn.style.width = '40px';
+ btn.className = 'geColorBtn';
+
+ btn.appendChild(clrDiv);
+ return btn;
+};
+
+function createDynArrList(pName, pValue, subType, defVal, countProperty, myRow, flipBkg)
+{
+ if (pValue != null)
+ {
+ var vals = pValue.split(',');
+ secondLevel.push({name: pName, values: vals, type: subType, defVal: defVal, countProperty: countProperty, parentRow: myRow, isDeletable: true, flipBkg: flipBkg});
+ }
+
+ btn = mxUtils.button('+', mxUtils.bind(that, function(evt)
+ {
+ var beforeElem = myRow;
+ var index = 0;
+
+ while (beforeElem.nextSibling != null)
+ {
+ var cur = beforeElem.nextSibling;
+ var elemPName = cur.getAttribute('data-pName');
+
+ if (elemPName == pName)
+ {
+ beforeElem = beforeElem.nextSibling;
+ index++;
+ }
+ else
+ {
+ break;
+ }
+ }
+
+ var newProp = {type: subType, parentRow: myRow, index: index, isDeletable: true, defVal: defVal, countProperty: countProperty};
+ var arrItem = createPropertyRow(pName, '', newProp, index % 2 == 0, flipBkg);
+ applyStyleVal(pName, defVal, newProp);
+ insertAfter(arrItem, beforeElem);
+
+ mxEvent.consume(evt);
+ }));
+
+ btn.style.height = '16px';
+ btn.style.width = '25px';
+ btn.className = 'geColorBtn';
+
+ return btn;
+};
+
+function createStaticArrList(pName, pValue, subType, defVal, size, myRow, flipBkg)
+{
+ if (size > 0)
+ {
+ var vals = new Array(size);
+
+ var curVals = pValue != null? pValue.split(',') : [];
+
+ for (var i = 0; i < size; i++)
+ {
+ vals[i] = curVals[i] != null? curVals[i] : (defVal != null? defVal : '');
+ }
+
+ secondLevel.push({name: pName, values: vals, type: subType, defVal: defVal, parentRow: myRow, flipBkg: flipBkg, size: size});
+ }
+
+ return document.createElement('div'); //empty cell
+};
+
+function createCheckbox(pName, pValue, prop)
+{
+ var input = document.createElement('input');
+ input.type = 'checkbox';
+ input.checked = pValue == '1';
+
+ mxEvent.addListener(input, 'change', function()
+ {
+ applyStyleVal(pName, input.checked? '1' : '0', prop);
+ });
+ return input;
+};
+
+function createPropertyRow(pName, pValue, prop, isOdd, flipBkg)
+{
+ var pDiplayName = prop.dispName;
+ var pType = prop.type;
+ var row = document.createElement('tr');
+ row.className = 'gePropRow' + (flipBkg? 'Dark' : '') + (isOdd? 'Alt' : '') + ' gePropNonHeaderRow';
+ row.setAttribute('data-pName', pName);
+ row.setAttribute('data-pValue', pValue);
+ var rightAlig = false;
+
+ if (prop.index != null)
+ {
+ row.setAttribute('data-index', prop.index);
+ pDiplayName = (pDiplayName != null? pDiplayName : '') + '[' + prop.index + ']';
+ rightAlig = true;
+ }
+
+ var td = document.createElement('td');
+ td.className = 'gePropRowCell';
+ var label = mxResources.get(pDiplayName, null, pDiplayName);
+ mxUtils.write(td, label);
+ td.setAttribute('title', label);
+
+ if (rightAlig)
+ {
+ td.style.textAlign = 'right';
+ }
+
+ row.appendChild(td);
+ td = document.createElement('td');
+ td.className = 'gePropRowCell';
+
+ if (pType == 'color')
+ {
+ td.appendChild(createColorBtn(pName, pValue, prop));
+ }
+ else if (pType == 'bool' || pType == 'boolean')
+ {
+ td.appendChild(createCheckbox(pName, pValue, prop));
+ }
+ else if (pType == 'enum')
+ {
+ var pEnumList = prop.enumList;
+
+ for (var i = 0; i < pEnumList.length; i++)
+ {
+ var op = pEnumList[i];
+
+ if (op.val == pValue)
+ {
+ mxUtils.write(td, mxResources.get(op.dispName, null, op.dispName));
+ break;
+ }
+ }
+
+ mxEvent.addListener(td, 'click', mxUtils.bind(that, function()
+ {
+ var select = document.createElement('select');
+ setElementPos(td, select);
+
+ for (var i = 0; i < pEnumList.length; i++)
+ {
+ var op = pEnumList[i];
+ var opElem = document.createElement('option');
+ opElem.value = mxUtils.htmlEntities(op.val);
+ mxUtils.write(opElem, mxResources.get(op.dispName, null, op.dispName));
+ select.appendChild(opElem);
+ }
+
+ select.value = pValue;
+
+ div.appendChild(select);
+
+ mxEvent.addListener(select, 'change', function()
+ {
+ var newVal = mxUtils.htmlEntities(select.value);
+ applyStyleVal(pName, newVal, prop);
+ //set value triggers a redraw of the panel which removes the select and updates the row
+ });
+
+ select.focus();
+
+ //FF calls blur on focus! so set the event after focusing (not with selects but to be safe)
+ mxEvent.addListener(select, 'blur', function()
+ {
+ div.removeChild(select);
+ });
+ }));
+ }
+ else if (pType == 'dynamicArr')
+ {
+ td.appendChild(createDynArrList(pName, pValue, prop.subType, prop.subDefVal, prop.countProperty, row, flipBkg));
+ }
+ else if (pType == 'staticArr')
+ {
+ td.appendChild(createStaticArrList(pName, pValue, prop.subType, prop.subDefVal, prop.size, row, flipBkg));
+ }
+ else if (pType == 'readOnly')
+ {
+ var inp = document.createElement('input');
+ inp.setAttribute('readonly', '');
+ inp.value = pValue;
+ inp.style.width = '96px';
+ inp.style.borderWidth = '0px';
+ td.appendChild(inp);
+ }
+ else
+ {
+ td.innerHTML = mxUtils.htmlEntities(decodeURIComponent(pValue));
+
+ mxEvent.addListener(td, 'click', mxUtils.bind(that, function()
+ {
+ var input = document.createElement('input');
+ setElementPos(td, input, true);
+ input.value = decodeURIComponent(pValue);
+ input.className = 'gePropEditor';
+
+ if ((pType == 'int' || pType == 'float') && !prop.allowAuto)
+ {
+ input.type = 'number';
+ input.step = pType == 'int'? '1' : 'any';
+
+ if (prop.min != null)
+ {
+ input.min = parseFloat(prop.min);
+ }
+
+ if (prop.max != null)
+ {
+ input.max = parseFloat(prop.max);
+ }
+ }
+
+ div.appendChild(input);
+
+ function setInputVal()
+ {
+ var inputVal = input.value;
+ inputVal = inputVal.length == 0 && pType != 'string'? 0 : inputVal;
+
+ if (prop.allowAuto)
+ {
+ if (inputVal.trim != null && inputVal.trim().toLowerCase() == 'auto')
+ {
+ inputVal = 'auto';
+ pType = 'string';
+ }
+ else
+ {
+ inputVal = parseFloat(inputVal);
+ inputVal = isNaN(inputVal)? 0 : inputVal;
+ }
+ }
+
+ if (prop.min != null && inputVal < prop.min)
+ {
+ inputVal = prop.min;
+ }
+ else if (prop.max != null && inputVal > prop.max)
+ {
+ inputVal = prop.max;
+ }
+
+ var newVal = encodeURIComponent((pType == 'int'? parseInt(inputVal) : inputVal) + '');
+
+ applyStyleVal(pName, newVal, prop);
+ }
+
+ mxEvent.addListener(input, 'keypress', function(e)
+ {
+ if (e.keyCode == 13)
+ {
+ setInputVal();
+ //set value triggers a redraw of the panel which removes the input
+ }
+ });
+
+ input.focus();
+
+ //FF calls blur on focus! so set the event after focusing
+ mxEvent.addListener(input, 'blur', function()
+ {
+ setInputVal();
+ });
+ }));
+ }
+
+ if (prop.isDeletable)
+ {
+ var delBtn = mxUtils.button('-', mxUtils.bind(that, function(evt)
+ {
+ //delete the node by refreshing the properties
+ applyStyleVal(pName, '', prop, prop.index);
+
+ mxEvent.consume(evt);
+ }));
+
+ delBtn.style.height = '16px';
+ delBtn.style.width = '25px';
+ delBtn.style.float = 'right';
+ delBtn.className = 'geColorBtn';
+ td.appendChild(delBtn);
+ }
+
+ row.appendChild(td);
+ return row;
+};
+
+div.style.position = 'relative';
+div.style.padding = '0';
+var grid = document.createElement('table');
+grid.className = 'geProperties';
+grid.style.whiteSpace = 'nowrap';
+grid.style.width = '100%';
+//create header row
+var hrow = document.createElement('tr');
+hrow.className = 'gePropHeader';
+var th = document.createElement('th');
+th.className = 'gePropHeaderCell';
+var collapseImg = document.createElement('img');
+collapseImg.src = Sidebar.prototype.expandedImage;
+collapseImg.style.verticalAlign = 'middle';
+th.appendChild(collapseImg);
+mxUtils.write(th, mxResources.get('property'));
+hrow.style.cursor = 'pointer';
+
+var onFold = function()
+{
+ var rows = grid.querySelectorAll('.gePropNonHeaderRow');
+ var display;
+
+ if (!that.editorUi.propertiesCollapsed)
+ {
+ collapseImg.src = Sidebar.prototype.expandedImage;
+ display = '';
+ }
+ else
+ {
+ collapseImg.src = Sidebar.prototype.collapsedImage;
+ display = 'none';
+
+ for (var e = div.childNodes.length - 1; e >= 0 ; e--)
+ {
+ //Blur can be executed concurrently with this method and the element is removed before removing it here
+ try
+ {
+ var child = div.childNodes[e];
+ var nodeName = child.nodeName.toUpperCase();
+
+ if (nodeName == 'INPUT' || nodeName == 'SELECT')
+ {
+ div.removeChild(child);
+ }
+ }
+ catch(ex){}
+ }
+ }
+
+ for (var r = 0; r < rows.length; r++)
+ {
+ rows[r].style.display = display;
+ }
+};
+
+mxEvent.addListener(hrow, 'click', function()
+{
+ that.editorUi.propertiesCollapsed = !that.editorUi.propertiesCollapsed;
+ onFold();
+});
+hrow.appendChild(th);
+th = document.createElement('th');
+th.className = 'gePropHeaderCell';
+th.innerHTML = mxResources.get('value');
+hrow.appendChild(th);
+grid.appendChild(hrow);
+
+var isOdd = false;
+var flipBkg = false;
+
+var cellId = null;
+
+if (state.vertices.length == 1 && state.edges.length == 0)
+{
+ cellId = state.vertices[0].id;
+}
+else if (state.vertices.length == 0 && state.edges.length == 1)
+{
+ cellId = state.edges[0].id;
+}
+
+//Add it to top (always)
+if (cellId != null)
+{
+ grid.appendChild(createPropertyRow('id', mxUtils.htmlEntities(cellId), {dispName: 'ID', type: 'readOnly'}, true, false));
+}
+
+for (var key in properties)
+{
+ var prop = properties[key];
+
+ if (typeof(prop.isVisible) == 'function')
+ {
+ if (!prop.isVisible(state, this)) continue;
+ }
+
+ var pValue = state.style[key] != null? mxUtils.htmlEntities(state.style[key] + '') :
+ ((prop.getDefaultValue != null) ? prop.getDefaultValue(state, this) : prop.defVal); //or undefined if defVal is undefined
+
+ if (prop.type == 'separator')
+ {
+ flipBkg = !flipBkg;
+ continue;
+ }
+ else if (prop.type == 'staticArr') //if dynamic values are needed, a more elegant technique is needed to replace such values
+ {
+ prop.size = parseInt(state.style[prop.sizeProperty] || properties[prop.sizeProperty].defVal) || 0;
+ }
+ else if (prop.dependentProps != null)
+ {
+ var dependentProps = prop.dependentProps;
+ var dependentPropsVals = [];
+ var dependentPropsDefVal = [];
+
+ for (var i = 0; i < dependentProps.length; i++)
+ {
+ var propVal = state.style[dependentProps[i]];
+ dependentPropsDefVal.push(properties[dependentProps[i]].subDefVal);
+ dependentPropsVals.push(propVal != null? propVal.split(',') : []);
+ }
+
+ prop.dependentPropsDefVal = dependentPropsDefVal;
+ prop.dependentPropsVals = dependentPropsVals;
+ }
+
+ grid.appendChild(createPropertyRow(key, pValue, prop, isOdd, flipBkg));
+
+ isOdd = !isOdd;
+}
+
+for (var i = 0; i < secondLevel.length; i++)
+{
+ var prop = secondLevel[i];
+ var insertElem = prop.parentRow;
+
+ for (var j = 0; j < prop.values.length; j++)
+ {
+ //mxUtils.clone failed because of the HTM element, so manual cloning is used
+ var iProp = {type: prop.type, parentRow: prop.parentRow, isDeletable: prop.isDeletable, index: j, defVal: prop.defVal, countProperty: prop.countProperty, size: prop.size};
+ var arrItem = createPropertyRow(prop.name, prop.values[j], iProp, j % 2 == 0, prop.flipBkg);
+ insertAfter(arrItem, insertElem);
+ insertElem = arrItem;
+ }
+}
+
+div.appendChild(grid);
+onFold();
+
+return div;
+};
+
+/**
+* Creates the buttons for the predefined styles.
+*/
+StyleFormatPanel.prototype.addStyles = function(div)
+{
+if (this.defaultColorSchemes != null)
+{
+ var ui = this.editorUi;
+ var graph = ui.editor.graph;
+ var picker = document.createElement('div');
+ picker.style.whiteSpace = 'nowrap';
+ picker.style.paddingLeft = '24px';
+ picker.style.paddingRight = '20px';
+ div.style.paddingLeft = '16px';
+ div.style.paddingBottom = '6px';
+ div.style.position = 'relative';
+ div.appendChild(picker);
+
+ var stylenames = ['plain-gray', 'plain-blue', 'plain-green', 'plain-turquoise',
+ 'plain-orange', 'plain-yellow', 'plain-red', 'plain-pink', 'plain-purple', 'gray',
+ 'blue', 'green', 'turquoise', 'orange', 'yellow', 'red', 'pink', 'purple'];
+
+ // Maximum palettes to switch the switcher
+ var maxEntries = 10;
+
+ // Selector
+ var switcher = document.createElement('div');
+ switcher.style.whiteSpace = 'nowrap';
+ switcher.style.position = 'relative';
+ switcher.style.textAlign = 'center';
+ switcher.style.width = '210px';
+
+ var dots = [];
+
+ for (var i = 0; i < this.defaultColorSchemes.length; i++)
+ {
+ var dot = document.createElement('div');
+ dot.style.display = 'inline-block';
+ dot.style.width = '6px';
+ dot.style.height = '6px';
+ dot.style.marginLeft = '4px';
+ dot.style.marginRight = '3px';
+ dot.style.borderRadius = '3px';
+ dot.style.cursor = 'pointer';
+ dot.style.background = 'transparent';
+ dot.style.border = '1px solid #b5b6b7';
+
+ (mxUtils.bind(this, function(index)
+ {
+ mxEvent.addListener(dot, 'click', mxUtils.bind(this, function()
+ {
+ setScheme(index);
+ }));
+ }))(i);
+
+ dots.push(dot);
+ switcher.appendChild(dot);
+ }
+
+ var setScheme = mxUtils.bind(this, function(index)
+ {
+ if (dots[index] != null)
+ {
+ if (this.format.currentScheme != null && dots[this.format.currentScheme] != null)
+ {
+ dots[this.format.currentScheme].style.background = 'transparent';
+ }
+
+ this.format.currentScheme = index;
+ updateScheme(this.defaultColorSchemes[this.format.currentScheme]);
+ dots[this.format.currentScheme].style.background = '#84d7ff';
+ }
+ });
+
+ var updateScheme = mxUtils.bind(this, function(colorsets)
+ {
+ var addButton = mxUtils.bind(this, function(colorset)
+ {
+ var btn = mxUtils.button('', mxUtils.bind(this, function(evt)
+ {
+ graph.getModel().beginUpdate();
+ try
+ {
+ var cells = ui.getSelectionState().cells;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var style = graph.getModel().getStyle(cells[i]);
+
+ for (var j = 0; j < stylenames.length; j++)
+ {
+ style = mxUtils.removeStylename(style, stylenames[j]);
+ }
+
+ var defaults = (graph.getModel().isVertex(cells[i])) ? graph.defaultVertexStyle : graph.defaultEdgeStyle;
+
+ if (colorset != null)
+ {
+ if (!mxEvent.isShiftDown(evt))
+ {
+ if (colorset['fill'] == '')
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_FILLCOLOR, null);
+ }
+ else
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_FILLCOLOR, colorset['fill'] ||
+ mxUtils.getValue(defaults, mxConstants.STYLE_FILLCOLOR, null));
+ }
+
+ style = mxUtils.setStyle(style, mxConstants.STYLE_GRADIENTCOLOR, colorset['gradient'] ||
+ mxUtils.getValue(defaults, mxConstants.STYLE_GRADIENTCOLOR, null));
+
+ if (!mxEvent.isControlDown(evt) && (!mxClient.IS_MAC || !mxEvent.isMetaDown(evt)) &&
+ graph.getModel().isVertex(cells[i]))
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_FONTCOLOR, colorset['font'] ||
+ mxUtils.getValue(defaults, mxConstants.STYLE_FONTCOLOR, null));
+ }
+ }
+
+ if (!mxEvent.isAltDown(evt))
+ {
+ if (colorset['stroke'] == '')
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_STROKECOLOR, null);
+ }
+ else
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_STROKECOLOR, colorset['stroke'] ||
+ mxUtils.getValue(defaults, mxConstants.STYLE_STROKECOLOR, null));
+ }
+ }
+ }
+ else
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_FILLCOLOR,
+ mxUtils.getValue(defaults, mxConstants.STYLE_FILLCOLOR, '#ffffff'));
+ style = mxUtils.setStyle(style, mxConstants.STYLE_STROKECOLOR,
+ mxUtils.getValue(defaults, mxConstants.STYLE_STROKECOLOR, '#000000'));
+ style = mxUtils.setStyle(style, mxConstants.STYLE_GRADIENTCOLOR,
+ mxUtils.getValue(defaults, mxConstants.STYLE_GRADIENTCOLOR, null));
+
+ if (graph.getModel().isVertex(cells[i]))
+ {
+ style = mxUtils.setStyle(style, mxConstants.STYLE_FONTCOLOR,
+ mxUtils.getValue(defaults, mxConstants.STYLE_FONTCOLOR, null));
+ }
+ }
+
+ graph.getModel().setStyle(cells[i], style);
+ }
+ }
+ finally
+ {
+ graph.getModel().endUpdate();
+ }
+ }));
+
+ btn.className = 'geStyleButton';
+ btn.style.width = '36px';
+ btn.style.height = (this.defaultColorSchemes.length <= maxEntries) ? '24px' : '30px';
+ btn.style.margin = '0px 6px 6px 0px';
+
+ if (colorset != null)
+ {
+ var b = (Editor.isDarkMode()) ? '2px solid' : '1px solid';
+
+ if (colorset['border'] != null)
+ {
+ b = colorset['border'];
+ }
+
+ if (colorset['gradient'] != null)
+ {
+ if (mxClient.IS_IE && (document.documentMode < 10))
+ {
+ btn.style.filter = 'progid:DXImageTransform.Microsoft.Gradient('+
+ 'StartColorStr=\'' + colorset['fill'] +
+ '\', EndColorStr=\'' + colorset['gradient'] + '\', GradientType=0)';
+ }
+ else
+ {
+ btn.style.backgroundImage = 'linear-gradient(' + colorset['fill'] + ' 0px,' +
+ colorset['gradient'] + ' 100%)';
+ }
+ }
+ else if (colorset['fill'] == mxConstants.NONE)
+ {
+ btn.style.background = 'url(\'' + Dialog.prototype.noColorImage + '\')';
+ }
+ else if (colorset['fill'] == '')
+ {
+ btn.style.backgroundColor = mxUtils.getValue(graph.defaultVertexStyle,
+ mxConstants.STYLE_FILLCOLOR, (Editor.isDarkMode()) ? Editor.darkColor : '#ffffff');
+ }
+ else
+ {
+ btn.style.backgroundColor = colorset['fill'] || mxUtils.getValue(graph.defaultVertexStyle,
+ mxConstants.STYLE_FILLCOLOR, (Editor.isDarkMode()) ? Editor.darkColor : '#ffffff');
+ }
+
+ if (colorset['stroke'] == mxConstants.NONE)
+ {
+ btn.style.border = b + ' transparent';
+ }
+ else if (colorset['stroke'] == '')
+ {
+ btn.style.border = b + ' ' + mxUtils.getValue(graph.defaultVertexStyle,
+ mxConstants.STYLE_STROKECOLOR, (!Editor.isDarkMode()) ? Editor.darkColor : '#ffffff');
+ }
+ else
+ {
+ btn.style.border = b + ' ' + (colorset['stroke'] || mxUtils.getValue(graph.defaultVertexStyle,
+ mxConstants.STYLE_STROKECOLOR, (!Editor.isDarkMode()) ? Editor.darkColor : '#ffffff'));
+ }
+
+ if (colorset['title'] != null)
+ {
+ btn.setAttribute('title', colorset['title']);
+ }
+ }
+ else
+ {
+ var bg = mxUtils.getValue(graph.defaultVertexStyle, mxConstants.STYLE_FILLCOLOR, '#ffffff');
+ var bd = mxUtils.getValue(graph.defaultVertexStyle, mxConstants.STYLE_STROKECOLOR, '#000000');
+
+ btn.style.backgroundColor = bg;
+ btn.style.border = '1px solid ' + bd;
+ }
+
+ btn.style.borderRadius = '0';
+
+ picker.appendChild(btn);
+ });
+
+ picker.innerText = '';
+
+ for (var i = 0; i < colorsets.length; i++)
+ {
+ if (i > 0 && mxUtils.mod(i, 4) == 0)
+ {
+ mxUtils.br(picker);
+ }
+
+ addButton(colorsets[i]);
+ }
+ });
+
+ if (this.format.currentScheme == null)
+ {
+ setScheme(Math.min(dots.length - 1, Editor.isDarkMode()
+ ? 1 : (urlParams['sketch'] == '1' ? 5 : 0)));
+ }
+ else
+ {
+ setScheme(this.format.currentScheme);
+ }
+
+ var bottom = (this.defaultColorSchemes.length <= maxEntries) ? 28 : 8;
+
+ var left = document.createElement('div');
+ left.style.cssText = 'position:absolute;left:10px;top:8px;bottom:' + bottom + 'px;width:20px;margin:4px;opacity:0.5;' +
+ 'background-repeat:no-repeat;background-position:center center;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQBAMAAADQT4M0AAAAIVBMVEUAAAB2dnZ4eHh3d3d1dXVxcXF2dnZ2dnZ2dnZxcXF2dnYmb3w1AAAACnRSTlMAfCTkhhvb7cQSPH2JPgAAADRJREFUCNdjwACMAmBKaiGYs2oJmLPKAZ3DabU8AMRTXpUKopislqFyVzCAuUZgikkBZjoAcMYLnp53P/UAAAAASUVORK5CYII=);';
+
+ mxEvent.addListener(left, 'click', mxUtils.bind(this, function()
+ {
+ setScheme(mxUtils.mod(this.format.currentScheme - 1, this.defaultColorSchemes.length));
+ }));
+
+ var right = document.createElement('div');
+ right.style.cssText = 'position:absolute;left:202px;top:8px;bottom:' + bottom + 'px;width:20px;margin:4px;opacity:0.5;' +
+ 'background-repeat:no-repeat;background-position:center center;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQBAMAAADQT4M0AAAAIVBMVEUAAAB2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnYBuwCcAAAACnRSTlMAfCTkhhvb7cQSPH2JPgAAADZJREFUCNdjQAOMAmBKaiGY8loF5rKswsZlrVo8AUiFrTICcbIWK8A5DF1gDoMymMPApIAwHwCS0Qx/U7qCBQAAAABJRU5ErkJggg==);';
+
+ if (this.defaultColorSchemes.length > 1)
+ {
+ div.appendChild(left);
+ div.appendChild(right);
+ }
+
+ mxEvent.addListener(right, 'click', mxUtils.bind(this, function()
+ {
+ setScheme(mxUtils.mod(this.format.currentScheme + 1, this.defaultColorSchemes.length));
+ }));
+
+ // Hover state
+ function addHoverState(elt)
+ {
+ mxEvent.addListener(elt, 'mouseenter', function()
+ {
+ elt.style.opacity = '1';
+ });
+ mxEvent.addListener(elt, 'mouseleave', function()
+ {
+ elt.style.opacity = '0.5';
+ });
+ };
+
+ addHoverState(left);
+ addHoverState(right);
+
+ updateScheme(this.defaultColorSchemes[this.format.currentScheme]);
+
+ if (this.defaultColorSchemes.length <= maxEntries)
+ {
+ div.appendChild(switcher);
+ }
+}
+
+return div;
+};
diff --git a/oaweb/public/cherry/drawio/Graph.js b/oaweb/public/cherry/drawio/Graph.js
new file mode 100644
index 0000000..552f163
--- /dev/null
+++ b/oaweb/public/cherry/drawio/Graph.js
@@ -0,0 +1,15007 @@
+/**
+ * Copyright (c) 2006-2012, JGraph Ltd
+ */
+// Workaround for handling named HTML entities in mxUtils.parseXml
+// LATER: How to configure DOMParser to just ignore all entities?
+(function()
+{
+ var entities = [
+ ['nbsp', '160'],
+ ['shy', '173']
+ ];
+
+ var parseXml = mxUtils.parseXml;
+
+ mxUtils.parseXml = function(text)
+ {
+ for (var i = 0; i < entities.length; i++)
+ {
+ text = text.replace(new RegExp(
+ '&' + entities[i][0] + ';', 'g'),
+ '&#' + entities[i][1] + ';');
+ }
+
+ return parseXml(text);
+ };
+})();
+
+// Shim for missing toISOString in older versions of IE
+// See https://stackoverflow.com/questions/12907862
+if (!Date.prototype.toISOString)
+{
+ (function()
+ {
+ function pad(number)
+ {
+ var r = String(number);
+
+ if (r.length === 1)
+ {
+ r = '0' + r;
+ }
+
+ return r;
+ };
+
+ Date.prototype.toISOString = function()
+ {
+ return this.getUTCFullYear()
+ + '-' + pad( this.getUTCMonth() + 1 )
+ + '-' + pad( this.getUTCDate() )
+ + 'T' + pad( this.getUTCHours() )
+ + ':' + pad( this.getUTCMinutes() )
+ + ':' + pad( this.getUTCSeconds() )
+ + '.' + String( (this.getUTCMilliseconds()/1000).toFixed(3) ).slice( 2, 5 )
+ + 'Z';
+ };
+ }());
+}
+
+// Shim for Date.now()
+if (!Date.now)
+{
+ Date.now = function()
+ {
+ return new Date().getTime();
+ };
+}
+
+// Polyfill for Uint8Array.from in IE11 used in Graph.decompress
+// See https://stackoverflow.com/questions/36810940/alternative-or-polyfill-for-array-from-on-the-internet-explorer
+if (!Uint8Array.from) {
+ Uint8Array.from = (function () {
+ var toStr = Object.prototype.toString;
+ var isCallable = function (fn) {
+ return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
+ };
+ var toInteger = function (value) {
+ var number = Number(value);
+ if (isNaN(number)) { return 0; }
+ if (number === 0 || !isFinite(number)) { return number; }
+ return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));
+ };
+ var maxSafeInteger = Math.pow(2, 53) - 1;
+ var toLength = function (value) {
+ var len = toInteger(value);
+ return Math.min(Math.max(len, 0), maxSafeInteger);
+ };
+
+ // The length property of the from method is 1.
+ return function from(arrayLike/*, mapFn, thisArg */) {
+ // 1. Let C be the this value.
+ var C = this;
+
+ // 2. Let items be ToObject(arrayLike).
+ var items = Object(arrayLike);
+
+ // 3. ReturnIfAbrupt(items).
+ if (arrayLike == null) {
+ throw new TypeError("Array.from requires an array-like object - not null or undefined");
+ }
+
+ // 4. If mapfn is undefined, then let mapping be false.
+ var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
+ var T;
+ if (typeof mapFn !== 'undefined') {
+ // 5. else
+ // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.
+ if (!isCallable(mapFn)) {
+ throw new TypeError('Array.from: when provided, the second argument must be a function');
+ }
+
+ // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.
+ if (arguments.length > 2) {
+ T = arguments[2];
+ }
+ }
+
+ // 10. Let lenValue be Get(items, "length").
+ // 11. Let len be ToLength(lenValue).
+ var len = toLength(items.length);
+
+ // 13. If IsConstructor(C) is true, then
+ // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.
+ // 14. a. Else, Let A be ArrayCreate(len).
+ var A = isCallable(C) ? Object(new C(len)) : new Array(len);
+
+ // 16. Let k be 0.
+ var k = 0;
+ // 17. Repeat, while k < len… (also steps a - h)
+ var kValue;
+ while (k < len) {
+ kValue = items[k];
+ if (mapFn) {
+ A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
+ } else {
+ A[k] = kValue;
+ }
+ k += 1;
+ }
+ // 18. Let putStatus be Put(A, "length", len, true).
+ A.length = len;
+ // 20. Return A.
+ return A;
+ };
+ }());
+}
+
+/**
+ * Measurements Units
+ */
+mxConstants.POINTS = 1;
+mxConstants.MILLIMETERS = 2;
+mxConstants.INCHES = 3;
+mxConstants.METERS = 4;
+
+/**
+ * This ratio is with page scale 1
+ */
+mxConstants.PIXELS_PER_MM = 3.937;
+mxConstants.PIXELS_PER_INCH = 100;
+mxConstants.SHADOW_OPACITY = 0.25;
+mxConstants.SHADOWCOLOR = '#000000';
+mxConstants.VML_SHADOWCOLOR = '#d0d0d0';
+
+mxCodec.allowlist = ['mxStylesheet', 'Array', 'mxGraphModel', 'html',
+ 'mxCell', 'mxGeometry', 'mxRectangle', 'mxPoint',
+ 'mxChildChange', 'mxRootChange', 'mxTerminalChange',
+ 'mxValueChange', 'mxStyleChange', 'mxGeometryChange',
+ 'mxCollapseChange', 'mxVisibleChange', 'mxCellAttributeChange'];
+mxGraph.prototype.pageBreakColor = '#c0c0c0';
+mxGraph.prototype.pageScale = 1;
+
+// Letter page format is default in US, Canada and Mexico
+(function()
+{
+ try
+ {
+ if (navigator != null && navigator.language != null)
+ {
+ var lang = navigator.language.toLowerCase();
+ mxGraph.prototype.pageFormat = (lang === 'en-us' || lang === 'en-ca' || lang === 'es-mx') ?
+ mxConstants.PAGE_FORMAT_LETTER_PORTRAIT : mxConstants.PAGE_FORMAT_A4_PORTRAIT;
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+})();
+
+// Matches label positions of mxGraph 1.x
+mxText.prototype.baseSpacingTop = 5;
+mxText.prototype.baseSpacingBottom = 1;
+
+// Keeps edges between relative child cells inside parent
+mxGraphModel.prototype.ignoreRelativeEdgeParent = false;
+
+// Defines grid properties
+mxGraphView.prototype.gridImage = (mxClient.IS_SVG) ? 'data:image/gif;base64,R0lGODlhCgAKAJEAAAAAAP///8zMzP///yH5BAEAAAMALAAAAAAKAAoAAAIJ1I6py+0Po2wFADs=' :
+ IMAGE_PATH + '/grid.gif';
+mxGraphView.prototype.gridSteps = 4;
+mxGraphView.prototype.minGridSize = 4;
+
+// UrlParams is null in embed mode
+mxGraphView.prototype.defaultGridColor = '#d0d0d0';
+mxGraphView.prototype.defaultDarkGridColor = '#424242';
+mxGraphView.prototype.gridColor = mxGraphView.prototype.defaultGridColor;
+
+// Units
+mxGraphView.prototype.unit = mxConstants.POINTS;
+
+mxGraphView.prototype.setUnit = function(unit)
+{
+ if (this.unit != unit)
+ {
+ this.unit = unit;
+
+ this.fireEvent(new mxEventObject('unitChanged', 'unit', unit));
+ }
+};
+
+// Alternative text for unsupported foreignObjects
+mxSvgCanvas2D.prototype.foAltText = '[Not supported by viewer]';
+
+// Hook for custom constraints
+mxShape.prototype.getConstraints = function(style, w, h)
+{
+ return null;
+};
+
+// Override for clipSvg style
+mxImageShape.prototype.getImageDataUri = function()
+{
+ var src = this.image;
+
+ if (src.substring(0, 26) == 'data:image/svg+xml;base64,' && this.style != null &&
+ mxUtils.getValue(this.style, 'clipSvg', '0') == '1')
+ {
+ if (this.clippedSvg == null || this.clippedImage != src)
+ {
+ this.clippedSvg = Graph.clipSvgDataUri(src, true);
+ this.clippedImage = src;
+ }
+
+ src = this.clippedSvg;
+ }
+
+ return src;
+};
+
+// Override to use key as fallback
+(function()
+{
+ var mxResourcesGet = mxResources.get;
+
+ mxResources.get = function(key, params, defaultValue)
+ {
+ if (defaultValue == null)
+ {
+ defaultValue = key;
+ }
+
+ return mxResourcesGet.apply(this, [key, params, defaultValue]);
+ };
+
+})();
+
+/**
+ * Constructs a new graph instance. Note that the constructor does not take a
+ * container because the graph instance is needed for creating the UI, which
+ * in turn will create the container for the graph. Hence, the container is
+ * assigned later in EditorUi.
+ */
+/**
+ * Defines graph class.
+ */
+Graph = function(container, model, renderHint, stylesheet, themes, standalone)
+{
+ mxGraph.call(this, container, model, renderHint, stylesheet);
+
+ this.themes = themes || this.defaultThemes;
+ this.currentEdgeStyle = mxUtils.clone(this.defaultEdgeStyle);
+ this.currentVertexStyle = mxUtils.clone(this.defaultVertexStyle);
+ this.standalone = (standalone != null) ? standalone : false;
+
+ // Sets the base domain URL and domain path URL for relative links.
+ var b = this.baseUrl;
+ var p = b.indexOf('//');
+ this.domainUrl = '';
+ this.domainPathUrl = '';
+
+ if (p > 0)
+ {
+ var d = b.indexOf('/', p + 2);
+
+ if (d > 0)
+ {
+ this.domainUrl = b.substring(0, d);
+ }
+
+ d = b.lastIndexOf('/');
+
+ if (d > 0)
+ {
+ this.domainPathUrl = b.substring(0, d + 1);
+ }
+ }
+
+ // Adds support for HTML labels via style. Note: Currently, only the Java
+ // backend supports HTML labels but CSS support is limited to the following:
+ // http://docs.oracle.com/javase/6/docs/api/index.html?javax/swing/text/html/CSS.html
+ // TODO: Wrap should not affect isHtmlLabel output (should be handled later)
+ this.isHtmlLabel = function(cell)
+ {
+ var style = this.getCurrentCellStyle(cell);
+
+ return (style != null) ? (style['html'] == '1' || style[mxConstants.STYLE_WHITE_SPACE] == 'wrap') : false;
+ };
+
+ // Implements a listener for hover and click handling on edges and tables
+ if (this.immediateHandling)
+ {
+ var start = {
+ point: null,
+ event: null,
+ state: null,
+ handle: null,
+ selected: false
+ };
+
+ var initialSelected = false;
+
+ // Uses this event to process mouseDown to check the selection state before it is changed
+ this.addListener(mxEvent.FIRE_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
+ {
+ if (evt.getProperty('eventName') == 'mouseDown' && this.isEnabled())
+ {
+ var me = evt.getProperty('event');
+ var state = me.getState();
+ var s = this.view.scale;
+
+ if (!mxEvent.isAltDown(me.getEvent()) && state != null)
+ {
+ initialSelected = this.isCellSelected(state.cell);
+
+ if (!this.panningHandler.isActive() && !mxEvent.isControlDown(me.getEvent()))
+ {
+ var handler = this.selectionCellsHandler.getHandler(state.cell);
+
+ // Cell handles have precedence over row and col resize
+ if (handler == null || handler.getHandleForEvent(me) == null)
+ {
+ var box = new mxRectangle(me.getGraphX() - 1, me.getGraphY() - 1);
+ var tol = mxEvent.isTouchEvent(me.getEvent()) ?
+ mxShape.prototype.svgStrokeTolerance - 1 :
+ (mxShape.prototype.svgStrokeTolerance + 2) / 2;
+ var t1 = tol + 2;
+ box.grow(tol);
+
+ // Ignores clicks inside cell to avoid delayed selection on
+ // merged cells when clicking on invisible part of dividers
+ if (this.isTableCell(state.cell) && this.isCellMovable(state.cell) &&
+ !this.isCellSelected(state.cell) &&
+ (!mxUtils.contains(state, me.getGraphX() - t1, me.getGraphY() - t1) ||
+ !mxUtils.contains(state, me.getGraphX() - t1, me.getGraphY() + t1) ||
+ !mxUtils.contains(state, me.getGraphX() + t1, me.getGraphY() + t1) ||
+ !mxUtils.contains(state, me.getGraphX() + t1, me.getGraphY() - t1)))
+ {
+ var row = this.model.getParent(state.cell);
+ var table = this.model.getParent(row);
+
+ if (!this.isCellSelected(table))
+ {
+ var b = tol * s;
+ var b2 = 2 * b;
+
+ // Ignores events on top line of top row and left line of left column
+ if ((this.model.getChildAt(table, 0) != row) && mxUtils.intersects(box,
+ new mxRectangle(state.x, state.y - b, state.width, b2)) ||
+ (this.model.getChildAt(row, 0) != state.cell) && mxUtils.intersects(box,
+ new mxRectangle(state.x - b, state.y, b2, state.height)) ||
+ mxUtils.intersects(box, new mxRectangle(state.x, state.y + state.height - b, state.width, b2)) ||
+ mxUtils.intersects(box, new mxRectangle(state.x + state.width - b, state.y, b2, state.height)))
+ {
+ var wasSelected = this.selectionCellsHandler.isHandled(table);
+ this.selectCellForEvent(table, me.getEvent());
+ handler = this.selectionCellsHandler.getHandler(table);
+
+ if (handler != null)
+ {
+ var handle = handler.getHandleForEvent(me);
+
+ if (handle != null)
+ {
+ handler.start(me.getGraphX(), me.getGraphY(), handle);
+ handler.blockDelayedSelection = !wasSelected;
+ me.consume();
+ }
+ }
+ }
+ }
+ }
+
+ // Hover for swimlane start sizes inside tables
+ var current = state;
+
+ while (!me.isConsumed() && current != null && (this.isTableCell(current.cell) ||
+ this.isTableRow(current.cell) || this.isTable(current.cell)))
+ {
+ if (this.isSwimlane(current.cell) && this.isCellMovable(current.cell))
+ {
+ var offset = this.getActualStartSize(current.cell);
+
+ if (((offset.x > 0 || offset.width > 0) && mxUtils.intersects(box, new mxRectangle(
+ current.x + (offset.x - offset.width - 1) * s + ((offset.x == 0) ? current.width : 0),
+ current.y, 1, current.height))) || ((offset.y > 0 || offset.height > 0) &&
+ mxUtils.intersects(box, new mxRectangle(current.x, current.y + (offset.y -
+ offset.height - 1) * s + ((offset.y == 0) ? current.height : 0), current.width, 1))))
+ {
+ this.selectCellForEvent(current.cell, me.getEvent());
+ handler = this.selectionCellsHandler.getHandler(current.cell);
+
+ if (handler != null && handler.customHandles != null)
+ {
+ // Swimlane start size handle is last custom handle
+ var handle = mxEvent.CUSTOM_HANDLE - handler.customHandles.length + 1;
+ handler.start(me.getGraphX(), me.getGraphY(), handle);
+ me.consume();
+ }
+ }
+ }
+
+ current = this.view.getState(this.model.getParent(current.cell));
+ }
+ }
+ }
+ }
+ }
+ }));
+
+ // Uses this event to process mouseDown to check the selection state before it is changed
+ this.addListener(mxEvent.CONSUME_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
+ {
+ if (evt.getProperty('eventName') == 'mouseDown' && this.isEnabled())
+ {
+ var me = evt.getProperty('event');
+ var state = me.getState();
+
+ if (!mxEvent.isAltDown(me.getEvent()) && !mxEvent.isControlDown(evt) &&
+ !mxEvent.isShiftDown(evt) && !initialSelected &&
+ state != null && this.model.isEdge(state.cell))
+ {
+ start.point = new mxPoint(me.getGraphX(), me.getGraphY());
+ start.selected = this.isCellSelected(state.cell);
+ start.state = state;
+ start.event = me;
+
+ if (state.text != null && state.text.boundingBox != null &&
+ mxUtils.contains(state.text.boundingBox, me.getGraphX(), me.getGraphY()))
+ {
+ start.handle = mxEvent.LABEL_HANDLE;
+ }
+ else
+ {
+ var handler = this.selectionCellsHandler.getHandler(state.cell);
+
+ if (handler != null && handler.bends != null && handler.bends.length > 0)
+ {
+ start.handle = handler.getHandleForEvent(me);
+ }
+ }
+ }
+ }
+ }));
+
+ this.addMouseListener(
+ {
+ mouseDown: function(sender, me) {},
+ mouseMove: mxUtils.bind(this, function(sender, me)
+ {
+ // Checks if any other handler is active
+ var handlerMap = this.selectionCellsHandler.handlers.map;
+
+ for (var key in handlerMap)
+ {
+ if (handlerMap[key].index != null)
+ {
+ return;
+ }
+ }
+
+ if (this.isEnabled() && !this.panningHandler.isActive() && !mxEvent.isAltDown(me.getEvent()))
+ {
+ var tol = this.tolerance;
+
+ if (start.point != null && start.state != null && start.event != null)
+ {
+ var state = start.state;
+
+ if (start.handle != null || Math.abs(start.point.x - me.getGraphX()) > tol ||
+ Math.abs(start.point.y - me.getGraphY()) > tol)
+ {
+ var handler = null;
+
+ if (!mxEvent.isControlDown(me.getEvent()) &&
+ !mxEvent.isShiftDown(me.getEvent()))
+ {
+ handler = this.selectionCellsHandler.getHandler(state.cell);
+ }
+
+ if (handler != null && handler.bends != null && handler.bends.length > 0)
+ {
+ handler.redrawHandles();
+ var handle = (start.handle != null) ? start.handle :
+ handler.getHandleForEvent(start.event);
+ var edgeStyle = this.view.getEdgeStyle(state);
+ var entity = edgeStyle == mxEdgeStyle.EntityRelation;
+
+ // Handles special case where label was clicked on unselected edge in which
+ // case the label will be moved regardless of the handle that is returned
+ if (!start.selected && start.handle == mxEvent.LABEL_HANDLE)
+ {
+ handle = start.handle;
+ }
+
+ if (!entity || handle == 0 || handle == handler.bends.length - 1 || handle == mxEvent.LABEL_HANDLE)
+ {
+ // Source or target handle or connected for direct handle access or orthogonal line
+ // with just two points where the central handle is moved regardless of mouse position
+ if (handle == mxEvent.LABEL_HANDLE || handle == 0 || state.visibleSourceState != null ||
+ handle == handler.bends.length - 1 || state.visibleTargetState != null)
+ {
+ if (!entity && handle != mxEvent.LABEL_HANDLE)
+ {
+ var pts = state.absolutePoints;
+
+ // Default case where handles are at corner points handles
+ // drag of corner as drag of existing point
+ if (pts != null && ((edgeStyle == null && handle == null) ||
+ edgeStyle == mxEdgeStyle.SegmentConnector ||
+ edgeStyle == mxEdgeStyle.OrthConnector))
+ {
+ // Does not use handles if they were not initially visible
+ handle = start.handle;
+
+ if (handle == null)
+ {
+ var box = new mxRectangle(start.point.x, start.point.y);
+ box.grow(mxEdgeHandler.prototype.handleImage.width / 2);
+
+ if (mxUtils.contains(box, pts[0].x, pts[0].y))
+ {
+ // Moves source terminal handle
+ handle = 0;
+ }
+ else if (mxUtils.contains(box, pts[pts.length - 1].x, pts[pts.length - 1].y))
+ {
+ // Moves target terminal handle
+ handle = handler.bends.length - 1;
+ }
+ else
+ {
+ // Checks if edge has no bends
+ var nobends = edgeStyle != null && (pts.length == 2 || (pts.length == 3 &&
+ ((Math.round(pts[0].x - pts[1].x) == 0 && Math.round(pts[1].x - pts[2].x) == 0) ||
+ (Math.round(pts[0].y - pts[1].y) == 0 && Math.round(pts[1].y - pts[2].y) == 0))));
+
+ if (nobends)
+ {
+ // Moves central handle for straight orthogonal edges
+ handle = 2;
+ }
+ else
+ {
+ // Finds and moves vertical or horizontal segment
+ handle = mxUtils.findNearestSegment(state, start.point.x, start.point.y);
+
+ // Converts segment to virtual handle index
+ if (edgeStyle == null)
+ {
+ handle = mxEvent.VIRTUAL_HANDLE - handle;
+ }
+ // Maps segment to handle
+ else
+ {
+ handle += 1;
+ }
+ }
+ }
+ }
+ }
+
+ // Creates a new waypoint and starts moving it
+ if (handle == null)
+ {
+ handle = mxEvent.VIRTUAL_HANDLE;
+ }
+ }
+
+ handler.start(me.getGraphX(), me.getGraphX(), handle);
+ me.consume();
+
+ // Removes preview rectangle in graph handler
+ this.graphHandler.reset();
+ }
+ }
+ else if (entity && (state.visibleSourceState != null || state.visibleTargetState != null))
+ {
+ // Disables moves on entity to make it consistent
+ this.graphHandler.reset();
+ me.consume();
+ }
+ }
+
+ if (handler != null)
+ {
+ // Lazy selection for edges inside groups
+ if (this.selectionCellsHandler.isHandlerActive(handler))
+ {
+ if (!this.isCellSelected(state.cell))
+ {
+ this.selectionCellsHandler.handlers.put(state.cell, handler);
+ this.selectCellForEvent(state.cell, me.getEvent());
+ }
+ }
+ else if (!this.isCellSelected(state.cell))
+ {
+ // Destroy temporary handler
+ handler.destroy();
+ }
+ }
+
+ // Reset start state
+ start.selected = false;
+ start.handle = null;
+ start.state = null;
+ start.event = null;
+ start.point = null;
+ }
+ }
+ else
+ {
+ // Updates cursor for unselected edges under the mouse
+ var state = me.getState();
+
+ if (state != null && this.isCellEditable(state.cell))
+ {
+ var cursor = null;
+
+ // Checks if state was removed in call to stopEditing above
+ if (this.model.isEdge(state.cell) &&
+ !this.isCellSelected(state.cell) &&
+ !mxEvent.isAltDown(me.getEvent()) &&
+ !mxEvent.isControlDown(me.getEvent()) &&
+ !mxEvent.isShiftDown(me.getEvent()))
+ {
+ var box = new mxRectangle(me.getGraphX(), me.getGraphY());
+ box.grow(mxEdgeHandler.prototype.handleImage.width / 2);
+ var pts = state.absolutePoints;
+
+ if (pts != null)
+ {
+ if (state.text != null && state.text.boundingBox != null &&
+ mxUtils.contains(state.text.boundingBox, me.getGraphX(), me.getGraphY()))
+ {
+ cursor = 'move';
+ }
+ else if (mxUtils.contains(box, pts[0].x, pts[0].y) ||
+ mxUtils.contains(box, pts[pts.length - 1].x, pts[pts.length - 1].y))
+ {
+ cursor = 'pointer';
+ }
+ else if (state.visibleSourceState != null || state.visibleTargetState != null)
+ {
+ // Moving is not allowed for entity relation but still indicate hover state
+ var tmp = this.view.getEdgeStyle(state);
+ cursor = 'crosshair';
+
+ if (tmp != mxEdgeStyle.EntityRelation && this.isOrthogonal(state))
+ {
+ var idx = mxUtils.findNearestSegment(state, me.getGraphX(), me.getGraphY());
+
+ if (idx < pts.length - 1 && idx >= 0)
+ {
+ cursor = (Math.round(pts[idx].x - pts[idx + 1].x) == 0) ?
+ 'col-resize' : 'row-resize';
+ }
+ }
+ }
+ }
+ }
+ else if (!mxEvent.isControlDown(me.getEvent()))
+ {
+ var tol = mxShape.prototype.svgStrokeTolerance / 2;
+ var box = new mxRectangle(me.getGraphX(), me.getGraphY());
+ box.grow(tol);
+
+ if (this.isTableCell(state.cell) && this.isCellMovable(state.cell))
+ {
+ var row = this.model.getParent(state.cell);
+ var table = this.model.getParent(row);
+
+ if (!this.isCellSelected(table))
+ {
+ if ((mxUtils.intersects(box, new mxRectangle(state.x, state.y - 2, state.width, 4)) &&
+ this.model.getChildAt(table, 0) != row) || mxUtils.intersects(box,
+ new mxRectangle(state.x, state.y + state.height - 2, state.width, 4)))
+ {
+ cursor ='row-resize';
+ }
+ else if ((mxUtils.intersects(box, new mxRectangle(state.x - 2, state.y, 4, state.height)) &&
+ this.model.getChildAt(row, 0) != state.cell) || mxUtils.intersects(box,
+ new mxRectangle(state.x + state.width - 2, state.y, 4, state.height)))
+ {
+ cursor ='col-resize';
+ }
+ }
+ }
+
+ // Hover for swimlane start sizes inside tables
+ var current = state;
+
+ while (cursor == null && current != null && (this.isTableCell(current.cell) ||
+ this.isTableRow(current.cell) || this.isTable(current.cell)))
+ {
+ if (this.isSwimlane(current.cell) && this.isCellMovable(current.cell))
+ {
+ var offset = this.getActualStartSize(current.cell);
+ var s = this.view.scale;
+
+ if ((offset.x > 0 || offset.width > 0) && mxUtils.intersects(box, new mxRectangle(
+ current.x + (offset.x - offset.width - 1) * s + ((offset.x == 0) ? current.width * s : 0),
+ current.y, 1, current.height)))
+ {
+ cursor ='col-resize';
+ }
+ else if ((offset.y > 0 || offset.height > 0) && mxUtils.intersects(box, new mxRectangle(
+ current.x, current.y + (offset.y - offset.height - 1) * s + ((offset.y == 0) ? current.height : 0),
+ current.width, 1)))
+ {
+ cursor ='row-resize';
+ }
+ }
+
+ current = this.view.getState(this.model.getParent(current.cell));
+ }
+ }
+
+ if (cursor != null)
+ {
+ state.setCursor(cursor);
+ }
+ }
+ }
+ }
+ }),
+ mouseUp: mxUtils.bind(this, function(sender, me)
+ {
+ start.state = null;
+ start.event = null;
+ start.point = null;
+ start.handle = null;
+ })
+ });
+ }
+
+ this.cellRenderer.minSvgStrokeWidth = 0.1;
+
+ // HTML entities are displayed as plain text in wrapped plain text labels
+ this.cellRenderer.getLabelValue = function(state)
+ {
+ var result = mxCellRenderer.prototype.getLabelValue.apply(this, arguments);
+
+ if (state.view.graph.isHtmlLabel(state.cell))
+ {
+ if (state.style['html'] != 1)
+ {
+ result = mxUtils.htmlEntities(result, false);
+ }
+ else
+ {
+ // Skips sanitizeHtml for unchanged labels
+ if (state.lastLabelValue != result)
+ {
+ state.lastLabelValue = result;
+ state.lastSanitizedLabelValue = Graph.sanitizeHtml(result);
+ }
+
+ result = state.lastSanitizedLabelValue;
+ }
+ }
+
+ return result;
+ };
+
+ // All code below not available and not needed in embed mode
+ if (typeof mxVertexHandler !== 'undefined')
+ {
+ this.setConnectable(true);
+ this.setDropEnabled(true);
+ this.setPanning(true);
+ this.setTooltips(true);
+ this.setAllowLoops(true);
+ this.allowAutoPanning = true;
+ this.resetEdgesOnConnect = false;
+ this.constrainChildren = false;
+ this.constrainRelativeChildren = true;
+
+ // Do not scroll after moving cells
+ this.graphHandler.scrollOnMove = false;
+ this.graphHandler.scaleGrid = true;
+
+ // Disables cloning of connection sources by default
+ this.connectionHandler.setCreateTarget(false);
+ this.connectionHandler.insertBeforeSource = true;
+
+ // Disables built-in connection starts
+ this.connectionHandler.isValidSource = function(cell, me)
+ {
+ return false;
+ };
+
+ // Sets the style to be used when an elbow edge is double clicked
+ this.alternateEdgeStyle = 'vertical';
+
+ if (stylesheet == null)
+ {
+ this.loadStylesheet();
+ }
+
+ // Adds page centers to the guides for moving cells
+ var graphHandlerGetGuideStates = this.graphHandler.getGuideStates;
+ this.graphHandler.getGuideStates = function()
+ {
+ var result = graphHandlerGetGuideStates.apply(this, arguments);
+
+ // Create virtual cell state for page centers
+ if (this.graph.pageVisible)
+ {
+ var guides = [];
+
+ var pf = this.graph.pageFormat;
+ var ps = this.graph.pageScale;
+ var pw = pf.width * ps;
+ var ph = pf.height * ps;
+ var t = this.graph.view.translate;
+ var s = this.graph.view.scale;
+
+ var layout = this.graph.getPageLayout();
+
+ for (var i = 0; i < layout.width; i++)
+ {
+ guides.push(new mxRectangle(((layout.x + i) * pw + t.x) * s,
+ (layout.y * ph + t.y) * s, pw * s, ph * s));
+ }
+
+ for (var j = 1; j < layout.height; j++)
+ {
+ guides.push(new mxRectangle((layout.x * pw + t.x) * s,
+ ((layout.y + j) * ph + t.y) * s, pw * s, ph * s));
+ }
+
+ // Page center guides have precedence over normal guides
+ result = guides.concat(result);
+ }
+
+ return result;
+ };
+
+ // Overrides zIndex for dragElement
+ mxDragSource.prototype.dragElementZIndex = mxPopupMenu.prototype.zIndex;
+
+ // Overrides color for virtual guides for page centers
+ mxGuide.prototype.getGuideColor = function(state, horizontal)
+ {
+ return (state.cell == null) ? '#ffa500' /* orange */ : mxConstants.GUIDE_COLOR;
+ };
+
+ // Changes color of move preview for black backgrounds
+ this.graphHandler.createPreviewShape = function(bounds)
+ {
+ this.previewColor = (this.graph.background == '#000000') ? '#ffffff' : mxGraphHandler.prototype.previewColor;
+
+ return mxGraphHandler.prototype.createPreviewShape.apply(this, arguments);
+ };
+
+ // Handles parts of cells by checking if part=1 is in the style and returning the parent
+ // if the parent is not already in the list of cells. container style is used to disable
+ // step into swimlanes and dropTarget style is used to disable acting as a drop target.
+ // LATER: Handle recursive parts
+ var graphHandlerGetCells = this.graphHandler.getCells;
+
+ this.graphHandler.getCells = function(initialCell)
+ {
+ var cells = graphHandlerGetCells.apply(this, arguments);
+ var lookup = new mxDictionary();
+ var newCells = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ // Propagates to composite parents or moves selected table rows
+ var cell = (this.graph.isTableCell(initialCell) &&
+ this.graph.isTableCell(cells[i]) &&
+ this.graph.isCellSelected(cells[i])) ?
+ this.graph.model.getParent(cells[i]) :
+ ((this.graph.isTableRow(initialCell) &&
+ this.graph.isTableRow(cells[i]) &&
+ this.graph.isCellSelected(cells[i])) ?
+ cells[i] : this.graph.getCompositeParent(cells[i]));
+
+ if (cell != null && !lookup.get(cell))
+ {
+ lookup.put(cell, true);
+ newCells.push(cell);
+ }
+ }
+
+ return newCells;
+ };
+
+ // Handles parts and selected rows in tables of cells for drag and drop
+ var graphHandlerStart = this.graphHandler.start;
+
+ this.graphHandler.start = function(cell, x, y, cells)
+ {
+ // Propagates to selected table row to start move
+ var ignoreParent = false;
+
+ if (this.graph.isTableCell(cell))
+ {
+ if (!this.graph.isCellSelected(cell))
+ {
+ cell = this.graph.model.getParent(cell);
+ }
+ else
+ {
+ ignoreParent = true;
+ }
+ }
+
+ if (!ignoreParent && (!this.graph.isTableRow(cell) || !this.graph.isCellSelected(cell)))
+ {
+ cell = this.graph.getCompositeParent(cell);
+ }
+
+ graphHandlerStart.apply(this, arguments);
+ };
+
+ // Handles parts of cells when cloning the source for new connections
+ this.connectionHandler.createTargetVertex = function(evt, source)
+ {
+ source = this.graph.getCompositeParent(source);
+
+ return mxConnectionHandler.prototype.createTargetVertex.apply(this, arguments);
+ };
+
+ // Applies newEdgeStyle
+ this.connectionHandler.insertEdge = function(parent, id, value, source, target, style)
+ {
+ var edge = mxConnectionHandler.prototype.insertEdge.apply(this, arguments);
+
+ if (source != null)
+ {
+ this.graph.applyNewEdgeStyle(source, [edge]);
+ }
+
+ return edge
+ };
+
+ // Creates rubberband selection and associates with graph instance
+ var rubberband = new mxRubberband(this);
+
+ this.getRubberband = function()
+ {
+ return rubberband;
+ };
+
+ // Timer-based activation of outline connect in connection handler
+ var startTime = new Date().getTime();
+ var timeOnTarget = 0;
+
+ var connectionHandlerMouseMove = this.connectionHandler.mouseMove;
+
+ this.connectionHandler.mouseMove = function()
+ {
+ var prev = this.currentState;
+ connectionHandlerMouseMove.apply(this, arguments);
+
+ if (prev != this.currentState)
+ {
+ startTime = new Date().getTime();
+ timeOnTarget = 0;
+ }
+ else
+ {
+ timeOnTarget = new Date().getTime() - startTime;
+ }
+ };
+
+ // Activates outline connect after 1500ms with touch event or if alt is pressed inside the shape
+ // outlineConnect=0 is a custom style that means do not connect to strokes inside the shape,
+ // or in other words, connect to the shape's perimeter if the highlight is under the mouse
+ // (the name is because the highlight, including all strokes, is called outline in the code)
+ var connectionHandleIsOutlineConnectEvent = this.connectionHandler.isOutlineConnectEvent;
+
+ this.connectionHandler.isOutlineConnectEvent = function(me)
+ {
+ if (mxEvent.isShiftDown(me.getEvent()) && mxEvent.isAltDown(me.getEvent()))
+ {
+ return false;
+ }
+ else
+ {
+ return (this.currentState != null && me.getState() == this.currentState && timeOnTarget > 2000) ||
+ ((this.currentState == null || mxUtils.getValue(this.currentState.style, 'outlineConnect', '1') != '0') &&
+ connectionHandleIsOutlineConnectEvent.apply(this, arguments));
+ }
+ };
+
+ // Adds shift+click to toggle selection state
+ var isToggleEvent = this.isToggleEvent;
+ this.isToggleEvent = function(evt)
+ {
+ return isToggleEvent.apply(this, arguments) || (!mxClient.IS_CHROMEOS && mxEvent.isShiftDown(evt));
+ };
+
+ // Workaround for Firefox where first mouse down is received
+ // after tap and hold if scrollbars are visible, which means
+ // start rubberband immediately if no cell is under mouse.
+ var isForceRubberBandEvent = rubberband.isForceRubberbandEvent;
+ rubberband.isForceRubberbandEvent = function(me)
+ {
+ return isForceRubberBandEvent.apply(this, arguments) ||
+ (mxClient.IS_CHROMEOS && mxEvent.isShiftDown(me.getEvent())) ||
+ (mxUtils.hasScrollbars(this.graph.container) && mxClient.IS_FF &&
+ mxClient.IS_WIN && me.getState() == null && mxEvent.isTouchEvent(me.getEvent()));
+ };
+
+ // Shows hand cursor while panning
+ var prevCursor = null;
+
+ this.panningHandler.addListener(mxEvent.PAN_START, mxUtils.bind(this, function()
+ {
+ if (this.isEnabled())
+ {
+ prevCursor = this.container.style.cursor;
+ this.container.style.cursor = 'move';
+ }
+ }));
+
+ this.panningHandler.addListener(mxEvent.PAN_END, mxUtils.bind(this, function()
+ {
+ if (this.isEnabled())
+ {
+ this.container.style.cursor = prevCursor;
+ }
+ }));
+
+ this.popupMenuHandler.autoExpand = true;
+
+ this.popupMenuHandler.isSelectOnPopup = function(me)
+ {
+ return mxEvent.isMouseEvent(me.getEvent());
+ };
+
+ // Handles links in read-only graphs
+ // and cells in locked layers
+ var click = this.click;
+ this.click = function(me)
+ {
+ var locked = me.state == null && me.sourceState != null &&
+ this.isCellLocked(this.getLayerForCell(
+ me.sourceState.cell));
+
+ if ((!this.isEnabled() || locked) && !me.isConsumed())
+ {
+ var cell = (locked) ? me.sourceState.cell : me.getCell();
+
+ if (cell != null)
+ {
+ var link = this.getClickableLinkForCell(cell);
+
+ if (link != null)
+ {
+ if (this.isCustomLink(link))
+ {
+ this.customLinkClicked(link);
+ }
+ else
+ {
+ this.openLink(link);
+ }
+ }
+ }
+ }
+ else
+ {
+ return click.apply(this, arguments);
+ }
+ };
+
+ // Redirects tooltips for locked cells
+ this.tooltipHandler.getStateForEvent = function(me)
+ {
+ return me.sourceState;
+ };
+
+ // Opens links in tooltips in new windows
+ var tooltipHandlerShow = this.tooltipHandler.show;
+ this.tooltipHandler.show = function()
+ {
+ tooltipHandlerShow.apply(this, arguments);
+
+ if (this.div != null)
+ {
+ var links = this.div.getElementsByTagName('a');
+
+ for (var i = 0; i < links.length; i++)
+ {
+ if (links[i].getAttribute('href') != null &&
+ links[i].getAttribute('target') == null)
+ {
+ links[i].setAttribute('target', '_blank');
+ }
+ }
+ }
+ };
+
+ // Redirects tooltips for locked cells
+ this.tooltipHandler.getStateForEvent = function(me)
+ {
+ return me.sourceState;
+ };
+
+ // Redirects cursor for locked cells
+ var getCursorForMouseEvent = this.getCursorForMouseEvent;
+ this.getCursorForMouseEvent = function(me)
+ {
+ var locked = me.state == null && me.sourceState != null && this.isCellLocked(me.sourceState.cell);
+
+ return this.getCursorForCell((locked) ? me.sourceState.cell : me.getCell());
+ };
+
+ // Shows pointer cursor for clickable cells with links
+ // ie. if the graph is disabled and cells cannot be selected
+ var getCursorForCell = this.getCursorForCell;
+ this.getCursorForCell = function(cell)
+ {
+ if (!this.isEnabled() || this.isCellLocked(cell))
+ {
+ var link = this.getClickableLinkForCell(cell);
+
+ if (link != null)
+ {
+ return 'pointer';
+ }
+ else if (this.isCellLocked(cell))
+ {
+ return 'default';
+ }
+ }
+
+ return getCursorForCell.apply(this, arguments);
+ };
+
+ // Changes rubberband selection ignore locked cells
+ this.selectRegion = function(rect, evt)
+ {
+ var isect = (mxEvent.isAltDown(evt)) ? rect : null;
+ var cells = this.getCells(rect.x, rect.y,
+ rect.width, rect.height, null, null,
+ isect, null, true);
+
+ if (this.isToggleEvent(evt))
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ this.selectCellForEvent(cells[i], evt);
+ }
+ }
+ else
+ {
+ this.selectCellsForEvent(cells, evt);
+ }
+
+ return cells;
+ };
+
+ // Never removes cells from parents that are being moved
+ var graphHandlerShouldRemoveCellsFromParent = this.graphHandler.shouldRemoveCellsFromParent;
+ this.graphHandler.shouldRemoveCellsFromParent = function(parent, cells, evt)
+ {
+ if (this.graph.isCellSelected(parent))
+ {
+ return false;
+ }
+
+ return graphHandlerShouldRemoveCellsFromParent.apply(this, arguments);
+ };
+
+ // Enables rubberband selection on cells in locked layers
+ var graphUpdateMouseEvent = this.updateMouseEvent;
+ this.updateMouseEvent = function(me)
+ {
+ me = graphUpdateMouseEvent.apply(this, arguments);
+
+ if (me.state != null && this.isCellLocked(this.getLayerForCell(me.getCell())))
+ {
+ me.state = null;
+ }
+
+ return me;
+ };
+
+ // Cells in locked layers are not selectable
+ var graphIsCellSelectable = this.isCellSelectable;
+ this.isCellSelectable = function(cell)
+ {
+ return graphIsCellSelectable.apply(this, arguments) &&
+ !this.isCellLocked(this.getLayerForCell(cell));
+ };
+
+ // Returns true if the given cell is locked
+ this.isCellLocked = function(cell)
+ {
+ while (cell != null)
+ {
+ if (mxUtils.getValue(this.getCurrentCellStyle(cell), 'locked', '0') == '1')
+ {
+ return true;
+ }
+
+ cell = this.model.getParent(cell);
+ }
+
+ return false;
+ };
+
+ var tapAndHoldSelection = null;
+
+ // Uses this event to process mouseDown to check the selection state before it is changed
+ this.addListener(mxEvent.FIRE_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
+ {
+ if (evt.getProperty('eventName') == 'mouseDown')
+ {
+ var me = evt.getProperty('event');
+ var state = me.getState();
+
+ if (state != null && !this.isSelectionEmpty() && !this.isCellSelected(state.cell))
+ {
+ tapAndHoldSelection = this.getSelectionCells();
+ }
+ else
+ {
+ tapAndHoldSelection = null;
+ }
+ }
+ }));
+
+ // Tap and hold on background starts rubberband for multiple selected
+ // cells the cell associated with the event is deselected
+ this.addListener(mxEvent.TAP_AND_HOLD, mxUtils.bind(this, function(sender, evt)
+ {
+ if (!mxEvent.isMultiTouchEvent(evt))
+ {
+ var me = evt.getProperty('event');
+ var cell = evt.getProperty('cell');
+
+ if (cell == null)
+ {
+ var pt = mxUtils.convertPoint(this.container,
+ mxEvent.getClientX(me), mxEvent.getClientY(me));
+ rubberband.start(pt.x, pt.y);
+ }
+ else if (tapAndHoldSelection != null)
+ {
+ this.addSelectionCells(tapAndHoldSelection);
+ }
+ else if (this.getSelectionCount() > 1 && this.isCellSelected(cell))
+ {
+ this.removeSelectionCell(cell);
+ }
+
+ // Blocks further processing of the event
+ tapAndHoldSelection = null;
+ evt.consume();
+ }
+ }));
+
+ // On connect the target is selected and we clone the cell of the preview edge for insert
+ this.connectionHandler.selectCells = function(edge, target)
+ {
+ this.graph.setSelectionCell(target || edge);
+ };
+
+ // Shows connection points only if cell not selected and parent table not handled
+ this.connectionHandler.constraintHandler.isStateIgnored = function(state, source)
+ {
+ var graph = state.view.graph;
+
+ return source && (graph.isCellSelected(state.cell) || (graph.isTableRow(state.cell) &&
+ graph.selectionCellsHandler.isHandled(graph.model.getParent(state.cell))));
+ };
+
+ // Updates constraint handler if the selection changes
+ this.selectionModel.addListener(mxEvent.CHANGE, mxUtils.bind(this, function()
+ {
+ var ch = this.connectionHandler.constraintHandler;
+
+ if (ch.currentFocus != null && ch.isStateIgnored(ch.currentFocus, true))
+ {
+ ch.currentFocus = null;
+ ch.constraints = null;
+ ch.destroyIcons();
+ }
+
+ ch.destroyFocusHighlight();
+ }));
+
+ // Initializes touch interface
+ if (Graph.touchStyle)
+ {
+ this.initTouch();
+ }
+ }
+
+ //Create a unique offset object for each graph instance.
+ this.currentTranslate = new mxPoint(0, 0);
+};
+
+/**
+ * Specifies if the touch UI should be used (cannot detect touch in FF so always on for Windows/Linux)
+ */
+Graph.touchStyle = mxClient.IS_TOUCH || (mxClient.IS_FF && mxClient.IS_WIN) || navigator.maxTouchPoints > 0 ||
+ navigator.msMaxTouchPoints > 0 || window.urlParams == null || urlParams['touch'] == '1';
+
+/**
+ * Shortcut for capability check.
+ */
+Graph.fileSupport = window.File != null && window.FileReader != null && window.FileList != null &&
+ (window.urlParams == null || urlParams['filesupport'] != '0');
+
+/**
+ * Shortcut for capability check.
+ */
+Graph.translateDiagram = urlParams['translate-diagram'] == '1';
+
+/**
+ * Shortcut for capability check.
+ */
+Graph.diagramLanguage = (urlParams['diagram-language'] != null) ? urlParams['diagram-language'] : mxClient.language;
+
+/**
+ * Default size for line jumps.
+ */
+Graph.lineJumpsEnabled = true;
+
+/**
+ * Default size for line jumps.
+ */
+Graph.defaultJumpSize = 6;
+
+/**
+ * Specifies if the mouse wheel is used for zoom without any modifiers.
+ */
+Graph.zoomWheel = false;
+
+/**
+ * Minimum width for table columns.
+ */
+Graph.minTableColumnWidth = 20;
+
+/**
+ * Minimum height for table rows.
+ */
+Graph.minTableRowHeight = 20;
+
+/**
+ * Text for foreign object warning.
+ */
+Graph.foreignObjectWarningText = 'Text is not SVG - cannot display';
+
+/**
+ * Link for foreign object warning.
+ */
+Graph.foreignObjectWarningLink = 'https://www.drawio.com/doc/faq/svg-export-text-problems';
+
+/**
+ *
+ */
+Graph.xmlDeclaration = '';
+
+/**
+ *
+ */
+Graph.svgDoctype = '';
+
+/**
+ *
+ */
+Graph.svgFileComment = ''
+
+/**
+ * Minimum height for table rows.
+ */
+Graph.pasteStyles = ['rounded', 'shadow', 'dashed', 'dashPattern', 'fontFamily', 'fontSource', 'fontSize', 'fontColor', 'fontStyle',
+ 'align', 'verticalAlign', 'strokeColor', 'strokeWidth', 'fillColor', 'gradientColor', 'swimlaneFillColor',
+ 'textOpacity', 'gradientDirection', 'glass', 'labelBackgroundColor', 'labelBorderColor', 'opacity',
+ 'spacing', 'spacingTop', 'spacingLeft', 'spacingBottom', 'spacingRight', 'endFill', 'endArrow',
+ 'endSize', 'targetPerimeterSpacing', 'startFill', 'startArrow', 'startSize', 'sourcePerimeterSpacing',
+ 'arcSize', 'comic', 'sketch', 'fillWeight', 'hachureGap', 'hachureAngle', 'jiggle', 'disableMultiStroke',
+ 'disableMultiStrokeFill', 'fillStyle', 'curveFitting', 'simplification', 'comicStyle'];
+
+/**
+ * Whitelist for known layout names.
+ */
+Graph.layoutNames = ['mxHierarchicalLayout', 'mxCircleLayout', 'mxCompactTreeLayout',
+ 'mxEdgeLabelLayout', 'mxFastOrganicLayout', 'mxParallelEdgeLayout',
+ 'mxPartitionLayout', 'mxRadialTreeLayout', 'mxStackLayout'];
+
+/**
+ * Creates a temporary graph instance for rendering off-screen content.
+ */
+Graph.createOffscreenGraph = function(stylesheet)
+{
+ var graph = new Graph(document.createElement('div'));
+ graph.stylesheet.styles = mxUtils.clone(stylesheet.styles);
+ graph.resetViewOnRootChange = false;
+ graph.setConnectable(false);
+ graph.gridEnabled = false;
+ graph.autoScroll = false;
+ graph.setTooltips(false);
+ graph.setEnabled(false);
+
+ // Container must be in the DOM for correct HTML rendering
+ graph.container.style.visibility = 'hidden';
+ graph.container.style.position = 'absolute';
+ graph.container.style.overflow = 'hidden';
+ graph.container.style.height = '1px';
+ graph.container.style.width = '1px';
+
+ return graph;
+};
+
+/**
+ * Helper function for creating SVG data URI.
+ */
+Graph.createSvgImage = function(w, h, data, coordWidth, coordHeight)
+{
+ var tmp = unescape(encodeURIComponent(Graph.svgDoctype +
+ ''));
+
+ return new mxImage('data:image/svg+xml;base64,' + ((window.btoa) ? btoa(tmp) : Base64.encode(tmp, true)), w, h)
+};
+
+/**
+ * Helper function for creating an SVG node.
+ */
+Graph.createSvgNode = function(x, y, w, h, background)
+{
+ var svgDoc = mxUtils.createXmlDocument();
+ var root = (svgDoc.createElementNS != null) ?
+ svgDoc.createElementNS(mxConstants.NS_SVG, 'svg') :
+ svgDoc.createElement('svg');
+
+ if (background != null)
+ {
+ if (root.style != null)
+ {
+ root.style.backgroundColor = background;
+ }
+ else
+ {
+ root.setAttribute('style', 'background-color:' + background);
+ }
+ }
+
+ if (svgDoc.createElementNS == null)
+ {
+ root.setAttribute('xmlns', mxConstants.NS_SVG);
+ root.setAttribute('xmlns:xlink', mxConstants.NS_XLINK);
+ }
+ else
+ {
+ // KNOWN: Ignored in IE9-11, adds namespace for each image element instead. No workaround.
+ root.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns:xlink', mxConstants.NS_XLINK);
+ }
+
+ root.setAttribute('version', '1.1');
+ root.setAttribute('width', w + 'px');
+ root.setAttribute('height', h + 'px');
+ root.setAttribute('viewBox', x + ' ' + y + ' ' + w + ' ' + h);
+ svgDoc.appendChild(root);
+
+ return root;
+};
+
+/**
+ * Helper function for creating an SVG node.
+ */
+Graph.htmlToPng = function(html, w, h, fn)
+{
+ var canvas = document.createElement('canvas');
+ canvas.width = w;
+ canvas.height = h;
+
+ var img = document.createElement('img');
+ img.onload = mxUtils.bind(this, function()
+ {
+ var ctx = canvas.getContext('2d');
+ ctx.drawImage(img, 0, 0)
+
+ fn(canvas.toDataURL());
+ });
+
+ img.src = 'data:image/svg+xml,' + encodeURIComponent('');
+};
+
+/**
+ * Removes all illegal control characters with ASCII code <32 except TAB, LF
+ * and CR.
+ */
+Graph.zapGremlins = function(text)
+{
+ var lastIndex = 0;
+ var checked = [];
+
+ for (var i = 0; i < text.length; i++)
+ {
+ var code = text.charCodeAt(i);
+
+ // Removes all control chars except TAB, LF and CR
+ if (!((code >= 32 || code == 9 || code == 10 || code == 13) &&
+ code != 0xFFFF && code != 0xFFFE))
+ {
+ checked.push(text.substring(lastIndex, i));
+ lastIndex = i + 1;
+ }
+ }
+
+ if (lastIndex > 0 && lastIndex < text.length)
+ {
+ checked.push(text.substring(lastIndex));
+ }
+
+ return (checked.length == 0) ? text : checked.join('');
+};
+
+/**
+ * Turns the given string into an array.
+ */
+Graph.stringToBytes = function(str)
+{
+ var arr = new Array(str.length);
+
+ for (var i = 0; i < str.length; i++)
+ {
+ arr[i] = str.charCodeAt(i);
+ }
+
+ return arr;
+};
+
+/**
+ * Turns the given array into a string.
+ */
+Graph.bytesToString = function(arr)
+{
+ var result = new Array(arr.length);
+
+ for (var i = 0; i < arr.length; i++)
+ {
+ result[i] = String.fromCharCode(arr[i]);
+ }
+
+ return result.join('');
+};
+
+/**
+ * Turns the given array into a string.
+ */
+Graph.base64EncodeUnicode = function(str)
+{
+ return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
+ return String.fromCharCode(parseInt(p1, 16))
+ }));
+};
+
+/**
+ * Turns the given array into a string.
+ */
+Graph.base64DecodeUnicode = function(str)
+{
+ return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
+ return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
+ }).join(''));
+};
+
+/**
+ * Returns a base64 encoded version of the compressed outer XML of the given node.
+ */
+Graph.compressNode = function(node, checked)
+{
+ var xml = mxUtils.getXml(node);
+
+ return Graph.compress((checked) ? xml : Graph.zapGremlins(xml));
+};
+
+/**
+ * Returns a string for the given array buffer.
+ */
+Graph.arrayBufferToString = function(buffer)
+{
+ var binary = '';
+ var bytes = new Uint8Array(buffer);
+ var len = bytes.byteLength;
+
+ for (var i = 0; i < len; i++)
+ {
+ binary += String.fromCharCode(bytes[i]);
+ }
+
+ return binary;
+};
+
+/**
+ * Returns an array buffer for the given string.
+ */
+Graph.stringToArrayBuffer = function(data)
+{
+ return Uint8Array.from(data, function (c)
+ {
+ return c.charCodeAt(0);
+ });
+};
+
+/**
+ * Returns index of a string in an array buffer (UInt8Array)
+ */
+Graph.arrayBufferIndexOfString = function (uint8Array, str, start)
+{
+ var c0 = str.charCodeAt(0), j = 1, p = -1;
+
+ //Index of first char
+ for (var i = start || 0; i < uint8Array.byteLength; i++)
+ {
+ if (uint8Array[i] == c0)
+ {
+ p = i;
+ break;
+ }
+ }
+
+ for (var i = p + 1; p > -1 && i < uint8Array.byteLength && i < p + str.length - 1; i++)
+ {
+ if (uint8Array[i] != str.charCodeAt(j))
+ {
+ return Graph.arrayBufferIndexOfString(uint8Array, str, p + 1);
+ }
+
+ j++;
+ }
+
+ return j == str.length - 1? p : -1;
+};
+
+/**
+ * Returns a base64 encoded version of the compressed string.
+ */
+Graph.compress = function(data, deflate)
+{
+ if (data == null || data.length == 0 || typeof(pako) === 'undefined')
+ {
+ return data;
+ }
+ else
+ {
+ var tmp = (deflate) ? pako.deflate(encodeURIComponent(data)) :
+ pako.deflateRaw(encodeURIComponent(data));
+
+ return btoa(Graph.arrayBufferToString(new Uint8Array(tmp)));
+ }
+};
+
+/**
+ * Returns a decompressed version of the base64 encoded string.
+ */
+Graph.decompress = function(data, inflate, checked)
+{
+ if (data == null || data.length == 0 || typeof(pako) === 'undefined')
+ {
+ return data;
+ }
+ else
+ {
+ var tmp = Graph.stringToArrayBuffer(atob(data));
+ var inflated = decodeURIComponent((inflate) ?
+ pako.inflate(tmp, {to: 'string'}) :
+ pako.inflateRaw(tmp, {to: 'string'}));
+
+ return (checked) ? inflated : Graph.zapGremlins(inflated);
+ }
+};
+
+/**
+ * Fades the given nodes in or out.
+ */
+Graph.fadeNodes = function(nodes, start, end, done, delay)
+{
+ delay = (delay != null) ? delay : 1000;
+ Graph.setTransitionForNodes(nodes, null);
+ Graph.setOpacityForNodes(nodes, start);
+
+ window.setTimeout(function()
+ {
+ Graph.setTransitionForNodes(nodes,
+ 'all ' + delay + 'ms ease-in-out');
+ Graph.setOpacityForNodes(nodes, end);
+
+ window.setTimeout(function()
+ {
+ Graph.setTransitionForNodes(nodes, null);
+
+ if (done != null)
+ {
+ done();
+ }
+ }, delay);
+ }, 0);
+};
+
+/**
+ * Removes the elements from the map where the given function returns true.
+ */
+Graph.removeKeys = function(map, ignoreFn)
+{
+ for (var key in map)
+ {
+ if (ignoreFn(key))
+ {
+ delete map[key];
+ }
+ }
+};
+
+/**
+ * Sets the transition for the given nodes.
+ */
+Graph.setTransitionForNodes = function(nodes, transition)
+{
+ for (var i = 0; i < nodes.length; i++)
+ {
+ mxUtils.setPrefixedStyle(nodes[i].style, 'transition', transition);
+ }
+};
+
+/**
+ * Sets the opacity for the given nodes.
+ */
+Graph.setOpacityForNodes = function(nodes, opacity)
+{
+ for (var i = 0; i < nodes.length; i++)
+ {
+ nodes[i].style.opacity = opacity;
+ }
+};
+
+/**
+ * Removes formatting from pasted HTML.
+ */
+Graph.removePasteFormatting = function(elt, ignoreTabs)
+{
+ while (elt != null)
+ {
+ if (elt.firstChild != null)
+ {
+ Graph.removePasteFormatting(elt.firstChild, true);
+ }
+
+ var next = elt.nextSibling;
+
+ if (elt.nodeType == mxConstants.NODETYPE_ELEMENT && elt.style != null)
+ {
+ elt.style.whiteSpace = '';
+
+ if (elt.style.color == '#000000')
+ {
+ elt.style.color = '';
+ }
+
+ // Replaces tabs from macOS TextEdit
+ if (elt.nodeName == 'SPAN' && elt.className == 'Apple-tab-span')
+ {
+ var temp = Graph.createTabNode(4);
+ elt.parentNode.replaceChild(temp, elt);
+ elt = temp;
+ }
+
+ // Replaces paragraphs from macOS TextEdit
+ if (elt.nodeName == 'P' && elt.className == 'p1')
+ {
+ while (elt.firstChild != null)
+ {
+ elt.parentNode.insertBefore(elt.firstChild, elt);
+ }
+
+ if (next != null && next.nodeName == 'P' &&
+ next.className == 'p1')
+ {
+ elt.parentNode.insertBefore(elt.ownerDocument.
+ createElement('br'), elt);
+ }
+
+ elt.parentNode.removeChild(elt);
+ }
+
+ // Replaces tabs
+ if (!ignoreTabs && elt.innerHTML != null)
+ {
+ var tabNode = Graph.createTabNode(4);
+ elt.innerHTML = elt.innerHTML.replace(/\t/g,
+ tabNode.outerHTML);
+ }
+ }
+
+ elt = next;
+ }
+};
+
+/**
+ * Removes formatting from pasted HTML.
+ */
+Graph.createTabNode = function(spaces)
+{
+ var str = '\t';
+
+ if (spaces != null)
+ {
+ str = '';
+
+ while (spaces > 0)
+ {
+ str += '\xa0';
+ spaces--;
+ }
+ }
+
+ // LATER: Fix normalized tab after editing plain text labels
+ var tabNode = document.createElement('span');
+ tabNode.style.whiteSpace = 'pre';
+ tabNode.appendChild(document.createTextNode(str));
+
+ return tabNode;
+};
+
+/**
+ * Sanitizes the given HTML markup, allowing target attributes and
+ * data: protocol links to pages and custom actions.
+ */
+Graph.sanitizeHtml = function(value, editing)
+{
+ return Graph.domPurify(value, false);
+};
+
+/**
+ * Returns the size of the page format scaled with the page size.
+ */
+ Graph.sanitizeLink = function(href)
+ {
+ if (href == null)
+ {
+ return null;
+ }
+ else
+ {
+ var a = document.createElement('a');
+ a.setAttribute('href', href);
+ Graph.sanitizeNode(a);
+
+ return a.getAttribute('href');
+ }
+ };
+
+/**
+ * Sanitizes the given DOM node in-place.
+ */
+Graph.sanitizeNode = function(value)
+{
+ return Graph.domPurify(value, true);
+};
+
+// Allows use tag in SVG with local references only
+DOMPurify.addHook('afterSanitizeAttributes', function(node)
+{
+ if (node.nodeName == 'use' && ((node.getAttribute('xlink:href') != null &&
+ !node.getAttribute('xlink:href').startsWith('#')) ||
+ (node.getAttribute('href') != null && !node.getAttribute('href').startsWith('#'))))
+ {
+ node.remove();
+ }
+});
+
+// Workaround for removed content with empty nodes
+DOMPurify.addHook('uponSanitizeAttribute', function (node, evt)
+{
+ if (node.nodeName == 'svg' && evt.attrName == 'content')
+ {
+ evt.forceKeepAttr = true;
+ }
+
+ return node;
+});
+
+/**
+ * Sanitizes the given value.
+ */
+Graph.domPurify = function(value, inPlace)
+{
+ window.DOM_PURIFY_CONFIG.IN_PLACE = inPlace;
+
+ return DOMPurify.sanitize(value, window.DOM_PURIFY_CONFIG);
+};
+
+/**
+ * Updates the viewbox, width and height in the given SVG data URI
+ * and returns the updated data URI with all script tags and event
+ * handlers removed.
+ */
+Graph.clipSvgDataUri = function(dataUri, ignorePreserveAspect)
+{
+ // LATER Add workaround for non-default NS declarations with empty URI not allowed in IE11
+ if (!mxClient.IS_IE && !mxClient.IS_IE11 && dataUri != null &&
+ dataUri.substring(0, 26) == 'data:image/svg+xml;base64,')
+ {
+ try
+ {
+ var div = document.createElement('div');
+ div.style.position = 'absolute';
+ div.style.visibility = 'hidden';
+
+ // Adds the text and inserts into DOM for updating of size
+ var data = decodeURIComponent(escape(atob(dataUri.substring(26))));
+ var idx = data.indexOf('= 0)
+ {
+ // Strips leading XML declaration and doctypes
+ div.innerHTML = Graph.sanitizeHtml(data.substring(idx));
+
+ // Gets the size and removes from DOM
+ var svgs = div.getElementsByTagName('svg');
+
+ if (svgs.length > 0)
+ {
+ // Avoids getBBox as it ignores stroke option
+ if (ignorePreserveAspect || svgs[0].getAttribute('preserveAspectRatio') != null)
+ {
+ document.body.appendChild(div);
+
+ try
+ {
+ var fx = 1;
+ var fy = 1;
+ var w = svgs[0].getAttribute('width');
+ var h = svgs[0].getAttribute('height');
+
+ if (w != null && w.charAt(w.length - 1) != '%')
+ {
+ w = parseFloat(w);
+ }
+ else
+ {
+ w = NaN;
+ }
+
+ if (h != null && h.charAt(h.length - 1) != '%')
+ {
+ h = parseFloat(h);
+ }
+ else
+ {
+ h = NaN;
+ }
+
+ var vb = svgs[0].getAttribute('viewBox');
+
+ if (vb != null && !isNaN(w) && !isNaN(h))
+ {
+ var tokens = vb.split(' ');
+
+ if (vb.length >= 4)
+ {
+ fx = parseFloat(tokens[2]) / w;
+ fy = parseFloat(tokens[3]) / h;
+ }
+ }
+
+ var size = svgs[0].getBBox();
+
+ if (size.width > 0 && size.height > 0)
+ {
+ div.getElementsByTagName('svg')[0].setAttribute('viewBox', size.x +
+ ' ' + size.y + ' ' + size.width + ' ' + size.height);
+ div.getElementsByTagName('svg')[0].setAttribute('width', size.width / fx);
+ div.getElementsByTagName('svg')[0].setAttribute('height', size.height / fy);
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+ finally
+ {
+ document.body.removeChild(div);
+ }
+ }
+
+ dataUri = Editor.createSvgDataUri(mxUtils.getXml(svgs[0]));
+ }
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+ }
+
+ return dataUri;
+};
+
+/**
+ * Returns the CSS font family from the given computed style.
+ */
+Graph.stripQuotes = function(text)
+{
+ if (text != null)
+ {
+ if (text.charAt(0) == '\'')
+ {
+ text = text.substring(1);
+ }
+
+ if (text.charAt(text.length - 1) == '\'')
+ {
+ text = text.substring(0, text.length - 1);
+ }
+
+ if (text.charAt(0) == '"')
+ {
+ text = text.substring(1);
+ }
+
+ if (text.charAt(text.length - 1) == '"')
+ {
+ text = text.substring(0, text.length - 1);
+ }
+ }
+
+ return text;
+};
+
+/**
+ * Create remove icon.
+ */
+Graph.createRemoveIcon = function(title, onclick)
+{
+ var removeLink = document.createElement('img');
+ removeLink.setAttribute('src', Dialog.prototype.clearImage);
+ removeLink.setAttribute('title', title);
+ removeLink.setAttribute('width', '13');
+ removeLink.setAttribute('height', '10');
+ removeLink.style.marginLeft = '4px';
+ removeLink.style.marginBottom = '-1px';
+ removeLink.style.cursor = 'pointer';
+
+ mxEvent.addListener(removeLink, 'click', onclick);
+
+ return removeLink;
+};
+
+/**
+ * Returns true if the given string is a page link.
+ */
+Graph.isPageLink = function(text)
+{
+ return text != null && text.substring(0, 13) == 'data:page/id,';
+};
+
+/**
+ * Returns true if the given string is a page link.
+ */
+Graph.rewritePageLinks = function(doc)
+{
+ var links = doc.getElementsByTagName('a');
+
+ function rewriteLink(link, attrib)
+ {
+ var href = link.getAttribute(attrib);
+
+ if (href != null && Graph.isPageLink(href))
+ {
+ link.setAttribute(attrib, '#' + href.substring(href.indexOf(':') + 1));
+ }
+ };
+
+ for (var i = 0; i < links.length; i++)
+ {
+ rewriteLink(links[i], 'href');
+ rewriteLink(links[i], 'xlink:href');
+ }
+};
+
+/**
+ * Returns true if the given string is a link.
+ *
+ * See https://stackoverflow.com/questions/5717093/check-if-a-javascript-string-is-a-url
+ */
+Graph.isLink = function(text)
+{
+ return text != null && Graph.linkPattern.test(text);
+};
+
+/**
+ * Regular expression for links.
+ */
+Graph.linkPattern = new RegExp('^(https?:\\/\\/)?'+ // protocol
+ '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name
+ '((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address
+ '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path
+ '(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string
+ '(\\#[-a-z\\d_]*)?$','i'); // fragment locator
+
+/**
+ * Graph inherits from mxGraph.
+ */
+mxUtils.extend(Graph, mxGraph);
+
+/**
+ * Allows all values in fit.
+ */
+Graph.prototype.minFitScale = null;
+
+/**
+ * Allows all values in fit.
+ */
+Graph.prototype.maxFitScale = null;
+
+/**
+ * Sets the policy for links. Possible values are "self" to replace any framesets,
+ * "blank" to load the URL in and "auto" (default).
+ */
+Graph.prototype.linkPolicy = (urlParams['target'] == 'frame') ? 'blank' : (urlParams['target'] || 'auto');
+
+/**
+ * Target for links that open in a new window. Default is _blank.
+ */
+Graph.prototype.linkTarget = (urlParams['target'] == 'frame') ? '_self' : '_blank';
+
+/**
+ * Value to the rel attribute of links. Default is 'nofollow noopener noreferrer'.
+ * NOTE: There are security implications when this is changed and if noopener is removed,
+ * then must be overridden to allow for the opener to be set by default.
+ */
+Graph.prototype.linkRelation = 'nofollow noopener noreferrer';
+
+/**
+ * Scrollbars setting is overriden in the editor, but not in the viewer.
+ */
+Graph.prototype.defaultScrollbars = true;
+
+/**
+ * Specifies if the page should be visible for new files. Default is true.
+ */
+Graph.prototype.defaultPageVisible = true;
+
+/**
+ * Specifies if the page should be visible for new files. Default is true.
+ */
+Graph.prototype.defaultGridEnabled = urlParams['grid'] != '0';
+
+/**
+ * Specifies if the app should run in chromeless mode. Default is false.
+ * This default is only used if the contructor argument is null.
+ */
+Graph.prototype.lightbox = false;
+
+/**
+ *
+ */
+Graph.prototype.defaultPageBackgroundColor = '#ffffff';
+
+/**
+ *
+ */
+Graph.prototype.diagramBackgroundColor = '#f0f0f0';
+
+/**
+ * Whether to use diagramBackgroundColor for no page views.
+ */
+Graph.prototype.enableDiagramBackground = false;
+
+/**
+ *
+ */
+Graph.prototype.defaultPageBorderColor = '#ffffff';
+
+/**
+ *
+ */
+Graph.prototype.shapeForegroundColor = '#000000';
+
+/**
+ *
+ */
+Graph.prototype.shapeBackgroundColor = '#ffffff';
+
+/**
+ * Specifies the size of the size for "tiles" to be used for a graph with
+ * scrollbars but no visible background page. A good value is large
+ * enough to reduce the number of repaints that is caused for auto-
+ * translation, which depends on this value, and small enough to give
+ * a small empty buffer around the graph. Default is 400x400.
+ */
+Graph.prototype.scrollTileSize = new mxRectangle(0, 0, 400, 400);
+
+/**
+ * Overrides the background color and paints a transparent background.
+ */
+Graph.prototype.transparentBackground = true;
+
+/**
+ * Sets global constants.
+ */
+Graph.prototype.selectParentAfterDelete = false;
+
+/**
+ * Sets the default target for all links in cells.
+ */
+Graph.prototype.defaultEdgeLength = 80;
+
+/**
+ * Enables activation of special handles on unselected cells.
+ */
+Graph.prototype.immediateHandling = true;
+
+/**
+ * Allows all values in fit.
+ */
+Graph.prototype.connectionArrowsEnabled = true;
+
+/**
+ * Specifies the regular expression for matching placeholders.
+ */
+Graph.prototype.placeholderPattern = new RegExp('%(date\{.*\}|[^%^\{^\}^ ^"^ \'^=^;]+)%', 'g');
+
+/**
+ * Specifies the regular expression for matching placeholders.
+ */
+Graph.prototype.absoluteUrlPattern = new RegExp('^(?:[a-z]+:)?//', 'i');
+
+/**
+ * Specifies the default name for the theme. Default is 'default'.
+ */
+Graph.prototype.defaultThemeName = 'default';
+
+/**
+ * Specifies the default name for the theme. Default is 'default'.
+ */
+Graph.prototype.defaultThemes = {};
+
+/**
+ * Base URL for relative links.
+ */
+Graph.prototype.baseUrl = (urlParams['base'] != null) ?
+ decodeURIComponent(urlParams['base']) :
+ (((window != window.top) ? document.referrer :
+ document.location.toString()).split('#')[0]);
+
+/**
+ * Specifies if the label should be edited after an insert.
+ */
+Graph.prototype.editAfterInsert = false;
+
+/**
+ * Defines the built-in properties to be ignored in tooltips.
+ */
+Graph.prototype.builtInProperties = ['label', 'tooltip', 'placeholders', 'placeholder'];
+
+/**
+ * Defines if the graph is part of an EditorUi. If this is false the graph can
+ * be used in an EditorUi instance but will not have a UI added, functions
+ * overridden or event handlers added.
+ */
+Graph.prototype.standalone = false;
+
+/**
+ * Enables move of bends/segments without selecting.
+ */
+Graph.prototype.enableFlowAnimation = false;
+
+/**
+ * Background color for inactive tabs.
+ */
+Graph.prototype.roundableShapes = ['label', 'rectangle', 'internalStorage', 'corner',
+ 'parallelogram', 'swimlane', 'triangle', 'trapezoid', 'ext', 'step', 'tee', 'process',
+ 'link', 'rhombus', 'offPageConnector', 'loopLimit', 'hexagon', 'manualInput', 'card',
+ 'curlyBracket', 'singleArrow', 'callout', 'doubleArrow', 'flexArrow', 'umlLifeline'];
+
+/**
+ * Installs child layout styles.
+ */
+Graph.prototype.init = function(container)
+{
+ mxGraph.prototype.init.apply(this, arguments);
+
+ // Intercepts links with no target attribute and opens in new window
+ this.cellRenderer.initializeLabel = function(state, shape)
+ {
+ mxCellRenderer.prototype.initializeLabel.apply(this, arguments);
+
+ // Checks tolerance for clicks on links
+ var tol = state.view.graph.tolerance;
+ var handleClick = true;
+ var first = null;
+
+ var down = mxUtils.bind(this, function(evt)
+ {
+ handleClick = true;
+ first = new mxPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ });
+
+ var move = mxUtils.bind(this, function(evt)
+ {
+ handleClick = handleClick && first != null &&
+ Math.abs(first.x - mxEvent.getClientX(evt)) < tol &&
+ Math.abs(first.y - mxEvent.getClientY(evt)) < tol;
+ });
+
+ var up = mxUtils.bind(this, function(evt)
+ {
+ if (handleClick)
+ {
+ var elt = mxEvent.getSource(evt)
+
+ while (elt != null && elt != shape.node)
+ {
+ if (elt.nodeName.toLowerCase() == 'a')
+ {
+ state.view.graph.labelLinkClicked(state, elt, evt);
+ break;
+ }
+
+ elt = elt.parentNode;
+ }
+ }
+ });
+
+ mxEvent.addGestureListeners(shape.node, down, move, up);
+ mxEvent.addListener(shape.node, 'click', function(evt)
+ {
+ mxEvent.consume(evt);
+ });
+ };
+
+ // Handles custom links in tooltips
+ if (this.tooltipHandler != null)
+ {
+ var tooltipHandlerInit = this.tooltipHandler.init;
+
+ this.tooltipHandler.init = function()
+ {
+ tooltipHandlerInit.apply(this, arguments);
+
+ if (this.div != null)
+ {
+ mxEvent.addListener(this.div, 'click', mxUtils.bind(this, function(evt)
+ {
+ var source = mxEvent.getSource(evt);
+
+ if (source.nodeName == 'A')
+ {
+ var href = source.getAttribute('href');
+
+ if (href != null && this.graph.isCustomLink(href) &&
+ (mxEvent.isTouchEvent(evt) || !mxEvent.isPopupTrigger(evt)) &&
+ this.graph.customLinkClicked(href))
+ {
+ mxEvent.consume(evt);
+ }
+ }
+ }));
+ }
+ };
+ }
+
+
+ // Adds or updates CSS for flowAnimation style
+ this.addListener(mxEvent.SIZE, mxUtils.bind(this, function(sender, evt)
+ {
+ if (this.container != null && this.flowAnimationStyle)
+ {
+ var id = this.flowAnimationStyle.getAttribute('id');
+ this.flowAnimationStyle.innerHTML = this.getFlowAnimationStyleCss(id);
+ }
+ }));
+
+ this.initLayoutManager();
+};
+
+/**
+ * Implements zoom and offset via CSS transforms. This is currently only used
+ * in read-only as there are fewer issues with the mxCellState not being scaled
+ * and translated.
+ *
+ * KNOWN ISSUES TO FIX:
+ * - Apply CSS transforms to HTML labels in IE11
+ */
+(function()
+{
+ /**
+ * Uses CSS transforms for scale and translate.
+ */
+ Graph.prototype.useCssTransforms = false;
+
+ /**
+ * Contains the scale.
+ */
+ Graph.prototype.currentScale = 1;
+
+ /**
+ * Contains the offset.
+ */
+ Graph.prototype.currentTranslate = new mxPoint(0, 0);
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isFillState = function(state)
+ {
+ return !this.isSpecialColor(state.style[mxConstants.STYLE_FILLCOLOR]) &&
+ mxUtils.getValue(state.style, 'lineShape', null) != '1' &&
+ (this.model.isVertex(state.cell) ||
+ mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'arrow' ||
+ mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'wire' ||
+ mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'filledEdge' ||
+ mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'flexArrow' ||
+ mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'mxgraph.arrows2.wedgeArrow');
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isGradientState = function(state)
+ {
+ return this.isFillState(state) && mxUtils.getValue(state.style,
+ mxConstants.STYLE_SHAPE, null) != 'wire';
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isStrokeState = function(state)
+ {
+ return true;
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isSpecialColor = function(color)
+ {
+ return mxUtils.indexOf([mxConstants.STYLE_STROKECOLOR,
+ mxConstants.STYLE_FILLCOLOR, 'inherit', 'swimlane',
+ 'indicated'], color) >= 0;
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isGlassState = function(state)
+ {
+ var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
+
+ return (shape == 'label' || shape == 'rectangle' || shape == 'internalStorage' ||
+ shape == 'ext' || shape == 'umlLifeline' || shape == 'swimlane' ||
+ shape == 'process');
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isRoundedState = function(state)
+ {
+ return (state.shape != null) ? state.shape.isRoundable() :
+ mxUtils.indexOf(this.roundableShapes, mxUtils.getValue(state.style,
+ mxConstants.STYLE_SHAPE, null)) >= 0;
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isLineJumpState = function(state)
+ {
+ var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
+ var curved = mxUtils.getValue(state.style, mxConstants.STYLE_CURVED, false);
+
+ return !curved && (shape == 'connector' || shape == 'filledEdge' || shape == 'wire');
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isAutoSizeState = function(state)
+ {
+ return mxUtils.getValue(state.style, mxConstants.STYLE_AUTOSIZE, null) == '1';
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isImageState = function(state)
+ {
+ return mxUtils.getValue(state.style, mxConstants.STYLE_IMAGE, null) != null;
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.isShadowState = function(state)
+ {
+ var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
+
+ return (shape != 'image');
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.getVerticesAndEdges = function(vertices, edges)
+ {
+ vertices = (vertices != null) ? vertices : true;
+ edges = (edges != null) ? edges : true;
+ var model = this.model;
+
+ return model.filterDescendants(function(cell)
+ {
+ return (vertices && model.isVertex(cell)) || (edges && model.isEdge(cell));
+ }, model.getRoot());
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.applyNewEdgeStyle = function(source, edges, dir)
+ {
+ var style = this.getCellStyle(source);
+ var temp = style['newEdgeStyle'];
+
+ if (temp != null)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ var styles = JSON.parse(temp);
+
+ for (var key in styles)
+ {
+ this.setCellStyles(key, styles[key], edges);
+
+ // Sets elbow direction
+ if (key == 'edgeStyle' && styles[key] == 'elbowEdgeStyle' && dir != null)
+ {
+ this.setCellStyles('elbow', (dir == mxConstants.DIRECTION_SOUTH ||
+ dir == mxConstants.DIRECTION_NOTH) ? 'vertical' : 'horizontal',
+ edges);
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ }
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.getCommonStyle = function(cells)
+ {
+ var style = {};
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var state = this.view.getState(cells[i]);
+
+ if (state != null)
+ {
+ this.mergeStyle(state.style, style, i == 0);
+ }
+ }
+
+ return style;
+ };
+
+ /**
+ * Returns information about the current selection.
+ */
+ Graph.prototype.mergeStyle = function(style, into, initial)
+ {
+ if (style != null)
+ {
+ var keys = {};
+
+ for (var key in style)
+ {
+ var value = style[key];
+
+ if (value != null)
+ {
+ keys[key] = true;
+
+ if (into[key] == null && initial)
+ {
+ into[key] = value;
+ }
+ else if (into[key] != value)
+ {
+ delete into[key];
+ }
+ }
+ }
+
+ for (var key in into)
+ {
+ if (!keys[key])
+ {
+ delete into[key];
+ }
+ }
+ }
+ };
+
+ /**
+ * Returns the cell for editing the given cell.
+ */
+ Graph.prototype.getStartEditingCell = function(cell, trigger)
+ {
+ // Redirect editing for tables
+ var style = this.getCellStyle(cell);
+ var size = parseInt(mxUtils.getValue(style, mxConstants.STYLE_STARTSIZE, 0));
+
+ if (this.isTable(cell) && (!this.isSwimlane(cell) ||
+ size == 0) && this.getLabel(cell) == '' &&
+ this.model.getChildCount(cell) > 0)
+ {
+ cell = this.model.getChildAt(cell, 0);
+
+ style = this.getCellStyle(cell);
+ size = parseInt(mxUtils.getValue(style, mxConstants.STYLE_STARTSIZE, 0));
+ }
+
+ // Redirect editing for table rows
+ if (this.isTableRow(cell) && (!this.isSwimlane(cell) ||
+ size == 0) && this.getLabel(cell) == '' &&
+ this.model.getChildCount(cell) > 0)
+ {
+ for (var i = 0; i < this.model.getChildCount(cell); i++)
+ {
+ var temp = this.model.getChildAt(cell, i);
+
+ if (this.isCellEditable(temp))
+ {
+ cell = temp;
+ break;
+ }
+ }
+ }
+
+ return cell;
+ };
+
+ /**
+ * Returns the style of the given cell as an object.
+ */
+ Graph.prototype.copyStyle = function(cell)
+ {
+ return this.getCellStyle(cell, false);
+ };
+
+ /**
+ * Returns true if fast zoom preview should be used.
+ */
+ Graph.prototype.pasteStyle = function(style, cells, keys)
+ {
+ keys = (keys != null) ? keys : Graph.pasteStyles;
+
+ Graph.removeKeys(style, function(key)
+ {
+ return mxUtils.indexOf(keys, key) < 0;
+ });
+
+ this.updateCellStyles(style, cells);
+ };
+
+ /**
+ * Removes implicit styles from cell styles so that dark mode works using the
+ * default values from the stylesheet.
+ */
+ Graph.prototype.updateCellStyles = function(style, cells)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.model.isVertex(cells[i]) || this.model.isEdge(cells[i]))
+ {
+ var cellStyle = this.getCellStyle(cells[i], false);
+ var perimeter = cellStyle[mxConstants.STYLE_PERIMETER];
+ var restorePerimeter = false;
+
+ for (var key in style)
+ {
+ var value = style[key];
+
+ if (cellStyle[key] != value)
+ {
+ // Handles paste of shape to UML lifeline
+ if (key == mxConstants.STYLE_SHAPE &&
+ cellStyle[key] == 'umlLifeline' &&
+ value != 'umlLifeline')
+ {
+ restorePerimeter = true;
+ key = 'participant';
+ }
+
+ this.setCellStyles(key, value, [cells[i]]);
+ }
+ }
+
+ if (restorePerimeter)
+ {
+ this.setCellStyles(mxConstants.STYLE_PERIMETER, perimeter, [cells[i]]);
+ }
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ };
+
+ /**
+ * Returns true if fast zoom preview should be used.
+ */
+ Graph.prototype.isFastZoomEnabled = function()
+ {
+ return urlParams['zoom'] != 'nocss' && !mxClient.NO_FO && !mxClient.IS_EDGE &&
+ !this.useCssTransforms && (this.isCssTransformsSupported() || mxClient.IS_IOS);
+ };
+
+ /**
+ * Only foreignObject supported for now (no IE11). Safari disabled as it ignores
+ * overflow visible on foreignObject in negative space (lightbox and viewer).
+ * Check the following test case on page 1 before enabling this in production:
+ * https://devhost.jgraph.com/git/drawio/etc/embed/sf-math-fo-clipping.html?dev=1
+ */
+ Graph.prototype.isCssTransformsSupported = function()
+ {
+ return this.dialect == mxConstants.DIALECT_SVG && !mxClient.NO_FO &&
+ (!this.lightbox || !mxClient.IS_SF);
+ };
+
+ /**
+ * Function: getCellAt
+ *
+ * Needs to modify original method for recursive call.
+ */
+ Graph.prototype.getCellAt = function(x, y, parent, vertices, edges, ignoreFn)
+ {
+ if (this.useCssTransforms)
+ {
+ x = x / this.currentScale - this.currentTranslate.x;
+ y = y / this.currentScale - this.currentTranslate.y;
+ }
+
+ return this.getScaledCellAt.apply(this, arguments);
+ };
+
+ /**
+ * Function: getScaledCellAt
+ *
+ * Overridden for recursion.
+ */
+ Graph.prototype.getScaledCellAt = function(x, y, parent, vertices, edges, ignoreFn)
+ {
+ vertices = (vertices != null) ? vertices : true;
+ edges = (edges != null) ? edges : true;
+
+ if (parent == null)
+ {
+ parent = this.getCurrentRoot();
+
+ if (parent == null)
+ {
+ parent = this.getModel().getRoot();
+ }
+ }
+
+ if (parent != null)
+ {
+ var childCount = this.model.getChildCount(parent);
+
+ for (var i = childCount - 1; i >= 0; i--)
+ {
+ var cell = this.model.getChildAt(parent, i);
+ var result = this.getScaledCellAt(x, y, cell, vertices, edges, ignoreFn);
+
+ if (result != null)
+ {
+ return result;
+ }
+ else if (this.isCellVisible(cell) && (edges && this.model.isEdge(cell) ||
+ vertices && this.model.isVertex(cell)))
+ {
+ var state = this.view.getState(cell);
+
+ if (state != null && (ignoreFn == null || !ignoreFn(state, x, y)) &&
+ this.intersects(state, x, y))
+ {
+ return cell;
+ }
+ }
+ }
+ }
+
+ return null;
+ };
+
+ /**
+ * Returns if the child cells of the given vertex cell state should be resized.
+ */
+ Graph.prototype.isRecursiveVertexResize = function(state)
+ {
+ return !this.isSwimlane(state.cell) && this.model.getChildCount(state.cell) > 0 &&
+ !this.isCellCollapsed(state.cell) && mxUtils.getValue(state.style, 'recursiveResize', '1') == '1' &&
+ mxUtils.getValue(state.style, 'childLayout', null) == null;
+ }
+
+ /**
+ * Returns the first parent with an absolute or no geometry.
+ */
+ Graph.prototype.getAbsoluteParent = function(cell)
+ {
+ var result = cell;
+ var geo = this.getCellGeometry(result);
+
+ while (geo != null && geo.relative)
+ {
+ result = this.getModel().getParent(result);
+ geo = this.getCellGeometry(result);
+ }
+
+ return result;
+ };
+
+ /**
+ * Returns the first parent that is not a part.
+ */
+ Graph.prototype.isPart = function(cell)
+ {
+ return mxUtils.getValue(this.getCurrentCellStyle(cell), 'part', '0') == '1' ||
+ this.isTableCell(cell) || this.isTableRow(cell);
+ };
+
+ /**
+ * Returns the first parent that is not a part.
+ */
+ Graph.prototype.getCompositeParents = function(cells)
+ {
+ var lookup = new mxDictionary();
+ var newCells = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = this.getCompositeParent(cells[i]);
+
+ if (this.isTableCell(cell))
+ {
+ cell = this.graph.model.getParent(cell);
+ }
+
+ if (this.isTableRow(cell))
+ {
+ cell = this.graph.model.getParent(cell);
+ }
+
+ if (cell != null && !lookup.get(cell))
+ {
+ lookup.put(cell, true);
+ newCells.push(cell);
+ }
+ }
+
+ return newCells;
+ };
+
+ /**
+ * Returns the given terminal that is not relative, an edge or a part.
+ */
+ Graph.prototype.getReferenceTerminal = function(terminal)
+ {
+ if (terminal != null)
+ {
+ var geo = this.getCellGeometry(terminal);
+
+ if (geo != null && geo.relative)
+ {
+ terminal = this.model.getParent(terminal);
+ }
+ }
+
+ if (terminal != null && this.model.isEdge(terminal))
+ {
+ terminal = this.model.getParent(terminal);
+ }
+
+ if (terminal != null)
+ {
+ terminal = this.getCompositeParent(terminal);
+ }
+
+ return terminal;
+ };
+
+ /**
+ * Returns the first parent that is not a part.
+ */
+ Graph.prototype.getCompositeParent = function(cell)
+ {
+ while (this.isPart(cell))
+ {
+ var temp = this.model.getParent(cell);
+
+ if (!this.model.isVertex(temp))
+ {
+ break;
+ }
+
+ cell = temp;
+ }
+
+ return cell;
+ };
+
+ /**
+ * Returns the selection cells where the given function returns false.
+ */
+ Graph.prototype.filterSelectionCells = function(ignoreFn)
+ {
+ var cells = this.getSelectionCells();
+
+ if (ignoreFn != null)
+ {
+ var temp = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (!ignoreFn(cells[i]))
+ {
+ temp.push(cells[i]);
+ }
+ }
+
+ cells = temp;
+ }
+
+ return cells;
+ };
+
+ /**
+ * Overrides scrollRectToVisible to fix ignored transform.
+ */
+ var graphScrollRectToVisible = mxGraph.prototype.scrollRectToVisible;
+ Graph.prototype.scrollRectToVisible = function(r)
+ {
+ if (this.useCssTransforms)
+ {
+ var s = this.currentScale;
+ var t = this.currentTranslate;
+ r = new mxRectangle((r.x + 2 * t.x) * s - t.x,
+ (r.y + 2 * t.y) * s - t.y,
+ r.width * s, r.height * s);
+ }
+
+ graphScrollRectToVisible.apply(this, arguments);
+ };
+
+ /**
+ * Function: repaint
+ *
+ * Updates the highlight after a change of the model or view.
+ */
+ mxCellHighlight.prototype.getStrokeWidth = function(state)
+ {
+ var s = this.strokeWidth;
+
+ if (this.graph.useCssTransforms)
+ {
+ s /= this.graph.currentScale;
+ }
+
+ return s;
+ };
+
+ /**
+ * Function: getGraphBounds
+ *
+ * Overrides getGraphBounds to use bounding box from SVG.
+ */
+ mxGraphView.prototype.getGraphBounds = function()
+ {
+ var b = this.graphBounds;
+
+ if (this.graph.useCssTransforms)
+ {
+ var t = this.graph.currentTranslate;
+ var s = this.graph.currentScale;
+
+ b = new mxRectangle(
+ (b.x + t.x) * s, (b.y + t.y) * s,
+ b.width * s, b.height * s);
+ }
+
+ return b;
+ };
+
+ /**
+ * Overrides to bypass full cell tree validation.
+ * TODO: Check if this improves performance
+ */
+ mxGraphView.prototype.viewStateChanged = function()
+ {
+ if (this.graph.useCssTransforms)
+ {
+ this.validate();
+ this.graph.sizeDidChange();
+ }
+ else
+ {
+ this.revalidate();
+ this.graph.sizeDidChange();
+ }
+ };
+
+ /**
+ * Overrides validate to normalize validation view state and pass
+ * current state to CSS transform.
+ */
+ var graphViewValidate = mxGraphView.prototype.validate;
+ mxGraphView.prototype.validate = function(cell)
+ {
+ if (this.graph.useCssTransforms)
+ {
+ this.graph.currentScale = this.scale;
+ this.graph.currentTranslate.x = this.translate.x;
+ this.graph.currentTranslate.y = this.translate.y;
+
+ this.scale = 1;
+ this.translate.x = 0;
+ this.translate.y = 0;
+ }
+
+ graphViewValidate.apply(this, arguments);
+
+ if (this.graph.useCssTransforms)
+ {
+ this.graph.updateCssTransform();
+
+ this.scale = this.graph.currentScale;
+ this.translate.x = this.graph.currentTranslate.x;
+ this.translate.y = this.graph.currentTranslate.y;
+ }
+ };
+
+ /**
+ * Overrides function to exclude table cells and rows from groups.
+ */
+ var graphGetCellsForGroup = mxGraph.prototype.getCellsForGroup;
+ Graph.prototype.getCellsForGroup = function(cells)
+ {
+ cells = graphGetCellsForGroup.apply(this, arguments);
+ var result = [];
+
+ // Filters selection cells with the same parent
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (!this.isTableRow(cells[i]) &&
+ !this.isTableCell(cells[i]))
+ {
+ result.push(cells[i]);
+ }
+ }
+
+ return result;
+ };
+
+ /**
+ * Overrides function to exclude tables, rows and cells from ungrouping.
+ */
+ var graphGetCellsForUngroup = mxGraph.prototype.getCellsForUngroup;
+ Graph.prototype.getCellsForUngroup = function(cells)
+ {
+ cells = graphGetCellsForUngroup.apply(this, arguments);
+ var result = [];
+
+ // Filters selection cells with the same parent
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (!this.isTable(cells[i]) &&
+ !this.isTableRow(cells[i]) &&
+ !this.isTableCell(cells[i]))
+ {
+ result.push(cells[i]);
+ }
+ }
+
+ return result;
+ };
+
+ /**
+ * Function: updateCssTransform
+ *
+ * Zooms out of the graph by .
+ */
+ Graph.prototype.updateCssTransform = function()
+ {
+ var temp = this.view.getDrawPane();
+
+ if (temp != null)
+ {
+ var g = temp.parentNode;
+
+ if (!this.useCssTransforms)
+ {
+ g.removeAttribute('transformOrigin');
+ g.removeAttribute('transform');
+ }
+ else
+ {
+ var prev = g.getAttribute('transform');
+ g.setAttribute('transformOrigin', '0 0');
+ var s = Math.round(this.currentScale * 100) / 100;
+ var dx = Math.round(this.currentTranslate.x * 100) / 100;
+ var dy = Math.round(this.currentTranslate.y * 100) / 100;
+ g.setAttribute('transform', 'scale(' + s + ',' + s + ')' +
+ 'translate(' + dx + ',' + dy + ')');
+
+ // Applies workarounds only if translate has changed
+ if (prev != g.getAttribute('transform'))
+ {
+ this.fireEvent(new mxEventObject('cssTransformChanged'),
+ 'transform', g.getAttribute('transform'));
+ }
+ }
+ }
+ };
+
+ var graphViewValidateBackgroundPage = mxGraphView.prototype.validateBackgroundPage;
+ mxGraphView.prototype.validateBackgroundPage = function()
+ {
+ var useCssTranforms = this.graph.useCssTransforms, scale = this.scale,
+ translate = this.translate;
+
+ if (useCssTranforms)
+ {
+ this.scale = this.graph.currentScale;
+ this.translate = this.graph.currentTranslate;
+ }
+
+ graphViewValidateBackgroundPage.apply(this, arguments);
+
+ if (useCssTranforms)
+ {
+ this.scale = scale;
+ this.translate = translate;
+ }
+ };
+
+ var graphUpdatePageBreaks = mxGraph.prototype.updatePageBreaks;
+ mxGraph.prototype.updatePageBreaks = function(visible, width, height)
+ {
+ var useCssTranforms = this.useCssTransforms, scale = this.view.scale,
+ translate = this.view.translate;
+
+ if (useCssTranforms)
+ {
+ this.view.scale = 1;
+ this.view.translate = new mxPoint(0, 0);
+ this.useCssTransforms = false;
+ }
+
+ graphUpdatePageBreaks.apply(this, arguments);
+
+ if (useCssTranforms)
+ {
+ this.view.scale = scale;
+ this.view.translate = translate;
+ this.useCssTransforms = true;
+ }
+ };
+})();
+
+/**
+ * Sets the XML node for the current diagram.
+ */
+Graph.prototype.isLightboxView = function()
+{
+ return this.lightbox;
+};
+
+/**
+ * Sets the XML node for the current diagram.
+ */
+Graph.prototype.isViewer = function()
+{
+ return false;
+};
+
+/**
+ * Installs automatic layout via styles
+ */
+Graph.prototype.labelLinkClicked = function(state, elt, evt)
+{
+ var href = elt.getAttribute('href');
+
+ // Blocks and removes unsafe links in labels
+ if (href != Graph.sanitizeLink(href))
+ {
+ Graph.sanitizeNode(elt);
+ }
+
+ if (href != null && !this.isCustomLink(href) && ((mxEvent.isLeftMouseButton(evt) &&
+ !mxEvent.isPopupTrigger(evt)) || mxEvent.isTouchEvent(evt)))
+ {
+ if (!this.isEnabled() || this.isCellLocked(state.cell))
+ {
+ var target = this.isBlankLink(href) ? this.linkTarget : '_top';
+ this.openLink(this.getAbsoluteUrl(href), target);
+ }
+
+ mxEvent.consume(evt);
+ }
+};
+
+/**
+ * Returns the size of the page format scaled with the page size.
+ */
+Graph.prototype.openLink = function(href, target, allowOpener)
+{
+ var result = window;
+
+ try
+ {
+ href = Graph.sanitizeLink(href);
+
+ if (href != null)
+ {
+ // Workaround for blocking in same iframe
+ if (target == '_self' && window != window.top)
+ {
+ window.location.href = href;
+ }
+ else
+ {
+ // Avoids page reload for anchors (workaround for IE but used everywhere)
+ if (href.substring(0, this.baseUrl.length) == this.baseUrl &&
+ href.charAt(this.baseUrl.length) == '#' &&
+ target == '_top' && window == window.top)
+ {
+ var hash = href.split('#')[1];
+
+ // Forces navigation if on same hash
+ if (window.location.hash == '#' + hash)
+ {
+ window.location.hash = '';
+ }
+
+ window.location.hash = hash;
+ }
+ else
+ {
+ result = window.open(href, (target != null) ?
+ target : '_blank', (!allowOpener) ?
+ 'noopener,noreferrer' : null);
+
+ if (result != null && !allowOpener)
+ {
+ result.opener = null;
+ }
+ }
+ }
+ }
+ }
+ catch (e)
+ {
+ // ignores permission denied
+ }
+
+ return result;
+};
+
+/**
+ * Adds support for page links.
+ */
+Graph.prototype.getLinkTitle = function(href)
+{
+ return href.substring(href.lastIndexOf('/') + 1);
+};
+
+/**
+ * Adds support for page links.
+ */
+Graph.prototype.isCustomLink = function(href)
+{
+ return href.substring(0, 5) == 'data:';
+};
+
+/**
+ * Adds support for page links.
+ */
+Graph.prototype.customLinkClicked = function(link)
+{
+ return false;
+};
+
+/**
+ * Returns true if the given href references an external protocol that
+ * should never open in a new window. Default returns true for mailto.
+ */
+Graph.prototype.isExternalProtocol = function(href)
+{
+ return href.substring(0, 7) === 'mailto:';
+};
+
+/**
+ * Hook for links to open in same window. Default returns true for anchors,
+ * links to same domain or if target == 'self' in the config.
+ */
+Graph.prototype.isBlankLink = function(href)
+{
+ return !this.isExternalProtocol(href) &&
+ (this.linkPolicy === 'blank' ||
+ (this.linkPolicy !== 'self' &&
+ !this.isRelativeUrl(href) &&
+ href.substring(0, this.domainUrl.length) !== this.domainUrl));
+};
+
+/**
+ *
+ */
+Graph.prototype.isRelativeUrl = function(url)
+{
+ return url != null && !this.absoluteUrlPattern.test(url) &&
+ url.substring(0, 5) !== 'data:' &&
+ !this.isExternalProtocol(url);
+};
+
+/**
+ *
+ */
+Graph.prototype.getAbsoluteUrl = function(url)
+{
+ if (url != null && this.isRelativeUrl(url))
+ {
+ if (url.charAt(0) == '#')
+ {
+ url = this.baseUrl + url;
+ }
+ else if (url.charAt(0) == '/')
+ {
+ url = this.domainUrl + url;
+ }
+ else
+ {
+ url = this.domainPathUrl + url;
+ }
+ }
+
+ return url;
+};
+
+/**
+ * Installs automatic layout via styles
+ */
+Graph.prototype.initLayoutManager = function()
+{
+ this.layoutManager = new mxLayoutManager(this);
+
+ this.layoutManager.hasLayout = function(cell)
+ {
+ return this.graph.getCellStyle(cell)['childLayout'] != null;
+ };
+
+ this.layoutManager.getLayout = function(cell, eventName)
+ {
+ var parent = this.graph.model.getParent(cell);
+
+ // Executes layouts from top to bottom except for nested layouts where
+ // child layouts are executed before and after the parent layout runs
+ // in case the layout changes the size of the child cell
+ if (!this.graph.isCellCollapsed(cell) && (eventName != mxEvent.BEGIN_UPDATE ||
+ this.hasLayout(parent, eventName)))
+ {
+ var style = this.graph.getCellStyle(cell);
+
+ if (style['childLayout'] == 'stackLayout')
+ {
+ var stackLayout = new mxStackLayout(this.graph, true);
+ stackLayout.resizeParentMax = mxUtils.getValue(style, 'resizeParentMax', '1') == '1';
+ stackLayout.horizontal = mxUtils.getValue(style, 'horizontalStack', '1') == '1';
+ stackLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
+ stackLayout.resizeLast = mxUtils.getValue(style, 'resizeLast', '0') == '1';
+ stackLayout.spacing = style['stackSpacing'] || stackLayout.spacing;
+ stackLayout.border = style['stackBorder'] || stackLayout.border;
+ stackLayout.marginLeft = style['marginLeft'] || 0;
+ stackLayout.marginRight = style['marginRight'] || 0;
+ stackLayout.marginTop = style['marginTop'] || 0;
+ stackLayout.marginBottom = style['marginBottom'] || 0;
+ stackLayout.allowGaps = style['allowGaps'] || 0;
+ stackLayout.fill = true;
+
+ if (stackLayout.allowGaps)
+ {
+ stackLayout.gridSize = parseFloat(mxUtils.getValue(style, 'stackUnitSize', 20));
+ }
+
+ return stackLayout;
+ }
+ else if (style['childLayout'] == 'treeLayout')
+ {
+ var treeLayout = new mxCompactTreeLayout(this.graph);
+ treeLayout.horizontal = mxUtils.getValue(style, 'horizontalTree', '1') == '1';
+ treeLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
+ treeLayout.groupPadding = mxUtils.getValue(style, 'parentPadding', 20);
+ treeLayout.levelDistance = mxUtils.getValue(style, 'treeLevelDistance', 30);
+ treeLayout.maintainParentLocation = true;
+ treeLayout.edgeRouting = false;
+ treeLayout.resetEdges = false;
+
+ return treeLayout;
+ }
+ else if (style['childLayout'] == 'flowLayout')
+ {
+ var flowLayout = new mxHierarchicalLayout(this.graph, mxUtils.getValue(style,
+ 'flowOrientation', mxConstants.DIRECTION_EAST));
+ flowLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
+ flowLayout.parentBorder = mxUtils.getValue(style, 'parentPadding', 20);
+ flowLayout.maintainParentLocation = true;
+
+ // Special undocumented styles for changing the hierarchical
+ flowLayout.intraCellSpacing = mxUtils.getValue(style, 'intraCellSpacing',
+ mxHierarchicalLayout.prototype.intraCellSpacing);
+ flowLayout.interRankCellSpacing = mxUtils.getValue(style, 'interRankCellSpacing',
+ mxHierarchicalLayout.prototype.interRankCellSpacing);
+ flowLayout.interHierarchySpacing = mxUtils.getValue(style, 'interHierarchySpacing',
+ mxHierarchicalLayout.prototype.interHierarchySpacing);
+ flowLayout.parallelEdgeSpacing = mxUtils.getValue(style, 'parallelEdgeSpacing',
+ mxHierarchicalLayout.prototype.parallelEdgeSpacing);
+
+ return flowLayout;
+ }
+ else if (style['childLayout'] == 'circleLayout')
+ {
+ return new mxCircleLayout(this.graph);
+ }
+ else if (style['childLayout'] == 'organicLayout')
+ {
+ return new mxFastOrganicLayout(this.graph);
+ }
+ else if (style['childLayout'] == 'tableLayout')
+ {
+ return new TableLayout(this.graph);
+ }
+ else if (style['childLayout'] != null && style['childLayout'].charAt(0) == '[')
+ {
+ try
+ {
+ return new mxCompositeLayout(this.graph,
+ this.graph.createLayouts(JSON.parse(
+ style['childLayout'])));
+ }
+ catch (e)
+ {
+ if (window.console != null)
+ {
+ console.error(e);
+ }
+ }
+ }
+ }
+
+ return null;
+ };
+};
+
+/**
+ * Creates an array of graph layouts from the given array of the form [{layout: name, config: obj}, ...]
+ * where name is the layout constructor name and config contains the properties of the layout instance.
+ */
+Graph.prototype.createLayouts = function(list)
+{
+ var layouts = [];
+
+ for (var i = 0; i < list.length; i++)
+ {
+ if (mxUtils.indexOf(Graph.layoutNames, list[i].layout) >= 0)
+ {
+ // Handles special case of branch optimizer in orgchart
+ var layout = (list[i].layout == 'mxOrgChartLayout' && list[i].config != null) ?
+ new window[list[i].layout](this, list[i].config['branchOptimizer']) :
+ new window[list[i].layout](this);
+
+ if (list[i].config != null)
+ {
+ for (var key in list[i].config)
+ {
+ // Ignores branch optimizer in orgchart (handled above)
+ if (list[i].layout != 'mxOrgChartLayout' ||
+ key != 'branchOptimizer')
+ {
+ layout[key] = list[i].config[key];
+ }
+ }
+ }
+
+ layouts.push(layout);
+ }
+ else
+ {
+ throw Error(mxResources.get('invalidCallFnNotFound', [list[i].layout]));
+ }
+ }
+
+ return layouts;
+};
+
+/**
+ * Returns the metadata of the given cells as a JSON object.
+ */
+Graph.prototype.getDataForCells = function(cells)
+{
+ var result = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var attrs = (cells[i].value != null) ? cells[i].value.attributes : null;
+ var row = {};
+ row.id = cells[i].id;
+
+ if (attrs != null)
+ {
+ for (var j = 0; j < attrs.length; j++)
+ {
+ row[attrs[j].nodeName] = attrs[j].nodeValue;
+ }
+ }
+ else
+ {
+ row.label = this.convertValueToString(cells[i]);
+ }
+
+ result.push(row);
+ }
+
+ return result;
+};
+
+/**
+ * Returns the DOM nodes for the given cells.
+ */
+Graph.prototype.getNodesForCells = function(cells)
+{
+ var nodes = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var state = this.view.getState(cells[i]);
+
+ if (state != null)
+ {
+ var shapes = this.cellRenderer.getShapesForState(state);
+
+ for (var j = 0; j < shapes.length; j++)
+ {
+ if (shapes[j] != null && shapes[j].node != null)
+ {
+ nodes.push(shapes[j].node);
+ }
+ }
+
+ // Adds folding icon
+ if (state.control != null && state.control.node != null)
+ {
+ nodes.push(state.control.node);
+ }
+ }
+ }
+
+ return nodes;
+};
+
+/**
+ * Creates animations for the given cells.
+ */
+ Graph.prototype.createWipeAnimations = function(cells, wipeIn)
+ {
+ var animations = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var state = this.view.getState(cells[i]);
+
+ if (state != null && state.shape != null)
+ {
+ // TODO: include descendants
+ if (this.model.isEdge(state.cell) &&
+ state.absolutePoints != null &&
+ state.absolutePoints.length > 1)
+ {
+ animations.push(this.createEdgeWipeAnimation(state, wipeIn));
+ }
+ else if (this.model.isVertex(state.cell) &&
+ state.shape.bounds != null)
+ {
+ animations.push(this.createVertexWipeAnimation(state, wipeIn));
+ }
+ }
+ }
+
+ return animations;
+};
+
+/**
+ * Creates an object to show the given edge cell state.
+ */
+Graph.prototype.createEdgeWipeAnimation = function(state, wipeIn)
+{
+ var pts = state.absolutePoints.slice();
+ var segs = state.segments;
+ var total = state.length;
+ var n = pts.length;
+
+ return {
+ execute: mxUtils.bind(this, function(step, steps)
+ {
+ if (state.shape != null)
+ {
+ var pts2 = [pts[0]];
+ var f = step / steps;
+
+ if (!wipeIn)
+ {
+ f = 1 - f;
+ }
+
+ var dist = total * f;
+
+ for (var i = 1; i < n; i++)
+ {
+ if (dist <= segs[i - 1])
+ {
+ pts2.push(new mxPoint(pts[i - 1].x + (pts[i].x - pts[i - 1].x) * dist / segs[i - 1],
+ pts[i - 1].y + (pts[i].y - pts[i - 1].y) * dist / segs[i - 1]));
+
+ break;
+ }
+ else
+ {
+ dist -= segs[i - 1];
+ pts2.push(pts[i]);
+ }
+ }
+
+ state.shape.points = pts2;
+ state.shape.redraw();
+
+ if (step == 0)
+ {
+ Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), 1);
+ }
+
+ if (state.text != null && state.text.node != null)
+ {
+ state.text.node.style.opacity = f;
+ }
+ }
+ }),
+ stop: mxUtils.bind(this, function()
+ {
+ if (state.shape != null)
+ {
+ state.shape.points = pts;
+ state.shape.redraw();
+
+ if (state.text != null && state.text.node != null)
+ {
+ state.text.node.style.opacity = ''
+ }
+
+ Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), (wipeIn) ? 1 : 0);
+ }
+ })
+ };
+};
+
+ /**
+ * Creates an object to show the given vertex cell state.
+ */
+Graph.prototype.createVertexWipeAnimation = function(state, wipeIn)
+{
+ var bds = new mxRectangle.fromRectangle(state.shape.bounds);
+
+ return {
+ execute: mxUtils.bind(this, function(step, steps)
+ {
+ if (state.shape != null)
+ {
+ var f = step / steps;
+
+ if (!wipeIn)
+ {
+ f = 1 - f;
+ }
+
+ state.shape.bounds = new mxRectangle(bds.x, bds.y, bds.width * f, bds.height);
+ state.shape.redraw();
+
+ if (step == 0)
+ {
+ Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), 1);
+ }
+
+ if (state.text != null && state.text.node != null)
+ {
+ state.text.node.style.opacity = f;
+ }
+ }
+ }),
+ stop: mxUtils.bind(this, function()
+ {
+ if (state.shape != null)
+ {
+ state.shape.bounds = bds;
+ state.shape.redraw();
+
+ if (state.text != null && state.text.node != null)
+ {
+ state.text.node.style.opacity = ''
+ }
+
+ Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), (wipeIn) ? 1 : 0);
+ }
+ })
+ };
+};
+
+/**
+ * Runs the animations for the given cells.
+ */
+ Graph.prototype.executeAnimations = function(animations, done, steps, delay)
+ {
+ steps = (steps != null) ? steps : 30;
+ delay = (delay != null) ? delay : 30;
+ var thread = null;
+ var step = 0;
+
+ var animate = mxUtils.bind(this, function()
+ {
+ if (step == steps || this.stoppingCustomActions)
+ {
+ window.clearInterval(thread);
+
+ for (var i = 0; i < animations.length; i++)
+ {
+ animations[i].stop();
+ }
+
+ if (done != null)
+ {
+ done();
+ }
+ }
+ else
+ {
+ for (var i = 0; i < animations.length; i++)
+ {
+ animations[i].execute(step, steps);
+ }
+ }
+
+ step++;
+ });
+
+ thread = window.setInterval(animate, delay);
+ animate();
+};
+
+/**
+ * Returns the size of the page format scaled with the page size.
+ */
+Graph.prototype.getPageSize = function()
+{
+ return (this.pageVisible) ? new mxRectangle(0, 0, this.pageFormat.width * this.pageScale,
+ this.pageFormat.height * this.pageScale) : this.scrollTileSize;
+};
+
+/**
+ * Returns a rectangle describing the position and count of the
+ * background pages, where x and y are the position of the top,
+ * left page and width and height are the vertical and horizontal
+ * page count.
+ */
+Graph.prototype.getPageLayout = function(bounds, tr, s)
+{
+ bounds = (bounds != null) ? bounds : this.getGraphBounds();
+ tr = (tr != null) ? tr : this.view.translate;
+ s = (s != null) ? s : this.view.scale;
+ var size = this.getPageSize();
+
+ if (bounds.width == 0 || bounds.height == 0)
+ {
+ return new mxRectangle(0, 0, 1, 1);
+ }
+ else
+ {
+ var x0 = Math.floor(Math.ceil(bounds.x / s - tr.x) / size.width);
+ var y0 = Math.floor(Math.ceil(bounds.y / s - tr.y) / size.height);
+ var w0 = Math.ceil((Math.floor((bounds.x + bounds.width) /
+ s) - tr.x) / size.width) - x0;
+ var h0 = Math.ceil((Math.floor((bounds.y + bounds.height) /
+ s) - tr.y) / size.height) - y0;
+
+ return new mxRectangle(x0, y0, w0, h0);
+ }
+};
+
+/**
+ * Returns the default view translation for the given page layout.
+ */
+Graph.prototype.getDefaultTranslate = function(pageLayout)
+{
+ var pad = this.getPagePadding();
+ var size = this.getPageSize();
+
+ return new mxPoint(pad.x - pageLayout.x * size.width,
+ pad.y - pageLayout.y * size.height);
+};
+
+/**
+ * Updates the minimum graph size
+ */
+Graph.prototype.updateMinimumSize = function()
+{
+ var pageLayout = this.getPageLayout();
+ var pad = this.getPagePadding();
+ var size = this.getPageSize();
+
+ var minw = Math.ceil(2 * pad.x + pageLayout.width * size.width);
+ var minh = Math.ceil(2 * pad.y + pageLayout.height * size.height);
+
+ if (this.minimumGraphSize == null ||
+ this.minimumGraphSize.width != minw ||
+ this.minimumGraphSize.height != minh)
+ {
+ this.minimumGraphSize = new mxRectangle(0, 0, minw, minh);
+ }
+};
+
+/**
+ * Sanitizes the given HTML markup.
+ */
+Graph.prototype.sanitizeHtml = function(value, editing)
+{
+ return Graph.sanitizeHtml(value, editing);
+};
+
+/**
+ * Revalidates all cells with placeholders in the current graph model.
+ */
+Graph.prototype.updatePlaceholders = function()
+{
+ var model = this.model;
+ var validate = false;
+
+ for (var key in this.model.cells)
+ {
+ var cell = this.model.cells[key];
+
+ if (this.isReplacePlaceholders(cell))
+ {
+ this.view.invalidate(cell, false, false);
+ validate = true;
+ }
+ }
+
+ if (validate)
+ {
+ this.view.validate();
+ }
+};
+
+/**
+ * Adds support for placeholders in labels.
+ */
+Graph.prototype.isReplacePlaceholders = function(cell)
+{
+ return cell.value != null && typeof(cell.value) == 'object' &&
+ cell.value.getAttribute('placeholders') == '1';
+};
+
+/**
+ * Returns true if the given mouse wheel event should be used for zooming. This
+ * is invoked if no dialogs are showing and returns true with Alt or Control
+ * (or cmd in macOS only) is pressed.
+ */
+Graph.prototype.isZoomWheelEvent = function(evt)
+{
+ return (Graph.zoomWheel && !mxEvent.isShiftDown(evt) && !mxEvent.isMetaDown(evt) &&
+ !mxEvent.isAltDown(evt) && (!mxEvent.isControlDown(evt) || mxClient.IS_MAC)) ||
+ (!Graph.zoomWheel && (mxEvent.isAltDown(evt) || mxEvent.isControlDown(evt)));
+};
+
+/**
+ * Returns true if the given scroll wheel event should be used for scrolling.
+ */
+Graph.prototype.isScrollWheelEvent = function(evt)
+{
+ return !this.isZoomWheelEvent(evt);
+};
+
+/**
+ * Adds Alt+click to select cells behind cells (Shift+Click on Chrome OS).
+ */
+Graph.prototype.isTransparentClickEvent = function(evt)
+{
+ return mxEvent.isAltDown(evt) || (mxClient.IS_CHROMEOS && mxEvent.isShiftDown(evt));
+};
+
+/**
+ * Adds ctrl+shift+connect to disable connections.
+ */
+Graph.prototype.isIgnoreTerminalEvent = function(evt)
+{
+ return mxEvent.isAltDown(evt) && !mxEvent.isShiftDown(evt) &&
+ !mxEvent.isControlDown(evt) && !mxEvent.isMetaDown(evt);
+};
+
+/**
+ * Returns true if the given edge should be ignored.
+ */
+Graph.prototype.isEdgeIgnored = function(cell)
+{
+ var result = false;
+
+ if (cell != null)
+ {
+ var style = this.getCurrentCellStyle(cell);
+
+ result = mxUtils.getValue(style, 'ignoreEdge', '0') == '1';
+ }
+
+ return result;
+};
+
+/**
+ * Adds support for placeholders in labels.
+ */
+Graph.prototype.isSplitTarget = function(target, cells, evt)
+{
+ return !this.model.isEdge(cells[0]) &&
+ !mxEvent.isAltDown(evt) && !mxEvent.isShiftDown(evt) &&
+ mxGraph.prototype.isSplitTarget.apply(this, arguments);
+};
+
+/**
+ * Adds support for placeholders in labels.
+ */
+Graph.prototype.getLabel = function(cell)
+{
+ var result = mxGraph.prototype.getLabel.apply(this, arguments);
+
+ if (result != null && this.isReplacePlaceholders(cell) && cell.getAttribute('placeholder') == null)
+ {
+ result = this.replacePlaceholders(cell, result);
+ }
+
+ return result;
+};
+
+/**
+ * Adds labelMovable style.
+ */
+Graph.prototype.isLabelMovable = function(cell)
+{
+ var style = this.getCurrentCellStyle(cell);
+
+ return !this.isCellLocked(cell) &&
+ ((this.model.isEdge(cell) && this.edgeLabelsMovable) ||
+ (this.model.isVertex(cell) && (this.vertexLabelsMovable ||
+ mxUtils.getValue(style, 'labelMovable', '0') == '1')));
+};
+
+/**
+ * Adds event if grid size is changed.
+ */
+Graph.prototype.setGridSize = function(value)
+{
+ this.gridSize = value;
+ this.fireEvent(new mxEventObject('gridSizeChanged'));
+};
+
+/**
+ * Adds event if default parent is changed.
+ */
+Graph.prototype.setDefaultParent = function(cell)
+{
+ this.defaultParent = cell;
+ this.fireEvent(new mxEventObject('defaultParentChanged'));
+};
+
+/**
+ * Function: getClickableLinkForCell
+ *
+ * Returns the first non-null link for the cell or its ancestors.
+ *
+ * Parameters:
+ *
+ * cell - whose link should be returned.
+ */
+Graph.prototype.getClickableLinkForCell = function(cell)
+{
+ do
+ {
+ var link = this.getLinkForCell(cell);
+
+ if (link != null)
+ {
+ return link;
+ }
+
+ cell = this.model.getParent(cell);
+ } while (cell != null);
+
+ return null;
+};
+
+/**
+ * Private helper method.
+ */
+Graph.prototype.getGlobalVariable = function(name)
+{
+ var val = null;
+
+ if (name == 'date')
+ {
+ val = new Date().toLocaleDateString();
+ }
+ else if (name == 'time')
+ {
+ val = new Date().toLocaleTimeString();
+ }
+ else if (name == 'timestamp')
+ {
+ val = new Date().toLocaleString();
+ }
+ else if (name.substring(0, 5) == 'date{')
+ {
+ var fmt = name.substring(5, name.length - 1);
+ val = this.formatDate(new Date(), fmt);
+ }
+
+ return val;
+};
+
+/**
+ * Formats a date, see http://blog.stevenlevithan.com/archives/date-time-format
+ */
+Graph.prototype.formatDate = function(date, mask, utc)
+{
+ // LATER: Cache regexs
+ if (this.dateFormatCache == null)
+ {
+ this.dateFormatCache = {
+ i18n: {
+ dayNames: [
+ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat",
+ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
+ ],
+ monthNames: [
+ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",
+ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
+ ]
+ },
+
+ masks: {
+ "default": "ddd mmm dd yyyy HH:MM:ss",
+ shortDate: "m/d/yy",
+ mediumDate: "mmm d, yyyy",
+ longDate: "mmmm d, yyyy",
+ fullDate: "dddd, mmmm d, yyyy",
+ shortTime: "h:MM TT",
+ mediumTime: "h:MM:ss TT",
+ longTime: "h:MM:ss TT Z",
+ isoDate: "yyyy-mm-dd",
+ isoTime: "HH:MM:ss",
+ isoDateTime: "yyyy-mm-dd'T'HH:MM:ss",
+ isoUtcDateTime: "UTC:yyyy-mm-dd'T'HH:MM:ss'Z'"
+ }
+ };
+ }
+
+ var dF = this.dateFormatCache;
+ var token = /d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,
+ timezone = /\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,
+ timezoneClip = /[^-+\dA-Z]/g,
+ pad = function (val, len) {
+ val = String(val);
+ len = len || 2;
+ while (val.length < len) val = "0" + val;
+ return val;
+ };
+
+ // You can't provide utc if you skip other args (use the "UTC:" mask prefix)
+ if (arguments.length == 1 && Object.prototype.toString.call(date) == "[object String]" && !/\d/.test(date)) {
+ mask = date;
+ date = undefined;
+ }
+
+ // Passing date through Date applies Date.parse, if necessary
+ date = date ? new Date(date) : new Date;
+ if (isNaN(date)) throw SyntaxError("invalid date");
+
+ mask = String(dF.masks[mask] || mask || dF.masks["default"]);
+
+ // Allow setting the utc argument via the mask
+ if (mask.slice(0, 4) == "UTC:") {
+ mask = mask.slice(4);
+ utc = true;
+ }
+
+ var _ = utc ? "getUTC" : "get",
+ d = date[_ + "Date"](),
+ D = date[_ + "Day"](),
+ m = date[_ + "Month"](),
+ y = date[_ + "FullYear"](),
+ H = date[_ + "Hours"](),
+ M = date[_ + "Minutes"](),
+ s = date[_ + "Seconds"](),
+ L = date[_ + "Milliseconds"](),
+ o = utc ? 0 : date.getTimezoneOffset(),
+ flags = {
+ d: d,
+ dd: pad(d),
+ ddd: dF.i18n.dayNames[D],
+ dddd: dF.i18n.dayNames[D + 7],
+ m: m + 1,
+ mm: pad(m + 1),
+ mmm: dF.i18n.monthNames[m],
+ mmmm: dF.i18n.monthNames[m + 12],
+ yy: String(y).slice(2),
+ yyyy: y,
+ h: H % 12 || 12,
+ hh: pad(H % 12 || 12),
+ H: H,
+ HH: pad(H),
+ M: M,
+ MM: pad(M),
+ s: s,
+ ss: pad(s),
+ l: pad(L, 3),
+ L: pad(L > 99 ? Math.round(L / 10) : L),
+ t: H < 12 ? "a" : "p",
+ tt: H < 12 ? "am" : "pm",
+ T: H < 12 ? "A" : "P",
+ TT: H < 12 ? "AM" : "PM",
+ Z: utc ? "UTC" : (String(date).match(timezone) || [""]).pop().replace(timezoneClip, ""),
+ o: (o > 0 ? "-" : "+") + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4),
+ S: ["th", "st", "nd", "rd"][d % 10 > 3 ? 0 : (d % 100 - d % 10 != 10) * d % 10]
+ };
+
+ return mask.replace(token, function ($0)
+ {
+ return $0 in flags ? flags[$0] : $0.slice(1, $0.length - 1);
+ });
+};
+
+/**
+ *
+ */
+Graph.prototype.getLayerForCell = function(cell)
+{
+ while (cell != null && !this.model.isLayer(cell))
+ {
+ cell = this.model.getParent(cell);
+ }
+
+ return cell;
+};
+
+/**
+ *
+ */
+Graph.prototype.getLayerForCells = function(cells)
+{
+ var result = null;
+
+ if (cells.length > 0)
+ {
+ result = this.getLayerForCell(cells[0]);
+
+ for (var i = 1; i < cells.length; i++)
+ {
+ if (!this.model.isAncestor(result, cells[i]))
+ {
+ result = null;
+ break;
+ }
+ }
+ }
+
+ return result;
+};
+
+/**
+ *
+ */
+Graph.prototype.createLayersDialog = function(onchange, inverted)
+{
+ var div = document.createElement('div');
+ div.style.position = 'absolute';
+
+ var model = this.getModel();
+ var childCount = model.getChildCount(model.root);
+
+ for (var i = 0; i < childCount; i++)
+ {
+ (mxUtils.bind(this, function(layer)
+ {
+ var title = this.convertValueToString(layer) ||
+ (mxResources.get('background') || 'Background');
+
+ var span = document.createElement('div');
+ span.style.overflow = 'hidden';
+ span.style.textOverflow = 'ellipsis';
+ span.style.padding = '2px';
+ span.style.whiteSpace = 'nowrap';
+ span.style.cursor = 'pointer';
+ span.setAttribute('title', mxResources.get(
+ model.isVisible(layer) ?
+ 'hideIt' : 'show', [title]));
+
+ var inp = document.createElement('img');
+ inp.setAttribute('draggable', 'false');
+ inp.setAttribute('align', 'absmiddle');
+ inp.setAttribute('border', '0');
+ inp.style.position = 'relative';
+ inp.style.width = '16px';
+ inp.style.padding = '0px 6px 0 4px';
+
+ if (inverted)
+ {
+ inp.style.filter = 'invert(100%)';
+ inp.style.top = '-2px';
+ }
+
+ span.appendChild(inp);
+
+ mxUtils.write(span, title);
+ div.appendChild(span);
+
+ function update()
+ {
+ if (model.isVisible(layer))
+ {
+ inp.setAttribute('src', Editor.visibleImage);
+ mxUtils.setOpacity(span, 75);
+ }
+ else
+ {
+ inp.setAttribute('src', Editor.hiddenImage);
+ mxUtils.setOpacity(span, 25);
+ }
+ };
+
+ mxEvent.addListener(span, 'click', function()
+ {
+ model.setVisible(layer, !model.isVisible(layer));
+ update();
+
+ if (onchange != null)
+ {
+ onchange(layer);
+ }
+ });
+
+ update();
+ })(model.getChildAt(model.root, i)));
+ }
+
+ return div;
+};
+
+/**
+ * Private helper method.
+ */
+Graph.prototype.replacePlaceholders = function(cell, str, vars, translate)
+{
+ var result = [];
+
+ if (str != null)
+ {
+ var last = 0;
+
+ while (match = this.placeholderPattern.exec(str))
+ {
+ var val = match[0];
+
+ if (val.length > 2 && val != '%label%' && val != '%tooltip%')
+ {
+ var tmp = null;
+
+ if (match.index > last && str.charAt(match.index - 1) == '%')
+ {
+ tmp = val.substring(1);
+ }
+ else
+ {
+ var name = val.substring(1, val.length - 1);
+
+ // Workaround for invalid char for getting attribute in older versions of IE
+ if (name == 'id')
+ {
+ tmp = cell.id;
+ }
+ else if (name.indexOf('{') < 0)
+ {
+ var current = cell;
+
+ while (tmp == null && current != null)
+ {
+ if (current.value != null && typeof(current.value) == 'object')
+ {
+ if (Graph.translateDiagram && Graph.diagramLanguage != null)
+ {
+ tmp = current.getAttribute(name + '_' + Graph.diagramLanguage);
+ }
+
+ if (tmp == null)
+ {
+ tmp = (current.hasAttribute(name)) ? ((current.getAttribute(name) != null) ?
+ current.getAttribute(name) : '') : null;
+ }
+ }
+
+ current = this.model.getParent(current);
+ }
+ }
+
+ if (tmp == null)
+ {
+ tmp = this.getGlobalVariable(name);
+ }
+
+ if (tmp == null && vars != null)
+ {
+ tmp = vars[name];
+ }
+ }
+
+ result.push(str.substring(last, match.index) + ((tmp != null) ? tmp : val));
+ last = match.index + val.length;
+ }
+ }
+
+ result.push(str.substring(last));
+ }
+
+ return result.join('');
+};
+
+/**
+ * Resolves the given cells in the model and selects them.
+ */
+Graph.prototype.restoreSelection = function(cells)
+{
+ if (cells != null && cells.length > 0)
+ {
+ var temp = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var newCell = this.model.getCell(cells[i].id);
+
+ if (newCell != null)
+ {
+ temp.push(newCell);
+ }
+ }
+
+ this.setSelectionCells(temp);
+ }
+ else
+ {
+ this.clearSelection();
+ }
+};
+
+/**
+ * Adds table range selection with Shift+Click.
+ */
+Graph.prototype.selectCellForEvent = function(cell, evt)
+{
+ if (!mxEvent.isShiftDown(evt) || this.isSelectionEmpty() ||
+ !this.selectTableRange(this.getSelectionCell(), cell))
+ {
+ mxGraph.prototype.selectCellForEvent.apply(this, arguments);
+ }
+};
+
+/**
+ * Returns true if
+ */
+Graph.prototype.selectTableRange = function(startCell, endCell)
+{
+ var result = false;
+
+ if (this.isTableCell(startCell) && this.isTableCell(endCell))
+ {
+ var startRow = this.model.getParent(startCell);
+ var table = this.model.getParent(startRow);
+ var endRow = this.model.getParent(endCell);
+
+ if (table == this.model.getParent(endRow))
+ {
+ var startCellIndex = startRow.getIndex(startCell);
+ var startRowIndex = table.getIndex(startRow);
+ var endCellIndex = endRow.getIndex(endCell);
+ var endRowIndex = table.getIndex(endRow);
+
+ var fromRow = Math.min(startRowIndex, endRowIndex);
+ var toRow = Math.max(startRowIndex, endRowIndex);
+ var fromCell = Math.min(startCellIndex, endCellIndex);
+ var toCell = Math.max(startCellIndex, endCellIndex);
+
+ var cells = [];
+
+ for (var row = fromRow; row <= toRow; row++)
+ {
+ var currentRow = this.model.getChildAt(table, row);
+
+ for (var col = fromCell; col <= toCell; col++)
+ {
+ cells.push(this.model.getChildAt(currentRow, col));
+ }
+ }
+
+ if (cells.length > 0 && (cells.length > 1 ||
+ this.getSelectionCount() > 1 ||
+ !this.isCellSelected(cells[0])))
+ {
+ this.setSelectionCells(cells);
+ result = true;
+ }
+ }
+ }
+
+ return result;
+};
+
+/**
+ * Returns the cells for the given table range.
+ */
+Graph.prototype.snapCellsToGrid = function(cells, gridSize)
+{
+ this.getModel().beginUpdate();
+ try
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = cells[i];
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ if (this.getModel().isVertex(cell))
+ {
+ geo.x = Math.round(geo.x / gridSize) * gridSize;
+ geo.y = Math.round(geo.y / gridSize) * gridSize;
+ geo.width = Math.round(geo.width / gridSize) * gridSize;
+ geo.height = Math.round(geo.height / gridSize) * gridSize;
+ }
+ else if (this.getModel().isEdge(cell) && geo.points != null)
+ {
+ for (var j = 0; j < geo.points.length; j++)
+ {
+ geo.points[j].x = Math.round(geo.points[j].x / gridSize) * gridSize;
+ geo.points[j].y = Math.round(geo.points[j].y / gridSize) * gridSize;
+ }
+ }
+
+ this.getModel().setGeometry(cell, geo);
+ }
+ }
+ }
+ finally
+ {
+ this.getModel().endUpdate();
+ }
+};
+
+/**
+ * Creates a drop handler for inserting the given cells.
+ */
+Graph.prototype.removeChildCells = function(cell)
+{
+ this.model.beginUpdate();
+ try
+ {
+ var childCount = this.model.getChildCount(cell);
+
+ for (var j = childCount; j >= 0; j--)
+ {
+ this.model.remove(this.model.getChildAt(cell, j));
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+};
+
+/**
+ * Creates a drop handler for inserting the given cells.
+ */
+Graph.prototype.updateShapes = function(source, targets)
+{
+ this.model.beginUpdate();
+ try
+ {
+ // Replaces target styles and removes composite childs
+ for (var i = 0; i < targets.length; i++)
+ {
+ if ((this.model.isVertex(source) && this.model.isVertex(targets[i])) ||
+ this.model.isEdge(source) && this.model.isEdge(targets[i]))
+ {
+ var style = this.copyStyle(targets[i]);
+ this.model.setStyle(targets[i], this.model.getStyle(source));
+ this.pasteStyle(style, [targets[i]]);
+ }
+
+ if (mxUtils.getValue(this.getCellStyle(targets[i],
+ false), 'composite', '0') == '1')
+ {
+ this.removeChildCells(targets[i]);
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+};
+
+/**
+ * Selects cells for connect vertex return value.
+ */
+Graph.prototype.selectCellsForConnectVertex = function(cells, evt, hoverIcons)
+{
+ // Selects only target vertex if one exists
+ if (cells.length == 2 && this.model.isVertex(cells[1]))
+ {
+ this.setSelectionCell(cells[1]);
+ this.scrollCellToVisible(cells[1]);
+
+ if (hoverIcons != null)
+ {
+ // Adds hover icons for cloned vertex or hides icons
+ if (mxEvent.isTouchEvent(evt))
+ {
+ hoverIcons.update(hoverIcons.getState(this.view.getState(cells[1])));
+ }
+ else
+ {
+ hoverIcons.reset();
+ }
+ }
+ }
+ else
+ {
+ this.setSelectionCells(cells);
+ }
+};
+
+/**
+ * Never connects children in stack layouts or tables.
+ */
+Graph.prototype.isCloneConnectSource = function(source)
+{
+ var layout = null;
+
+ if (this.layoutManager != null)
+ {
+ layout = this.layoutManager.getLayout(this.model.getParent(source));
+ }
+
+ return this.isTableRow(source) || this.isTableCell(source) ||
+ (layout != null && layout.constructor == mxStackLayout);
+};
+
+/**
+ * Inserts the given edge before the given cell.
+ */
+Graph.prototype.insertEdgeBeforeCell = function(edge, cell)
+{
+ var index = null;
+ var tmp = cell;
+
+ while (tmp.parent != null && tmp.geometry != null &&
+ tmp.geometry.relative && tmp.parent != edge.parent)
+ {
+ tmp = this.model.getParent(tmp);
+ }
+
+ if (tmp != null && tmp.parent != null && tmp.parent == edge.parent)
+ {
+ var index = tmp.parent.getIndex(tmp);
+ this.model.add(tmp.parent, edge, index);
+ }
+};
+
+/**
+ * Adds a connection to the given vertex or clones the vertex in special layout
+ * containers without creating a connection.
+ */
+Graph.prototype.connectVertex = function(source, direction, length, evt, forceClone, ignoreCellAt, createTarget, done)
+{
+ ignoreCellAt = (ignoreCellAt) ? ignoreCellAt : false;
+
+ // Ignores relative edge labels
+ if (source.geometry.relative && this.model.isEdge(source.parent))
+ {
+ return [];
+ }
+
+ // Uses parent for relative child cells
+ while (source.geometry.relative && this.model.isVertex(source.parent))
+ {
+ source = source.parent;
+ }
+
+ // Handles clone connect sources
+ var cloneSource = this.isCloneConnectSource(source);
+ var composite = (cloneSource) ? source : this.getCompositeParent(source);
+
+ var pt = (source.geometry.relative && source.parent.geometry != null) ?
+ new mxPoint(source.parent.geometry.width * source.geometry.x,
+ source.parent.geometry.height * source.geometry.y) :
+ new mxPoint(composite.geometry.x, composite.geometry.y);
+
+ if (direction == mxConstants.DIRECTION_NORTH)
+ {
+ pt.x += composite.geometry.width / 2;
+ pt.y -= length ;
+ }
+ else if (direction == mxConstants.DIRECTION_SOUTH)
+ {
+ pt.x += composite.geometry.width / 2;
+ pt.y += composite.geometry.height + length;
+ }
+ else if (direction == mxConstants.DIRECTION_WEST)
+ {
+ pt.x -= length;
+ pt.y += composite.geometry.height / 2;
+ }
+ else
+ {
+ pt.x += composite.geometry.width + length;
+ pt.y += composite.geometry.height / 2;
+ }
+
+ var parentState = this.view.getState(this.model.getParent(source));
+ var s = this.view.scale;
+ var t = this.view.translate;
+ var dx = t.x * s;
+ var dy = t.y * s;
+
+ if (parentState != null && this.model.isVertex(parentState.cell))
+ {
+ dx = parentState.x;
+ dy = parentState.y;
+ }
+
+ // Workaround for relative child cells
+ if (this.model.isVertex(source.parent) && source.geometry.relative)
+ {
+ pt.x += source.parent.geometry.x;
+ pt.y += source.parent.geometry.y;
+ }
+
+ // Checks end point for target cell and container
+ var rect = (!ignoreCellAt) ? new mxRectangle(dx + pt.x * s, dy + pt.y * s).grow(40 * s) : null;
+ var tempCells = (rect != null) ? this.getCells(0, 0, 0, 0, null, null, rect, null, true) : null;
+ var sourceState = this.view.getState(source);
+ var container = null;
+ var target = null;
+
+ if (tempCells != null)
+ {
+ tempCells = tempCells.reverse();
+
+ for (var i = 0; i < tempCells.length; i++)
+ {
+ if (!this.isCellLocked(tempCells[i]) && !this.model.isEdge(tempCells[i]) && tempCells[i] != source)
+ {
+ // Direct parent overrides all possible containers
+ if (!this.model.isAncestor(source, tempCells[i]) && this.isContainer(tempCells[i]) &&
+ (container == null || tempCells[i] == this.model.getParent(source)))
+ {
+ container = tempCells[i];
+ }
+ // Containers are used as target cells but swimlanes are used as parents
+ else if (target == null && this.isCellConnectable(tempCells[i]) &&
+ !this.model.isAncestor(tempCells[i], source) &&
+ !this.isSwimlane(tempCells[i]))
+ {
+ var targetState = this.view.getState(tempCells[i]);
+
+ if (sourceState != null && targetState != null && !mxUtils.intersects(sourceState, targetState))
+ {
+ target = tempCells[i];
+ }
+ }
+ }
+ }
+ }
+
+ var duplicate = (!mxEvent.isShiftDown(evt) || mxEvent.isControlDown(evt)) || forceClone;
+
+ if (duplicate && (urlParams['sketch'] != '1' || forceClone))
+ {
+ if (direction == mxConstants.DIRECTION_NORTH)
+ {
+ pt.y -= source.geometry.height / 2;
+ }
+ else if (direction == mxConstants.DIRECTION_SOUTH)
+ {
+ pt.y += source.geometry.height / 2;
+ }
+ else if (direction == mxConstants.DIRECTION_WEST)
+ {
+ pt.x -= source.geometry.width / 2;
+ }
+ else
+ {
+ pt.x += source.geometry.width / 2;
+ }
+ }
+
+ var result = [];
+ var realTarget = target;
+ target = container;
+
+ var execute = mxUtils.bind(this, function(targetCell)
+ {
+ if (createTarget == null || targetCell != null || (target == null && cloneSource))
+ {
+ this.model.beginUpdate();
+ try
+ {
+ if (realTarget == null && duplicate)
+ {
+ // Handles relative and composite cells
+ var cellToClone = this.getAbsoluteParent((targetCell != null) ? targetCell : source);
+ cellToClone = (cloneSource) ? source : this.getCompositeParent(cellToClone);
+ realTarget = (targetCell != null) ? targetCell : this.duplicateCells([cellToClone], false)[0];
+
+ if (targetCell != null)
+ {
+ this.addCells([realTarget], this.model.getParent(source), null, null, null, true);
+ }
+
+ var geo = this.getCellGeometry(realTarget);
+
+ if (geo != null)
+ {
+ if (targetCell != null && urlParams['sketch'] == '1')
+ {
+ if (direction == mxConstants.DIRECTION_NORTH)
+ {
+ pt.y -= geo.height / 2;
+ }
+ else if (direction == mxConstants.DIRECTION_SOUTH)
+ {
+ pt.y += geo.height / 2;
+ }
+ else if (direction == mxConstants.DIRECTION_WEST)
+ {
+ pt.x -= geo.width / 2;
+ }
+ else
+ {
+ pt.x += geo.width / 2;
+ }
+ }
+
+ geo.x = pt.x - geo.width / 2;
+ geo.y = pt.y - geo.height / 2;
+ }
+
+ if (container != null)
+ {
+ this.addCells([realTarget], container, null, null, null, true);
+ target = null;
+ }
+ else if (duplicate && !cloneSource)
+ {
+ this.addCells([realTarget], this.getDefaultParent(), null, null, null, true);
+ }
+ }
+
+ var edge = ((mxEvent.isControlDown(evt) && mxEvent.isShiftDown(evt) && duplicate) ||
+ (target == null && cloneSource)) ? null : this.insertEdge(this.model.getParent(source),
+ null, '', source, realTarget, this.createCurrentEdgeStyle());
+
+ if (edge != null)
+ {
+ result.push(edge);
+ this.applyNewEdgeStyle(source, [edge], direction);
+
+ if (this.connectionHandler.insertBeforeSource)
+ {
+ this.insertEdgeBeforeCell(edge, source);
+ }
+ }
+
+ // Special case: Click on west icon puts clone before cell
+ if (target == null && realTarget != null && source.parent != null &&
+ cloneSource && direction == mxConstants.DIRECTION_WEST)
+ {
+ var index = source.parent.getIndex(source);
+ this.model.add(source.parent, realTarget, index);
+ }
+
+ if (target == null && realTarget != null)
+ {
+ result.push(realTarget);
+ }
+
+ if (realTarget == null && edge != null)
+ {
+ edge.geometry.setTerminalPoint(pt, false);
+ }
+
+ if (edge != null)
+ {
+ this.fireEvent(new mxEventObject('cellsInserted', 'cells', [edge]));
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ }
+
+ if (done != null)
+ {
+ done(result);
+ }
+ else
+ {
+ return result;
+ }
+ });
+
+ if (createTarget != null && realTarget == null && duplicate &&
+ (target != null || !cloneSource))
+ {
+ createTarget(dx + pt.x * s, dy + pt.y * s, execute);
+ }
+ else
+ {
+ return execute(realTarget);
+ }
+};
+
+/**
+ * Returns all labels in the diagram as a string.
+ */
+Graph.prototype.getIndexableText = function(cells)
+{
+ cells = (cells != null) ? cells : this.model.
+ getDescendants(this.model.root);
+ var tmp = document.createElement('div');
+ var labels = [];
+ var label = '';
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = cells[i];
+
+ if (this.model.isVertex(cell) || this.model.isEdge(cell))
+ {
+ if (this.isHtmlLabel(cell))
+ {
+ tmp.innerHTML = Graph.sanitizeHtml(this.getLabel(cell));
+ label = mxUtils.extractTextWithWhitespace([tmp]);
+ }
+ else
+ {
+ label = this.getLabel(cell);
+ }
+
+ label = mxUtils.trim(label.replace(/[\x00-\x1F\x7F-\x9F]|\s+/g, ' '));
+
+ if (label.length > 0)
+ {
+ labels.push(label);
+ }
+ }
+ }
+
+ return labels.join(' ');
+};
+
+/**
+ * Returns the label for the given cell.
+ */
+Graph.prototype.convertValueToString = function(cell)
+{
+ var value = this.model.getValue(cell);
+
+ if (value != null && typeof(value) == 'object')
+ {
+ var result = null;
+
+ if (this.isReplacePlaceholders(cell) && cell.getAttribute('placeholder') != null)
+ {
+ var name = cell.getAttribute('placeholder');
+ var current = cell;
+
+ while (result == null && current != null)
+ {
+ if (current.value != null && typeof(current.value) == 'object')
+ {
+ result = (current.hasAttribute(name)) ? ((current.getAttribute(name) != null) ?
+ current.getAttribute(name) : '') : null;
+ }
+
+ current = this.model.getParent(current);
+ }
+ }
+ else
+ {
+ var result = null;
+
+ if (Graph.translateDiagram && Graph.diagramLanguage != null)
+ {
+ result = value.getAttribute('label_' + Graph.diagramLanguage);
+ }
+
+ if (result == null)
+ {
+ result = value.getAttribute('label') || '';
+ }
+ }
+
+ return result || '';
+ }
+
+ return mxGraph.prototype.convertValueToString.apply(this, arguments);
+};
+
+/**
+ * Returns the link for the given cell.
+ */
+Graph.prototype.getLinksForState = function(state)
+{
+ if (state != null && state.text != null && state.text.node != null)
+ {
+ return state.text.node.getElementsByTagName('a');
+ }
+
+ return null;
+};
+
+/**
+ * Returns the link for the given cell.
+ */
+Graph.prototype.getLinkForCell = function(cell)
+{
+ if (cell.value != null && typeof(cell.value) == 'object')
+ {
+ var link = cell.value.getAttribute('link');
+
+ // Removes links with leading javascript: protocol
+ // TODO: Check more possible attack vectors
+ if (link != null && link.toLowerCase().substring(0, 11) === 'javascript:')
+ {
+ link = link.substring(11);
+ }
+
+ return link;
+ }
+
+ return null;
+};
+
+/**
+ * Returns the link target for the given cell.
+ */
+Graph.prototype.getLinkTargetForCell = function(cell)
+{
+ if (cell.value != null && typeof(cell.value) == 'object')
+ {
+ return cell.value.getAttribute('linkTarget');
+ }
+
+ return null;
+};
+
+/**
+ * Adds style post processing steps.
+ */
+Graph.prototype.postProcessCellStyle = function(cell, style)
+{
+ return this.updateHorizontalStyle(cell,this.replaceDefaultColors(cell,
+ mxGraph.prototype.postProcessCellStyle.apply(this, arguments)));
+};
+
+/**
+ * Overrides label orientation for collapsed swimlanes inside stack and
+ * for partial rectangles inside tables.
+ */
+Graph.prototype.updateHorizontalStyle = function(cell, style)
+{
+ if (cell != null && style != null && this.layoutManager != null)
+ {
+ var parent = this.model.getParent(cell);
+
+ if (this.model.isVertex(parent) && this.isCellCollapsed(cell))
+ {
+ var layout = this.layoutManager.getLayout(parent);
+
+ if (layout != null && layout.constructor == mxStackLayout)
+ {
+ style[mxConstants.STYLE_HORIZONTAL] = !layout.horizontal;
+ }
+ }
+ }
+
+ return style;
+};
+
+/**
+ * Replaces default colors.
+ */
+Graph.prototype.replaceDefaultColors = function(cell, style)
+{
+ if (style != null)
+ {
+ var bg = mxUtils.hex2rgb(this.shapeBackgroundColor);
+ var fg = mxUtils.hex2rgb(this.shapeForegroundColor);
+
+ this.replaceDefaultColor(style, mxConstants.STYLE_FONTCOLOR, fg, bg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_FILLCOLOR, bg, fg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_GRADIENTCOLOR, fg, bg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_STROKECOLOR, fg, bg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_IMAGE_BORDER, fg, bg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_IMAGE_BACKGROUND, bg, fg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_LABEL_BORDERCOLOR, fg, bg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_SWIMLANE_FILLCOLOR, bg, fg);
+ this.replaceDefaultColor(style, mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, bg, fg);
+ }
+
+ return style;
+};
+
+/**
+ * Replaces the colors for the given key.
+ */
+Graph.prototype.replaceDefaultColor = function(style, key, value, inverseValue)
+{
+ if (style != null && style[key] == 'default' && value != null)
+ {
+ style[key] = this.getDefaultColor(style, key, value, inverseValue);
+ }
+};
+
+/**
+ * Replaces the colors for the given key.
+ */
+Graph.prototype.getDefaultColor = function(style, key, defaultValue, inverseDefaultValue)
+{
+ var temp = 'default' + key.charAt(0).toUpperCase() + key.substring(1);
+
+ if (style[temp] == 'invert')
+ {
+ defaultValue = inverseDefaultValue;
+ }
+
+ return defaultValue;
+};
+
+/**
+ * Disables alternate width persistence for stack layout parents
+ */
+Graph.prototype.updateAlternateBounds = function(cell, geo, willCollapse)
+{
+ if (cell != null && geo != null && this.layoutManager != null && geo.alternateBounds != null)
+ {
+ var layout = this.layoutManager.getLayout(this.model.getParent(cell));
+
+ if (layout != null && layout.constructor == mxStackLayout)
+ {
+ if (layout.horizontal)
+ {
+ geo.alternateBounds.height = 0;
+ }
+ else
+ {
+ geo.alternateBounds.width = 0;
+ }
+ }
+ }
+
+ mxGraph.prototype.updateAlternateBounds.apply(this, arguments);
+};
+
+/**
+ * Adds Shift+collapse/expand and size management for folding inside stack
+ */
+Graph.prototype.isMoveCellsEvent = function(evt, state)
+{
+ return mxEvent.isShiftDown(evt) || mxUtils.getValue(state.style, 'moveCells', '0') == '1';
+};
+
+/**
+ * Adds Shift+collapse/expand and size management for folding inside stack
+ */
+Graph.prototype.foldCells = function(collapse, recurse, cells, checkFoldable, evt)
+{
+ recurse = (recurse != null) ? recurse : false;
+
+ if (cells == null)
+ {
+ cells = this.getFoldableCells(this.getSelectionCells(), collapse);
+ }
+
+ if (cells != null)
+ {
+ this.model.beginUpdate();
+
+ try
+ {
+ mxGraph.prototype.foldCells.apply(this, arguments);
+
+ // Resizes all parent stacks if alt is not pressed
+ if (this.layoutManager != null)
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var state = this.view.getState(cells[i]);
+ var geo = this.getCellGeometry(cells[i]);
+
+ if (state != null && geo != null)
+ {
+ var dx = Math.round(geo.width - state.width / this.view.scale);
+ var dy = Math.round(geo.height - state.height / this.view.scale);
+
+ if (dy != 0 || dx != 0)
+ {
+ var parent = this.model.getParent(cells[i]);
+ var layout = this.layoutManager.getLayout(parent);
+
+ if (layout == null)
+ {
+ // Moves cells to the right and down after collapse/expand
+ if (evt != null && this.isMoveCellsEvent(evt, state))
+ {
+ this.moveSiblings(state, parent, dx, dy);
+ }
+ }
+ else if ((evt == null || !mxEvent.isAltDown(evt)) &&
+ layout.constructor == mxStackLayout && !layout.resizeLast)
+ {
+ this.resizeParentStacks(parent, layout, dx, dy);
+ }
+ }
+ }
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ // Selects cells after folding
+ if (this.isEnabled())
+ {
+ this.setSelectionCells(cells);
+ }
+ }
+};
+
+/**
+ * Overrides label orientation for collapsed swimlanes inside stack.
+ */
+Graph.prototype.moveSiblings = function(state, parent, dx, dy)
+{
+ this.model.beginUpdate();
+ try
+ {
+ var cells = this.getCellsBeyond(state.x, state.y, parent, true, true);
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (cells[i] != state.cell)
+ {
+ var tmp = this.view.getState(cells[i]);
+ var geo = this.getCellGeometry(cells[i]);
+
+ if (tmp != null && geo != null)
+ {
+ geo = geo.clone();
+ geo.translate(Math.round(dx * Math.max(0, Math.min(1, (tmp.x - state.x) / state.width))),
+ Math.round(dy * Math.max(0, Math.min(1, (tmp.y - state.y) / state.height))));
+ this.model.setGeometry(cells[i], geo);
+ }
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+};
+
+/**
+ * Overrides label orientation for collapsed swimlanes inside stack.
+ */
+Graph.prototype.resizeParentStacks = function(parent, layout, dx, dy)
+{
+ if (this.layoutManager != null && layout != null && layout.constructor == mxStackLayout && !layout.resizeLast)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ var dir = layout.horizontal;
+
+ // Bubble resize up for all parent stack layouts with same orientation
+ while (parent != null && layout != null && layout.constructor == mxStackLayout &&
+ layout.horizontal == dir && !layout.resizeLast)
+ {
+ var pgeo = this.getCellGeometry(parent);
+ var pstate = this.view.getState(parent);
+
+ if (pstate != null && pgeo != null)
+ {
+ pgeo = pgeo.clone();
+
+ if (layout.horizontal)
+ {
+ pgeo.width += dx + Math.min(0, pstate.width / this.view.scale - pgeo.width);
+ }
+ else
+ {
+ pgeo.height += dy + Math.min(0, pstate.height / this.view.scale - pgeo.height);
+ }
+
+ this.model.setGeometry(parent, pgeo);
+ }
+
+ parent = this.model.getParent(parent);
+ layout = this.layoutManager.getLayout(parent);
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ }
+};
+
+/**
+ * Disables drill-down for non-swimlanes.
+ */
+Graph.prototype.isContainer = function(cell)
+{
+ var style = this.getCurrentCellStyle(cell);
+
+ if (this.isSwimlane(cell))
+ {
+ return style['container'] != '0';
+ }
+ else
+ {
+ return style['container'] == '1';
+ }
+};
+
+/**
+ * Adds a connectable style.
+ */
+Graph.prototype.isCellConnectable = function(cell)
+{
+ var style = this.getCurrentCellStyle(cell);
+
+ return (style['connectable'] != null) ? style['connectable'] != '0' :
+ mxGraph.prototype.isCellConnectable.apply(this, arguments);
+};
+
+/**
+ * Adds labelMovable style.
+ */
+Graph.prototype.isLabelMovable = function(cell)
+{
+ var style = this.getCurrentCellStyle(cell);
+
+ return (style['movableLabel'] != null) ? style['movableLabel'] != '0' :
+ mxGraph.prototype.isLabelMovable.apply(this, arguments);
+};
+
+/**
+ * Function: selectAll
+ *
+ * Selects all children of the given parent cell or the children of the
+ * default parent if no parent is specified. To select leaf vertices and/or
+ * edges use .
+ *
+ * Parameters:
+ *
+ * parent - Optional whose children should be selected.
+ * Default is .
+ */
+Graph.prototype.selectAll = function(parent)
+{
+ parent = parent || this.getDefaultParent();
+
+ if (!this.isCellLocked(parent))
+ {
+ mxGraph.prototype.selectAll.apply(this, arguments);
+ }
+};
+
+/**
+ * Function: selectCells
+ *
+ * Selects all vertices and/or edges depending on the given boolean
+ * arguments recursively, starting at the given parent or the default
+ * parent if no parent is specified. Use to select all cells.
+ * For vertices, only cells with no children are selected.
+ *
+ * Parameters:
+ *
+ * vertices - Boolean indicating if vertices should be selected.
+ * edges - Boolean indicating if edges should be selected.
+ * parent - Optional that acts as the root of the recursion.
+ * Default is .
+ */
+Graph.prototype.selectCells = function(vertices, edges, parent)
+{
+ parent = parent || this.getDefaultParent();
+
+ if (!this.isCellLocked(parent))
+ {
+ mxGraph.prototype.selectCells.apply(this, arguments);
+ }
+};
+
+/**
+ * Function: getSwimlaneAt
+ *
+ * Returns the bottom-most swimlane that intersects the given point (x, y)
+ * in the cell hierarchy that starts at the given parent.
+ *
+ * Parameters:
+ *
+ * x - X-coordinate of the location to be checked.
+ * y - Y-coordinate of the location to be checked.
+ * parent - that should be used as the root of the recursion.
+ * Default is .
+ */
+Graph.prototype.getSwimlaneAt = function (x, y, parent)
+{
+ var result = mxGraph.prototype.getSwimlaneAt.apply(this, arguments);
+
+ if (this.isCellLocked(result))
+ {
+ result = null;
+ }
+
+ return result;
+};
+
+/**
+ * Disables folding for non-swimlanes.
+ */
+Graph.prototype.isCellFoldable = function(cell)
+{
+ var style = this.getCurrentCellStyle(cell);
+
+ return this.foldingEnabled && mxUtils.getValue(style,
+ mxConstants.STYLE_RESIZABLE, '1') != '0' &&
+ (style['treeFolding'] == '1' ||
+ (!this.isCellLocked(cell) &&
+ ((this.isContainer(cell) && style['collapsible'] != '0') ||
+ (!this.isContainer(cell) && style['collapsible'] == '1'))));
+};
+
+/**
+ * Stops all interactions and clears the selection.
+ */
+Graph.prototype.reset = function()
+{
+ if (this.isEditing())
+ {
+ this.stopEditing(true);
+ }
+
+ this.escape();
+
+ if (!this.isSelectionEmpty())
+ {
+ this.clearSelection();
+ }
+};
+
+/**
+ * Overridden to limit zoom to 1% - 16.000%.
+ */
+Graph.prototype.zoom = function(factor, center)
+{
+ factor = Math.max(0.01, Math.min(this.view.scale * factor, 160)) / this.view.scale;
+
+ mxGraph.prototype.zoom.apply(this, arguments);
+};
+
+/**
+ * Function: zoomIn
+ *
+ * Zooms into the graph by .
+ */
+Graph.prototype.zoomIn = function()
+{
+ // Switches to 1% zoom steps below 15%
+ if (this.view.scale < 0.15)
+ {
+ this.zoom((this.view.scale + 0.01) / this.view.scale);
+ }
+ else
+ {
+ // Uses to 5% zoom steps for better grid rendering in webkit
+ // and to avoid rounding errors for zoom steps
+ this.zoom((Math.round(this.view.scale * this.zoomFactor * 20) / 20) / this.view.scale);
+ }
+};
+
+/**
+ * Function: zoomOut
+ *
+ * Zooms out of the graph by .
+ */
+Graph.prototype.zoomOut = function()
+{
+ // Switches to 1% zoom steps below 15%
+ if (this.view.scale <= 0.15)
+ {
+ this.zoom((this.view.scale - 0.01) / this.view.scale);
+ }
+ else
+ {
+ // Uses to 5% zoom steps for better grid rendering in webkit
+ // and to avoid rounding errors for zoom steps
+ this.zoom((Math.round(this.view.scale * (1 / this.zoomFactor) * 20) / 20) / this.view.scale);
+ }
+};
+
+/**
+ * Function: fitPages
+ *
+ * Fits the given number of pages to the current view horizontally.
+ * If pageCount is null then all pages will be used. This should not
+ * be called if pages are not visible.
+ */
+Graph.prototype.fitPages = function(pageCount, ignoreHeight)
+{
+ var vcount = 1;
+
+ if (pageCount == null)
+ {
+ var layout = this.getPageLayout();
+ pageCount = layout.width;
+ vcount = layout.height;
+ }
+
+ var ps = this.pageScale;
+ var fmt = this.pageFormat;
+ var cw = this.container.clientWidth - 10;
+ var ch = this.container.clientHeight - 10;
+ var sx = cw / (pageCount * fmt.width) / ps;
+
+ var scale = Math.floor(20 * ((ignoreHeight) ? sx :
+ Math.min(sx, ch / (vcount * fmt.height) / ps))) / 20;
+
+ this.zoomTo(scale);
+
+ if (mxUtils.hasScrollbars(this.container))
+ {
+ var pad = this.getPagePadding();
+ this.container.scrollLeft = Math.min(pad.x * this.view.scale,
+ (this.container.scrollWidth - this.container.clientWidth) / 2) - 1;
+
+ if (!ignoreHeight)
+ {
+ if (pageCount >= 2)
+ {
+ this.container.scrollTop = Math.min(pad.y,
+ (this.container.scrollHeight -
+ this.container.clientHeight) / 2);
+ }
+ else
+ {
+ this.container.scrollTop = pad.y * this.view.scale - 1;
+ }
+ }
+ }
+};
+
+/**
+ * Function: fitWindow
+ *
+ * Sets the current visible rectangle of the window in graph coordinates.
+ */
+Graph.prototype.fitWindow = function(bounds, border)
+{
+ border = (border != null) ? border : 10;
+
+ var cw = this.container.clientWidth - border;
+ var ch = this.container.clientHeight - border;
+ var scale = Math.floor(20 * Math.min(cw / bounds.width, ch / bounds.height)) / 20;
+ this.zoomTo(scale);
+
+ if (mxUtils.hasScrollbars(this.container))
+ {
+ var t = this.view.translate;
+ this.container.scrollLeft = (bounds.x + t.x) * this.view.scale -
+ Math.max((cw - bounds.width * this.view.scale) / 2 + border / 2, 0);
+ this.container.scrollTop = (bounds.y + t.y) * this.view.scale -
+ Math.max((ch - bounds.height * this.view.scale) / 2 + border / 2, 0);
+ }
+};
+
+/**
+ * Overrides tooltips to show custom tooltip or metadata.
+ */
+Graph.prototype.convertValueToTooltip = function(cell)
+{
+ var tmp = null;
+
+ if (mxUtils.isNode(cell.value))
+ {
+ if (Graph.translateDiagram && Graph.diagramLanguage != null)
+ {
+ tmp = cell.value.getAttribute('tooltip_' + Graph.diagramLanguage);
+ }
+
+ if (tmp == null)
+ {
+ tmp = cell.value.getAttribute('tooltip');
+ }
+
+ if (tmp != null)
+ {
+ if (tmp != null && this.isReplacePlaceholders(cell))
+ {
+ tmp = this.replacePlaceholders(cell, tmp);
+ }
+
+ tmp = Graph.sanitizeHtml(tmp);
+ }
+ }
+
+ return tmp;
+};
+
+/**
+ * Overrides tooltips to show custom tooltip or metadata.
+ */
+Graph.prototype.getTooltipForCell = function(cell)
+{
+ var tip = '';
+
+ if (mxUtils.isNode(cell.value))
+ {
+ tip = this.convertValueToTooltip(cell);
+
+ if (tip == null)
+ {
+ var ignored = this.builtInProperties;
+ var attrs = cell.value.attributes;
+ var temp = [];
+ tip = '';
+
+ // Hides links in edit mode
+ if (this.isEnabled())
+ {
+ ignored.push('linkTarget');
+ ignored.push('link');
+ }
+
+ for (var i = 0; i < attrs.length; i++)
+ {
+ if (((Graph.translateDiagram && attrs[i].nodeName == 'label') ||
+ mxUtils.indexOf(ignored, attrs[i].nodeName) < 0) &&
+ attrs[i].nodeValue.length > 0)
+ {
+ temp.push({name: attrs[i].nodeName, value: attrs[i].nodeValue});
+ }
+ }
+
+ // Sorts by name
+ temp.sort(function(a, b)
+ {
+ if (a.name < b.name)
+ {
+ return -1;
+ }
+ else if (a.name > b.name)
+ {
+ return 1;
+ }
+ else
+ {
+ return 0;
+ }
+ });
+
+ for (var i = 0; i < temp.length; i++)
+ {
+ if (temp[i].name != 'link' || !this.isCustomLink(temp[i].value))
+ {
+ tip += ((temp[i].name != 'link') ? '' + mxUtils.htmlEntities(temp[i].name) +
+ ': ' : '') + mxUtils.htmlEntities(temp[i].value) + '\n';
+ }
+ }
+
+ if (tip.length > 0)
+ {
+ tip = tip.substring(0, tip.length - 1);
+
+ if (mxClient.IS_SVG)
+ {
+ tip = '' +
+ tip + '
';
+ }
+ }
+ }
+ }
+
+ return tip;
+};
+
+/**
+ * Adds rack child layout style.
+ */
+Graph.prototype.getFlowAnimationStyle = function()
+{
+ var head = document.getElementsByTagName('head')[0];
+
+ if (head != null && this.flowAnimationStyle == null)
+ {
+ this.flowAnimationStyle = document.createElement('style')
+ this.flowAnimationStyle.setAttribute('id',
+ 'geEditorFlowAnimation-' + Editor.guid());
+ this.flowAnimationStyle.type = 'text/css';
+ var id = this.flowAnimationStyle.getAttribute('id');
+ this.flowAnimationStyle.innerHTML = this.getFlowAnimationStyleCss(id);
+
+ head.appendChild(this.flowAnimationStyle);
+ }
+
+ return this.flowAnimationStyle;
+};
+
+/**
+ * Adds rack child layout style.
+ */
+Graph.prototype.getFlowAnimationStyleCss = function(id)
+{
+ return '.' + id + ' {\n' +
+ 'animation: ' + id + ' 0.5s linear;\n' +
+ 'animation-iteration-count: infinite;\n' +
+ '}\n' +
+ '@keyframes ' + id + ' {\n' +
+ 'to {\n' +
+ 'stroke-dashoffset: ' + (this.view.scale * -16) + ';\n' +
+ '}\n' +
+ '}';
+};
+
+/**
+ * Turns the given string into an array.
+ */
+Graph.prototype.stringToBytes = function(str)
+{
+ return Graph.stringToBytes(str);
+};
+
+/**
+ * Turns the given array into a string.
+ */
+Graph.prototype.bytesToString = function(arr)
+{
+ return Graph.bytesToString(arr);
+};
+
+/**
+ * Returns a base64 encoded version of the compressed outer XML of the given node.
+ */
+Graph.prototype.compressNode = function(node)
+{
+ return Graph.compressNode(node);
+};
+
+/**
+ * Returns a base64 encoded version of the compressed string.
+ */
+Graph.prototype.compress = function(data, deflate)
+{
+ return Graph.compress(data, deflate);
+};
+
+/**
+ * Returns a decompressed version of the base64 encoded string.
+ */
+Graph.prototype.decompress = function(data, inflate)
+{
+ return Graph.decompress(data, inflate);
+};
+
+/**
+ * Redirects to Graph.zapGremlins.
+ */
+Graph.prototype.zapGremlins = function(text)
+{
+ return Graph.zapGremlins(text);
+};
+
+/**
+ * Hover icons are used for hover, vertex handler and drag from sidebar.
+ */
+HoverIcons = function(graph)
+{
+ mxEventSource.call(this);
+ this.graph = graph;
+ this.init();
+};
+
+// Extends mxEventSource
+mxUtils.extend(HoverIcons, mxEventSource);
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.arrowSpacing = 2;
+
+/**
+ * Delay to switch to another state for overlapping bbox. Default is 500ms.
+ */
+HoverIcons.prototype.updateDelay = 500;
+
+/**
+ * Delay to switch between states. Default is 140ms.
+ */
+HoverIcons.prototype.activationDelay = 140;
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.currentState = null;
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.activeArrow = null;
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.inactiveOpacity = 15;
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.cssCursor = 'copy';
+
+/**
+ * Whether to hide arrows that collide with vertices.
+ * LATER: Add keyboard override, touch support.
+ */
+HoverIcons.prototype.checkCollisions = true;
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.arrowFill = '#29b6f2';
+
+/**
+ * Up arrow.
+ */
+HoverIcons.prototype.triangleUp = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-up.png', 26, 14) :
+ Graph.createSvgImage(18, 28, '');
+
+/**
+ * Right arrow.
+ */
+HoverIcons.prototype.triangleRight = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-right.png', 14, 26) :
+ Graph.createSvgImage(26, 18, '');
+
+/**
+ * Down arrow.
+ */
+HoverIcons.prototype.triangleDown = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-down.png', 26, 14) :
+ Graph.createSvgImage(18, 26, '');
+
+/**
+ * Left arrow.
+ */
+HoverIcons.prototype.triangleLeft = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-left.png', 14, 26) :
+ Graph.createSvgImage(28, 18, '');
+
+/**
+ * Round target.
+ */
+HoverIcons.prototype.roundDrop = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/round-drop.png', 26, 26) :
+ Graph.createSvgImage(26, 26, '');
+
+/**
+ * Refresh target.
+ */
+HoverIcons.prototype.refreshTarget = new mxImage((mxClient.IS_SVG) ? 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCI+PGVsbGlwc2UgZmlsbD0iIzI5YjZmMiIgY3g9IjEyIiBjeT0iMTIiIHJ4PSIxMiIgcnk9IjEyIi8+PHBhdGggdHJhbnNmb3JtPSJzY2FsZSgwLjgpIHRyYW5zbGF0ZSgyLjQsIDIuNCkiIHN0cm9rZT0iI2ZmZiIgZmlsbD0iI2ZmZiIgZD0iTTEyIDZ2M2w0LTQtNC00djNjLTQuNDIgMC04IDMuNTgtOCA4IDAgMS41Ny40NiAzLjAzIDEuMjQgNC4yNkw2LjcgMTQuOGMtLjQ1LS44My0uNy0xLjc5LS43LTIuOCAwLTMuMzEgMi42OS02IDYtNnptNi43NiAxLjc0TDE3LjMgOS4yYy40NC44NC43IDEuNzkuNyAyLjggMCAzLjMxLTIuNjkgNi02IDZ2LTNsLTQgNCA0IDR2LTNjNC40MiAwIDgtMy41OCA4LTggMC0xLjU3LS40Ni0zLjAzLTEuMjQtNC4yNnoiLz48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PC9zdmc+Cg==' :
+ IMAGE_PATH + '/refresh.png', 38, 38);
+
+/**
+ * Tolerance for hover icon clicks.
+ */
+HoverIcons.prototype.tolerance = (mxClient.IS_TOUCH) ? 6 : 0;
+
+/**
+ *
+ */
+HoverIcons.prototype.init = function()
+{
+ this.arrowUp = this.createArrow(this.triangleUp, mxResources.get('plusTooltip'), mxConstants.DIRECTION_NORTH);
+ this.arrowRight = this.createArrow(this.triangleRight, mxResources.get('plusTooltip'), mxConstants.DIRECTION_EAST);
+ this.arrowDown = this.createArrow(this.triangleDown, mxResources.get('plusTooltip'), mxConstants.DIRECTION_SOUTH);
+ this.arrowLeft = this.createArrow(this.triangleLeft, mxResources.get('plusTooltip'), mxConstants.DIRECTION_WEST);
+
+ this.elts = [this.arrowUp, this.arrowRight, this.arrowDown, this.arrowLeft];
+
+ this.resetHandler = mxUtils.bind(this, function()
+ {
+ this.reset();
+ });
+
+ this.repaintHandler = mxUtils.bind(this, function()
+ {
+ this.repaint();
+ });
+
+ this.graph.selectionModel.addListener(mxEvent.CHANGE, this.resetHandler);
+ this.graph.model.addListener(mxEvent.CHANGE, this.repaintHandler);
+ this.graph.view.addListener(mxEvent.SCALE_AND_TRANSLATE, this.repaintHandler);
+ this.graph.view.addListener(mxEvent.TRANSLATE, this.repaintHandler);
+ this.graph.view.addListener(mxEvent.SCALE, this.repaintHandler);
+ this.graph.view.addListener(mxEvent.DOWN, this.repaintHandler);
+ this.graph.view.addListener(mxEvent.UP, this.repaintHandler);
+ this.graph.addListener(mxEvent.ROOT, this.repaintHandler);
+ this.graph.addListener(mxEvent.ESCAPE, this.resetHandler);
+ mxEvent.addListener(this.graph.container, 'scroll', this.resetHandler);
+
+ // Resets the mouse point on escape
+ this.graph.addListener(mxEvent.ESCAPE, mxUtils.bind(this, function()
+ {
+ this.mouseDownPoint = null;
+ }));
+
+ // Removes hover icons if mouse leaves the container
+ mxEvent.addListener(this.graph.container, 'mouseleave', mxUtils.bind(this, function(evt)
+ {
+ // Workaround for IE11 firing mouseleave for touch in diagram
+ if (evt.relatedTarget != null && mxEvent.getSource(evt) == this.graph.container)
+ {
+ this.setDisplay('none');
+ }
+ }));
+
+ // Resets current state when in-place editor starts
+ this.graph.addListener(mxEvent.START_EDITING, mxUtils.bind(this, function(evt)
+ {
+ this.reset();
+ }));
+
+ // Resets current state after update of selection state for touch events
+ var graphClick = this.graph.click;
+ this.graph.click = mxUtils.bind(this, function(me)
+ {
+ graphClick.apply(this.graph, arguments);
+
+ if (this.currentState != null && !this.graph.isCellSelected(this.currentState.cell) &&
+ mxEvent.isTouchEvent(me.getEvent()) && !this.graph.model.isVertex(me.getCell()))
+ {
+ this.reset();
+ }
+ });
+
+ // Checks if connection handler was active in mouse move
+ // as workaround for possible double connection inserted
+ var connectionHandlerActive = false;
+
+ // Implements a listener for hover and click handling
+ this.graph.addMouseListener(
+ {
+ mouseDown: mxUtils.bind(this, function(sender, me)
+ {
+ connectionHandlerActive = false;
+ var evt = me.getEvent();
+
+ if (this.isResetEvent(evt))
+ {
+ this.reset();
+ }
+ else if (!this.isActive())
+ {
+ var state = this.getState(me.getState());
+
+ if (state != null || !mxEvent.isTouchEvent(evt))
+ {
+ this.update(state);
+ }
+ }
+
+ this.setDisplay('none');
+ }),
+ mouseMove: mxUtils.bind(this, function(sender, me)
+ {
+ var evt = me.getEvent();
+
+ if (this.isResetEvent(evt))
+ {
+ this.reset();
+ }
+ else if (!this.graph.isMouseDown && !mxEvent.isTouchEvent(evt))
+ {
+ this.update(this.getState(me.getState()),
+ me.getGraphX(), me.getGraphY());
+ }
+
+ if (this.graph.connectionHandler != null &&
+ this.graph.connectionHandler.shape != null)
+ {
+ connectionHandlerActive = true;
+ }
+ }),
+ mouseUp: mxUtils.bind(this, function(sender, me)
+ {
+ var evt = me.getEvent();
+ var pt = mxUtils.convertPoint(this.graph.container,
+ mxEvent.getClientX(evt), mxEvent.getClientY(evt))
+
+ if (this.isResetEvent(evt))
+ {
+ this.reset();
+ }
+ else if (this.isActive() && !connectionHandlerActive &&
+ this.mouseDownPoint != null)
+ {
+ this.click(this.currentState, this.getDirection(), me);
+ }
+ else if (this.isActive())
+ {
+ // Selects target vertex after drag and clone if not only new edge was inserted
+ if (this.graph.getSelectionCount() != 1 || !this.graph.model.isEdge(
+ this.graph.getSelectionCell()))
+ {
+ this.update(this.getState(this.graph.view.getState(
+ this.graph.getCellAt(me.getGraphX(), me.getGraphY()))));
+ }
+ else
+ {
+ this.reset();
+ }
+ }
+ else if (mxEvent.isTouchEvent(evt) || (this.bbox != null &&
+ mxUtils.contains(this.bbox, me.getGraphX(), me.getGraphY())))
+ {
+ // Shows existing hover icons if inside bounding box
+ this.setDisplay('');
+ this.repaint();
+ }
+ else if (!mxEvent.isTouchEvent(evt))
+ {
+ this.reset();
+ }
+
+ connectionHandlerActive = false;
+ this.resetActiveArrow();
+ })
+ });
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.isResetEvent = function(evt, allowShift)
+{
+ return mxEvent.isAltDown(evt) || (this.activeArrow == null && mxEvent.isShiftDown(evt)) ||
+ (mxEvent.isPopupTrigger(evt) && !this.graph.isCloneEvent(evt));
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.createArrow = function(img, tooltip, direction)
+{
+ var arrow = null;
+ arrow = mxUtils.createImage(img.src);
+ arrow.style.width = img.width + 'px';
+ arrow.style.height = img.height + 'px';
+ arrow.style.padding = this.tolerance + 'px';
+
+ if (tooltip != null)
+ {
+ arrow.setAttribute('title', tooltip);
+ }
+
+ arrow.style.position = 'absolute';
+ arrow.style.cursor = this.cssCursor;
+
+ mxEvent.addGestureListeners(arrow, mxUtils.bind(this, function(evt)
+ {
+ if (this.currentState != null && !this.isResetEvent(evt))
+ {
+ this.mouseDownPoint = mxUtils.convertPoint(this.graph.container,
+ mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+ this.drag(evt, this.mouseDownPoint.x, this.mouseDownPoint.y);
+ this.activeArrow = arrow;
+ this.setDisplay('none');
+ mxEvent.consume(evt);
+ }
+ }));
+
+ // Captures mouse events as events on graph
+ mxEvent.redirectMouseEvents(arrow, this.graph, this.currentState);
+
+ mxEvent.addListener(arrow, 'mouseenter', mxUtils.bind(this, function(evt)
+ {
+ // Workaround for Firefox firing mouseenter on touchend
+ if (mxEvent.isMouseEvent(evt))
+ {
+ if (this.activeArrow != null && this.activeArrow != arrow)
+ {
+ mxUtils.setOpacity(this.activeArrow, this.inactiveOpacity);
+ }
+
+ this.graph.connectionHandler.constraintHandler.reset();
+ mxUtils.setOpacity(arrow, 100);
+ this.activeArrow = arrow;
+
+ this.fireEvent(new mxEventObject('focus', 'arrow', arrow,
+ 'direction', direction, 'event', evt));
+ }
+ }));
+
+ mxEvent.addListener(arrow, 'mouseleave', mxUtils.bind(this, function(evt)
+ {
+ if (mxEvent.isMouseEvent(evt))
+ {
+ this.fireEvent(new mxEventObject('blur', 'arrow', arrow,
+ 'direction', direction, 'event', evt));
+ }
+
+ // Workaround for IE11 firing this event on touch
+ if (!this.graph.isMouseDown)
+ {
+ this.resetActiveArrow();
+ }
+ }));
+
+ return arrow;
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.resetActiveArrow = function()
+{
+ if (this.activeArrow != null)
+ {
+ mxUtils.setOpacity(this.activeArrow, this.inactiveOpacity);
+ this.activeArrow = null;
+ }
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.getDirection = function()
+{
+ var dir = mxConstants.DIRECTION_EAST;
+
+ if (this.activeArrow == this.arrowUp)
+ {
+ dir = mxConstants.DIRECTION_NORTH;
+ }
+ else if (this.activeArrow == this.arrowDown)
+ {
+ dir = mxConstants.DIRECTION_SOUTH;
+ }
+ else if (this.activeArrow == this.arrowLeft)
+ {
+ dir = mxConstants.DIRECTION_WEST;
+ }
+
+ return dir;
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.visitNodes = function(visitor)
+{
+ for (var i = 0; i < this.elts.length; i++)
+ {
+ if (this.elts[i] != null)
+ {
+ visitor(this.elts[i]);
+ }
+ }
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.removeNodes = function()
+{
+ this.visitNodes(function(elt)
+ {
+ if (elt.parentNode != null)
+ {
+ elt.parentNode.removeChild(elt);
+ }
+ });
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.setDisplay = function(display)
+{
+ this.visitNodes(function(elt)
+ {
+ elt.style.display = display;
+ });
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.isActive = function()
+{
+ return this.activeArrow != null && this.currentState != null;
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.drag = function(evt, x, y)
+{
+ this.graph.popupMenuHandler.hideMenu();
+ this.graph.stopEditing(false);
+
+ // Checks if state was removed in call to stopEditing above
+ if (this.currentState != null)
+ {
+ this.graph.connectionHandler.start(this.currentState, x, y);
+ this.graph.isMouseTrigger = mxEvent.isMouseEvent(evt);
+ this.graph.isMouseDown = true;
+
+ // Hides handles for selection cell
+ var handler = this.graph.selectionCellsHandler.getHandler(this.currentState.cell);
+
+ if (handler != null)
+ {
+ handler.setHandlesVisible(false);
+ }
+
+ // Ctrl+shift drag sets source constraint
+ var es = this.graph.connectionHandler.edgeState;
+
+ if (evt != null && mxEvent.isShiftDown(evt) && mxEvent.isControlDown(evt) && es != null &&
+ mxUtils.getValue(es.style, mxConstants.STYLE_EDGE, null) === 'orthogonalEdgeStyle')
+ {
+ var direction = this.getDirection();
+ es.cell.style = mxUtils.setStyle(es.cell.style, 'sourcePortConstraint', direction);
+ es.style['sourcePortConstraint'] = direction;
+ }
+ }
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.getStateAt = function(state, x, y)
+{
+ return this.graph.view.getState(this.graph.getCellAt(x, y));
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.click = function(state, dir, me)
+{
+ var evt = me.getEvent();
+ var x = me.getGraphX();
+ var y = me.getGraphY();
+
+ var tmp = this.getStateAt(state, x, y);
+
+ if (tmp != null && this.graph.model.isEdge(tmp.cell) && !this.graph.isCloneEvent(evt) &&
+ (tmp.getVisibleTerminalState(true) == state || tmp.getVisibleTerminalState(false) == state))
+ {
+ this.graph.setSelectionCell(tmp.cell);
+ this.reset();
+ }
+ else if (state != null)
+ {
+ this.execute(state, dir, me);
+ }
+
+ me.consume();
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.execute = function(state, dir, me)
+{
+ var evt = me.getEvent();
+
+ this.graph.selectCellsForConnectVertex(this.graph.connectVertex(
+ state.cell, dir, this.graph.defaultEdgeLength, evt, this.graph.isCloneEvent(evt),
+ this.graph.isCloneEvent(evt)), evt, this);
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.reset = function(clearTimeout)
+{
+ clearTimeout = (clearTimeout == null) ? true : clearTimeout;
+
+ if (clearTimeout && this.updateThread != null)
+ {
+ window.clearTimeout(this.updateThread);
+ }
+
+ this.mouseDownPoint = null;
+ this.currentState = null;
+ this.activeArrow = null;
+ this.removeNodes();
+ this.bbox = null;
+
+ this.fireEvent(new mxEventObject('reset'));
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.repaint = function()
+{
+ this.bbox = null;
+
+ if (this.currentState != null)
+ {
+ // Checks if cell was deleted
+ this.currentState = this.getState(this.currentState);
+
+ // Cell was deleted
+ if (this.currentState != null &&
+ this.graph.model.isVertex(this.currentState.cell) &&
+ this.graph.isCellConnectable(this.currentState.cell))
+ {
+ var bds = mxRectangle.fromRectangle(this.currentState);
+
+ // Uses outer bounding box to take rotation into account
+ if (this.currentState.shape != null && this.currentState.shape.boundingBox != null)
+ {
+ bds = mxRectangle.fromRectangle(this.currentState.shape.boundingBox);
+ }
+
+ bds.grow(this.graph.tolerance);
+ bds.grow(this.arrowSpacing);
+
+ var handler = this.graph.selectionCellsHandler.getHandler(this.currentState.cell);
+
+ if (this.graph.isTableRow(this.currentState.cell))
+ {
+ handler = this.graph.selectionCellsHandler.getHandler(
+ this.graph.model.getParent(this.currentState.cell));
+ }
+
+ var rotationBbox = null;
+
+ if (handler != null)
+ {
+ bds.x -= handler.horizontalOffset / 2;
+ bds.y -= handler.verticalOffset / 2;
+ bds.width += handler.horizontalOffset;
+ bds.height += handler.verticalOffset;
+
+ // Adds bounding box of rotation handle to avoid overlap
+ if (handler.rotationShape != null && handler.rotationShape.node != null &&
+ handler.rotationShape.node.style.visibility != 'hidden' &&
+ handler.rotationShape.node.style.display != 'none' &&
+ handler.rotationShape.boundingBox != null)
+ {
+ rotationBbox = handler.rotationShape.boundingBox;
+ }
+ }
+
+ // Positions arrows avoid collisions with rotation handle
+ var positionArrow = mxUtils.bind(this, function(arrow, x, y)
+ {
+ if (rotationBbox != null)
+ {
+ var bbox = new mxRectangle(x, y, arrow.clientWidth, arrow.clientHeight);
+
+ if (mxUtils.intersects(bbox, rotationBbox))
+ {
+ if (arrow == this.arrowUp)
+ {
+ y -= bbox.y + bbox.height - rotationBbox.y;
+ }
+ else if (arrow == this.arrowRight)
+ {
+ x += rotationBbox.x + rotationBbox.width - bbox.x;
+ }
+ else if (arrow == this.arrowDown)
+ {
+ y += rotationBbox.y + rotationBbox.height - bbox.y;
+ }
+ else if (arrow == this.arrowLeft)
+ {
+ x -= bbox.x + bbox.width - rotationBbox.x;
+ }
+ }
+ }
+
+ arrow.style.left = x + 'px';
+ arrow.style.top = y + 'px';
+ mxUtils.setOpacity(arrow, this.inactiveOpacity);
+ });
+
+ positionArrow(this.arrowUp,
+ Math.round(this.currentState.getCenterX() - this.triangleUp.width / 2 - this.tolerance),
+ Math.round(bds.y - this.triangleUp.height - this.tolerance));
+
+ positionArrow(this.arrowRight, Math.round(bds.x + bds.width - this.tolerance),
+ Math.round(this.currentState.getCenterY() - this.triangleRight.height / 2 - this.tolerance));
+
+ positionArrow(this.arrowDown, parseInt(this.arrowUp.style.left),
+ Math.round(bds.y + bds.height - this.tolerance));
+
+ positionArrow(this.arrowLeft, Math.round(bds.x - this.triangleLeft.width - this.tolerance),
+ parseInt(this.arrowRight.style.top));
+
+ if (this.checkCollisions)
+ {
+ var right = this.graph.getCellAt(bds.x + bds.width +
+ this.triangleRight.width / 2, this.currentState.getCenterY());
+ var left = this.graph.getCellAt(bds.x - this.triangleLeft.width / 2, this.currentState.getCenterY());
+ var top = this.graph.getCellAt(this.currentState.getCenterX(), bds.y - this.triangleUp.height / 2);
+ var bottom = this.graph.getCellAt(this.currentState.getCenterX(), bds.y + bds.height + this.triangleDown.height / 2);
+
+ // Shows hover icons large cell is behind all directions of current cell
+ if (right != null && right == left && left == top && top == bottom)
+ {
+ right = null;
+ left = null;
+ top = null;
+ bottom = null;
+ }
+
+ var currentGeo = this.graph.getCellGeometry(this.currentState.cell);
+
+ var checkCollision = mxUtils.bind(this, function(cell, arrow)
+ {
+ var geo = this.graph.model.isVertex(cell) && this.graph.getCellGeometry(cell);
+
+ // Ignores collision if vertex is more than 3 times the size of this vertex
+ if (cell != null && !this.graph.model.isAncestor(cell, this.currentState.cell) &&
+ !this.graph.isSwimlane(cell) && (geo == null || currentGeo == null ||
+ (geo.height < 3 * currentGeo.height && geo.width < 3 * currentGeo.width)))
+ {
+ arrow.style.visibility = 'hidden';
+ }
+ else
+ {
+ arrow.style.visibility = 'visible';
+ }
+ });
+
+ checkCollision(right, this.arrowRight);
+ checkCollision(left, this.arrowLeft);
+ checkCollision(top, this.arrowUp);
+ checkCollision(bottom, this.arrowDown);
+ }
+ else
+ {
+ this.arrowLeft.style.visibility = 'visible';
+ this.arrowRight.style.visibility = 'visible';
+ this.arrowUp.style.visibility = 'visible';
+ this.arrowDown.style.visibility = 'visible';
+ }
+
+ if (this.graph.tooltipHandler.isEnabled())
+ {
+ this.arrowLeft.setAttribute('title', mxResources.get('plusTooltip'));
+ this.arrowRight.setAttribute('title', mxResources.get('plusTooltip'));
+ this.arrowUp.setAttribute('title', mxResources.get('plusTooltip'));
+ this.arrowDown.setAttribute('title', mxResources.get('plusTooltip'));
+ }
+ else
+ {
+ this.arrowLeft.removeAttribute('title');
+ this.arrowRight.removeAttribute('title');
+ this.arrowUp.removeAttribute('title');
+ this.arrowDown.removeAttribute('title');
+ }
+ }
+ else
+ {
+ this.reset();
+ }
+
+ // Updates bounding box
+ if (this.currentState != null)
+ {
+ this.bbox = this.computeBoundingBox();
+
+ // Adds tolerance for hover
+ if (this.bbox != null)
+ {
+ this.bbox.grow(10);
+ }
+ }
+ }
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.computeBoundingBox = function()
+{
+ var bbox = (!this.graph.model.isEdge(this.currentState.cell)) ? mxRectangle.fromRectangle(this.currentState) : null;
+
+ this.visitNodes(function(elt)
+ {
+ if (elt.parentNode != null)
+ {
+ var tmp = new mxRectangle(elt.offsetLeft, elt.offsetTop, elt.offsetWidth, elt.offsetHeight);
+
+ if (bbox == null)
+ {
+ bbox = tmp;
+ }
+ else
+ {
+ bbox.add(tmp);
+ }
+ }
+ });
+
+ return bbox;
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.getState = function(state)
+{
+ if (state != null)
+ {
+ var cell = state.cell;
+
+ if (!this.graph.getModel().contains(cell))
+ {
+ state = null;
+ }
+ else
+ {
+ // Uses connectable parent vertex if child is not connectable
+ if (this.graph.getModel().isVertex(cell) && !this.graph.isCellConnectable(cell))
+ {
+ var parent = this.graph.getModel().getParent(cell);
+
+ if (this.graph.getModel().isVertex(parent) && this.graph.isCellConnectable(parent))
+ {
+ cell = parent;
+ }
+ }
+
+ // Ignores locked cells and edges
+ if (this.graph.isCellLocked(cell) || this.graph.model.isEdge(cell))
+ {
+ cell = null;
+ }
+
+ state = this.graph.view.getState(cell);
+
+ if (state != null && state.style == null)
+ {
+ state = null;
+ }
+ }
+ }
+
+ return state;
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.update = function(state, x, y)
+{
+ if (!this.graph.connectionArrowsEnabled ||
+ (this.graph.freehand != null && this.graph.freehand.isDrawing()) ||
+ (state != null && mxUtils.getValue(state.style, 'allowArrows', '1') == '0'))
+ {
+ this.reset();
+ }
+ else
+ {
+ if (state != null && state.cell.geometry != null && state.cell.geometry.relative &&
+ this.graph.model.isEdge(state.cell.parent))
+ {
+ state = null;
+ }
+
+ var timeOnTarget = null;
+
+ // Time on target
+ if (this.prev != state || this.isActive())
+ {
+ this.startTime = new Date().getTime();
+ this.prev = state;
+ timeOnTarget = 0;
+
+ if (this.updateThread != null)
+ {
+ window.clearTimeout(this.updateThread);
+ }
+
+ if (state != null)
+ {
+ // Starts timer to update current state with no mouse events
+ this.updateThread = window.setTimeout(mxUtils.bind(this, function()
+ {
+ if (!this.isActive() && !this.graph.isMouseDown &&
+ !this.graph.panningHandler.isActive())
+ {
+ this.prev = state;
+ this.update(state, x, y);
+ }
+ }), this.updateDelay + 10);
+ }
+ }
+ else if (this.startTime != null)
+ {
+ timeOnTarget = new Date().getTime() - this.startTime;
+ }
+
+ this.setDisplay('');
+
+ if (this.currentState != null && this.currentState != state && timeOnTarget < this.activationDelay &&
+ this.bbox != null && !mxUtils.contains(this.bbox, x, y))
+ {
+ this.reset(false);
+ }
+ else if (this.currentState != null || timeOnTarget > this.activationDelay)
+ {
+ if (this.currentState != state && ((timeOnTarget > this.updateDelay && state != null) ||
+ this.bbox == null || x == null || y == null || !mxUtils.contains(this.bbox, x, y)))
+ {
+ if (state != null && this.graph.isEnabled())
+ {
+ this.removeNodes();
+ this.setCurrentState(state);
+ this.repaint();
+
+ // Resets connection points on other focused cells
+ if (this.graph.connectionHandler.constraintHandler.currentFocus != state)
+ {
+ this.graph.connectionHandler.constraintHandler.reset();
+ }
+ }
+ else
+ {
+ this.reset();
+ }
+ }
+ }
+ }
+};
+
+/**
+ *
+ */
+HoverIcons.prototype.setCurrentState = function(state)
+{
+ if (state.style['portConstraint'] != 'eastwest')
+ {
+ this.graph.container.appendChild(this.arrowUp);
+ this.graph.container.appendChild(this.arrowDown);
+ }
+
+ this.graph.container.appendChild(this.arrowRight);
+ this.graph.container.appendChild(this.arrowLeft);
+ this.currentState = state;
+};
+
+/**
+ * Returns true if the given cell is a table.
+ */
+Graph.prototype.removeTextStyleForCell = function(cell, removeCellStyles)
+{
+ var style = this.getCurrentCellStyle(cell);
+ var result = false;
+
+ this.getModel().beginUpdate();
+ try
+ {
+ if (mxUtils.getValue(style, 'html', '0') == '1')
+ {
+ var label = this.convertValueToString(cell);
+
+ if (mxUtils.getValue(style, 'nl2Br', '1') != '0')
+ {
+ // Removes newlines from HTML and converts breaks to newlines
+ // to match the HTML output in plain text
+ label = label.replace(/\n/g, '').replace(//g, '\n');
+ }
+
+ label = Editor.convertHtmlToText(label);
+ this.cellLabelChanged(cell, label);
+ result = true;
+ }
+
+ if (removeCellStyles)
+ {
+ this.setCellStyles('fontSource', null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_FONTFAMILY, null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_FONTSIZE, null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_FONTSTYLE, null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_FONTCOLOR, null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_LABEL_BORDERCOLOR, null, [cell]);
+ this.setCellStyles(mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, null, [cell]);
+ }
+ }
+ finally
+ {
+ this.getModel().endUpdate();
+ }
+
+ return result;
+};
+
+/**
+ * Returns true if the given cell is a table.
+ */
+Graph.prototype.createParent = function(parent, child, childCount, dx, dy)
+{
+ parent = this.cloneCell(parent);
+
+ for (var i = 0; i < childCount; i++)
+ {
+ var clone = this.cloneCell(child);
+ var geo = this.getCellGeometry(clone)
+
+ if (geo != null)
+ {
+ geo.x += i * dx;
+ geo.y += i * dy;
+ }
+
+ parent.insert(clone);
+ }
+
+ return parent;
+};
+
+/**
+ * Returns true if the given cell is a table.
+ */
+Graph.prototype.createTable = function(rowCount, colCount, w, h, title, startSize, tableStyle, rowStyle, cellStyle)
+{
+ w = (w != null) ? w : 60;
+ h = (h != null) ? h : 40;
+ startSize = (startSize != null) ? startSize : 30;
+ tableStyle = (tableStyle != null) ? tableStyle : 'shape=table;startSize=' +
+ ((title != null) ? startSize : '0') + ';container=1;collapsible=0;childLayout=tableLayout;';
+ rowStyle = (rowStyle != null) ? rowStyle : 'shape=tableRow;horizontal=0;startSize=0;swimlaneHead=0;swimlaneBody=0;strokeColor=inherit;' +
+ 'top=0;left=0;bottom=0;right=0;collapsible=0;dropTarget=0;fillColor=none;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;';
+ cellStyle = (cellStyle != null) ? cellStyle : 'shape=partialRectangle;html=1;whiteSpace=wrap;connectable=0;strokeColor=inherit;' +
+ 'overflow=hidden;fillColor=none;top=0;left=0;bottom=0;right=0;pointerEvents=1;';
+
+ return this.createParent(this.createVertex(null, null, (title != null) ? title : '',
+ 0, 0, colCount * w, rowCount * h + ((title != null) ? startSize : 0), tableStyle),
+ this.createParent(this.createVertex(null, null, '', 0, 0, colCount * w, h, rowStyle),
+ this.createVertex(null, null, '', 0, 0, w, h, cellStyle),
+ colCount, w, 0), rowCount, 0, h);
+};
+
+/**
+ * Sets the values for the cells and rows in the given table and returns the table.
+ */
+Graph.prototype.setTableValues = function(table, values, rowValues)
+{
+ var rows = this.model.getChildCells(table, true);
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ if (rowValues != null)
+ {
+ rows[i].value = rowValues[i];
+ }
+
+ if (values != null)
+ {
+ var cells = this.model.getChildCells(rows[i], true);
+
+ for (var j = 0; j < cells.length; j++)
+ {
+ if (values[i][j] != null)
+ {
+ cells[j].value = values[i][j];
+ }
+ }
+ }
+ }
+
+ return table;
+};
+
+/**
+ *
+ */
+Graph.prototype.createCrossFunctionalSwimlane = function(rowCount, colCount, w, h, title, tableStyle, rowStyle, firstCellStyle, cellStyle)
+{
+ w = (w != null) ? w : 120;
+ h = (h != null) ? h : 120;
+
+ var s = 'collapsible=0;recursiveResize=0;expand=0;';
+ tableStyle = (tableStyle != null) ? tableStyle : 'shape=table;childLayout=tableLayout;' +
+ ((title == null) ? 'startSize=0;fillColor=none;' : 'startSize=40;') + s;
+ rowStyle = (rowStyle != null) ? rowStyle : 'shape=tableRow;horizontal=0;swimlaneHead=0;swimlaneBody=0;top=0;left=0;strokeColor=inherit;' +
+ 'bottom=0;right=0;dropTarget=0;fontStyle=0;fillColor=none;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;startSize=40;' + s;
+ firstCellStyle = (firstCellStyle != null) ? firstCellStyle : 'swimlane;swimlaneHead=0;swimlaneBody=0;fontStyle=0;strokeColor=inherit;' +
+ 'connectable=0;fillColor=none;startSize=40;' + s;
+ cellStyle = (cellStyle != null) ? cellStyle : 'swimlane;swimlaneHead=0;swimlaneBody=0;fontStyle=0;connectable=0;strokeColor=inherit;' +
+ 'fillColor=none;startSize=0;' + s;
+
+ var table = this.createVertex(null, null, (title != null) ? title : '', 0, 0,
+ colCount * w, rowCount * h, tableStyle);
+ var t = mxUtils.getValue(this.getCellStyle(table), mxConstants.STYLE_STARTSIZE,
+ mxConstants.DEFAULT_STARTSIZE);
+ table.geometry.width += t;
+ table.geometry.height += t;
+
+ var row = this.createVertex(null, null, '', 0, t, colCount * w + t, h, rowStyle);
+ table.insert(this.createParent(row, this.createVertex(null, null,
+ '', t, 0, w, h, firstCellStyle), colCount, w, 0));
+
+ if (rowCount > 1)
+ {
+ row.geometry.y = h + t;
+
+ return this.createParent(table, this.createParent(row,
+ this.createVertex(null, null, '', t, 0, w, h, cellStyle),
+ colCount, w, 0), rowCount - 1, 0, h);
+ }
+ else
+ {
+ return table;
+ }
+};
+
+/**
+ * Returns the row and column lines for the given table.
+ */
+Graph.prototype.visitTableCells = function(cell, visitor)
+{
+ var lastRow = null;
+ var rows = this.model.getChildCells(cell, true);
+ var start = this.getActualStartSize(cell, true);
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ var rowStart = this.getActualStartSize(rows[i], true);
+ var cols = this.model.getChildCells(rows[i], true);
+ var rowStyle = this.getCellStyle(rows[i], true);
+ var lastCol = null;
+ var row = [];
+
+ for (var j = 0; j < cols.length; j++)
+ {
+ var geo = this.getCellGeometry(cols[j]);
+ var col = {cell: cols[j], rospan: 1, colspan: 1, row: i, col: j, geo: geo};
+ geo = (geo.alternateBounds != null) ? geo.alternateBounds : geo;
+ col.point = new mxPoint(geo.width + (lastCol != null ? lastCol.point.x : start.x + rowStart.x),
+ geo.height + (lastRow != null && lastRow[0] != null ? lastRow[0].point.y : start.y + rowStart.y));
+ col.actual = col;
+
+ if (lastRow != null && lastRow[j] != null && lastRow[j].rowspan > 1)
+ {
+ col.rowspan = lastRow[j].rowspan - 1;
+ col.colspan = lastRow[j].colspan;
+ col.actual = lastRow[j].actual;
+ }
+ else
+ {
+ if (lastCol != null && lastCol.colspan > 1)
+ {
+ col.rowspan = lastCol.rowspan;
+ col.colspan = lastCol.colspan - 1;
+ col.actual = lastCol.actual;
+ }
+ else
+ {
+ var style = this.getCurrentCellStyle(cols[j], true);
+
+ if (style != null)
+ {
+ col.rowspan = parseInt(style['rowspan'] || 1);
+ col.colspan = parseInt(style['colspan'] || 1);
+ }
+ }
+ }
+
+ var head = mxUtils.getValue(rowStyle, mxConstants.STYLE_SWIMLANE_HEAD, 1) == 1 &&
+ mxUtils.getValue(rowStyle, mxConstants.STYLE_STROKECOLOR,
+ mxConstants.NONE) != mxConstants.NONE;
+
+ visitor(col, cols.length, rows.length,
+ start.x + ((head) ? rowStart.x : 0),
+ start.y + ((head) ? rowStart.y : 0));
+ row.push(col);
+ lastCol = col;
+ }
+
+ lastRow = row;
+ }
+
+};
+
+/**
+ * Returns the row and column lines for the given table.
+ */
+Graph.prototype.getTableLines = function(cell, horizontal, vertical)
+{
+ var hl = [];
+ var vl = [];
+
+ if (horizontal || vertical)
+ {
+ this.visitTableCells(cell, mxUtils.bind(this, function(iter, colCount, rowCount, x0, y0)
+ {
+ // Constructs horizontal lines
+ if (horizontal && iter.row < rowCount - 1)
+ {
+ if (hl[iter.row] == null)
+ {
+ hl[iter.row] = [new mxPoint(x0, iter.point.y)];
+ }
+
+ if (iter.rowspan > 1)
+ {
+ hl[iter.row].push(null);
+ }
+
+ hl[iter.row].push(iter.point);
+ }
+
+ // Constructs vertical lines
+ if (vertical && iter.col < colCount - 1)
+ {
+ if (vl[iter.col] == null)
+ {
+ vl[iter.col] = [new mxPoint(iter.point.x, y0)];
+ }
+
+ if (iter.colspan > 1)
+ {
+ vl[iter.col].push(null);
+ }
+
+ vl[iter.col].push(iter.point);
+ }
+ }));
+ }
+
+ return hl.concat(vl);
+};
+
+/**
+ * Returns true if the given cell is a table cell.
+ */
+Graph.prototype.isTableCell = function(cell)
+{
+ return this.model.isVertex(cell) && this.isTableRow(this.model.getParent(cell));
+};
+
+/**
+ * Returns true if the given cell is a table row.
+ */
+Graph.prototype.isTableRow = function(cell)
+{
+ return this.model.isVertex(cell) && this.isTable(this.model.getParent(cell));
+};
+
+/**
+ * Returns true if the given cell is a table.
+ */
+Graph.prototype.isTable = function(cell)
+{
+ var style = this.getCellStyle(cell);
+
+ return style != null && style['childLayout'] == 'tableLayout';
+};
+
+/**
+ * Returns true if the given cell is a table.
+ */
+Graph.prototype.isStack = function(cell)
+{
+ var style = this.getCellStyle(cell);
+
+ return style != null && style['childLayout'] == 'stackLayout';
+};
+
+/**
+ * Returns true if the given cell is a table row.
+ */
+Graph.prototype.isStackChild = function(cell)
+{
+ return this.model.isVertex(cell) && this.isStack(this.model.getParent(cell));
+};
+
+/**
+ * Updates the row and table heights.
+ */
+Graph.prototype.setTableRowHeight = function(row, dy, extend)
+{
+ extend = (extend != null) ? extend : true;
+ var model = this.getModel();
+
+ model.beginUpdate();
+ try
+ {
+ var rgeo = this.getCellGeometry(row);
+
+ // Sets height of row
+ if (rgeo != null)
+ {
+ rgeo = rgeo.clone();
+ rgeo.height += dy;
+ model.setGeometry(row, rgeo);
+
+ var table = model.getParent(row);
+ var rows = model.getChildCells(table, true);
+
+ // Shifts and resizes neighbor row
+ if (!extend)
+ {
+ var index = mxUtils.indexOf(rows, row);
+
+ if (index < rows.length - 1)
+ {
+ var nextRow = rows[index + 1];
+ var geo = this.getCellGeometry(nextRow);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+ geo.y += dy;
+ geo.height -= dy;
+
+ model.setGeometry(nextRow, geo);
+ }
+ }
+ }
+
+ // Updates height of table
+ var tgeo = this.getCellGeometry(table);
+
+ if (tgeo != null)
+ {
+ // Always extends for last row
+ if (!extend)
+ {
+ extend = row == rows[rows.length - 1];
+ }
+
+ if (extend)
+ {
+ tgeo = tgeo.clone();
+ tgeo.height += dy;
+ model.setGeometry(table, tgeo);
+ }
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+};
+
+/**
+ * Updates column width and row height.
+ */
+Graph.prototype.setTableColumnWidth = function(col, dx, extend)
+{
+ extend = (extend != null) ? extend : false;
+
+ var model = this.getModel();
+ var row = model.getParent(col);
+ var table = model.getParent(row);
+ var cells = model.getChildCells(row, true);
+ var index = mxUtils.indexOf(cells, col);
+ var lastColumn = index == cells.length - 1;
+
+ model.beginUpdate();
+ try
+ {
+ // Sets width of child cell
+ var rows = model.getChildCells(table, true);
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ row = rows[i];
+ cells = model.getChildCells(row, true);
+ var cell = cells[index];
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+ geo.width += dx;
+
+ if (geo.alternateBounds != null)
+ {
+ geo.alternateBounds.width += dx;
+ }
+
+ model.setGeometry(cell, geo);
+ }
+
+ // Shifts and resizes neighbor column
+ if (index < cells.length - 1)
+ {
+ cell = cells[index + 1];
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+ geo.x += dx;
+
+ if (!extend)
+ {
+ geo.width -= dx;
+
+ if (geo.alternateBounds != null)
+ {
+ geo.alternateBounds.width -= dx;
+ }
+ }
+
+ model.setGeometry(cell, geo);
+ }
+ }
+ }
+
+ if (lastColumn || extend)
+ {
+ // Updates width of table
+ var tgeo = this.getCellGeometry(table);
+
+ if (tgeo != null)
+ {
+ tgeo = tgeo.clone();
+ tgeo.width += dx;
+ model.setGeometry(table, tgeo);
+ }
+ }
+
+ if (this.layoutManager != null)
+ {
+ this.layoutManager.executeLayout(table);
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+};
+
+/**
+ * Special Layout for tables.
+ */
+function TableLayout(graph)
+{
+ mxGraphLayout.call(this, graph);
+};
+
+/**
+ * Extends mxGraphLayout.
+ */
+TableLayout.prototype = new mxStackLayout();
+TableLayout.prototype.constructor = TableLayout;
+
+/**
+ * Function: isHorizontal
+ *
+ * Overrides stack layout to handle row reorder.
+ */
+TableLayout.prototype.isHorizontal = function()
+{
+ return false;
+};
+
+/**
+ * Function: isVertexIgnored
+ *
+ * Overrides to allow for table rows and cells.
+ */
+TableLayout.prototype.isVertexIgnored = function(vertex)
+{
+ return !this.graph.getModel().isVertex(vertex) ||
+ !this.graph.isCellVisible(vertex);
+};
+
+/**
+ * Function: getSize
+ *
+ * Returns the total vertical or horizontal size of the given cells.
+ */
+TableLayout.prototype.getSize = function(cells, horizontal)
+{
+ var total = 0;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (!this.isVertexIgnored(cells[i]))
+ {
+ var geo = this.graph.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ total += (horizontal) ? geo.width : geo.height;
+ }
+ }
+ }
+
+ return total;
+};
+
+/**
+ * Function: getRowLayout
+ *
+ * Returns the column positions for the given row and table width.
+ */
+TableLayout.prototype.getRowLayout = function(row, width)
+{
+ var cells = this.graph.model.getChildCells(row, true);
+ var off = this.graph.getActualStartSize(row, true);
+ var sw = this.getSize(cells, true);
+ var rw = width - off.x - off.width;
+ var result = [];
+ var x = off.x;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var geo = this.graph.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ x += (geo.alternateBounds != null ?
+ geo.alternateBounds.width :
+ geo.width) * rw / sw;
+ result.push(Math.round(x));
+ }
+ }
+
+ return result;
+};
+
+/**
+ * Function: layoutRow
+ *
+ * Places the cells at the given positions in the given row.
+ */
+TableLayout.prototype.layoutRow = function(row, positions, height, tw)
+{
+ var model = this.graph.getModel();
+ var cells = model.getChildCells(row, true);
+ var off = this.graph.getActualStartSize(row, true);
+ var x = off.x;
+ var sw = 0;
+
+ if (positions != null)
+ {
+ positions = positions.slice();
+ positions.splice(0, 0, off.x);
+ }
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var geo = this.graph.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ geo.y = off.y;
+ geo.height = height - off.y - off.height;
+
+ if (positions != null)
+ {
+ geo.x = positions[i];
+ geo.width = positions[i + 1] - geo.x;
+
+ // Fills with last geo if not enough cells
+ if (i == cells.length - 1 && i < positions.length - 2)
+ {
+ geo.width = tw - geo.x - off.x - off.width;
+ }
+ }
+ else
+ {
+ geo.x = x;
+ x += geo.width;
+
+ if (i == cells.length - 1)
+ {
+ geo.width = tw - off.x - off.width - sw;
+ }
+ else
+ {
+ sw += geo.width;
+ }
+ }
+
+ geo.alternateBounds = new mxRectangle(0, 0, geo.width, geo.height);
+ model.setGeometry(cells[i], geo);
+ }
+ }
+
+ return sw;
+};
+
+/**
+ * Function: execute
+ *
+ * Implements .
+ */
+TableLayout.prototype.execute = function(parent)
+{
+ if (parent != null)
+ {
+ var offset = this.graph.getActualStartSize(parent, true);
+ var table = this.graph.getCellGeometry(parent);
+ var style = this.graph.getCellStyle(parent);
+ var resizeLastRow = mxUtils.getValue(style,
+ 'resizeLastRow', '0') == '1';
+ var resizeLast = mxUtils.getValue(style,
+ 'resizeLast', '0') == '1';
+ var fixedRows = mxUtils.getValue(style,
+ 'fixedRows', '0') == '1';
+ var model = this.graph.getModel();
+ var sw = 0;
+
+ model.beginUpdate();
+ try
+ {
+ var th = table.height - offset.y - offset.height;
+ var tw = table.width - offset.x - offset.width;
+ var rows = model.getChildCells(parent, true);
+
+ // Updates row visibilities
+ for (var i = 0; i < rows.length; i++)
+ {
+ model.setVisible(rows[i], true);
+ }
+
+ var sh = this.getSize(rows, false);
+
+ if (th > 0 && tw > 0 && rows.length > 0 && sh > 0)
+ {
+ if (resizeLastRow)
+ {
+ var row = this.graph.getCellGeometry(rows[rows.length - 1]);
+
+ if (row != null)
+ {
+ row = row.clone();
+ row.height = th - sh + row.height;
+ model.setGeometry(rows[rows.length - 1], row);
+ }
+ }
+
+ var pos = (resizeLast) ? null : this.getRowLayout(rows[0], tw);
+ var lastCells = [];
+ var y = offset.y;
+
+ // Updates row geometries
+ for (var i = 0; i < rows.length; i++)
+ {
+ var row = this.graph.getCellGeometry(rows[i]);
+
+ if (row != null)
+ {
+ row = row.clone();
+ row.x = offset.x;
+ row.width = tw;
+ row.y = Math.round(y);
+
+ if (resizeLastRow || fixedRows)
+ {
+ y += row.height;
+ }
+ else
+ {
+ y += (row.height / sh) * th;
+ }
+
+ row.height = Math.round(y) - row.y;
+ model.setGeometry(rows[i], row);
+ }
+
+ // Updates cell geometries
+ sw = Math.max(sw, this.layoutRow(rows[i], pos, row.height, tw, lastCells));
+ }
+
+ if (fixedRows && th < sh)
+ {
+ table = table.clone();
+ table.height = y + offset.height;
+ model.setGeometry(parent, table);
+ }
+
+ if (resizeLast && tw < sw + Graph.minTableColumnWidth)
+ {
+ table = table.clone();
+ table.width = sw + offset.width + offset.x + Graph.minTableColumnWidth;
+ model.setGeometry(parent, table);
+ }
+
+ // All geometries cloned at this point so can change in-place below
+ this.graph.visitTableCells(parent, mxUtils.bind(this, function(iter)
+ {
+ model.setVisible(iter.cell, iter.actual.cell == iter.cell);
+
+ if (iter.actual.cell != iter.cell)
+ {
+ if (iter.actual.row == iter.row)
+ {
+ var g = (iter.geo.alternateBounds != null) ?
+ iter.geo.alternateBounds : iter.geo;
+ iter.actual.geo.width += g.width;
+ }
+
+ if (iter.actual.col == iter.col)
+ {
+ var g = (iter.geo.alternateBounds != null) ?
+ iter.geo.alternateBounds : iter.geo;
+ iter.actual.geo.height += g.height;
+ }
+ }
+ }));
+ }
+ else
+ {
+ // Updates row visibilities
+ for (var i = 0; i < rows.length; i++)
+ {
+ model.setVisible(rows[i], false);
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ }
+};
+
+(function()
+{
+ /**
+ * Reset the list of processed edges.
+ */
+ var mxGraphViewResetValidationState = mxGraphView.prototype.resetValidationState;
+ mxGraphView.prototype.resetValidationState = function()
+ {
+ mxGraphViewResetValidationState.apply(this, arguments);
+
+ this.validEdges = [];
+ };
+
+ /**
+ * Updates jumps for valid edges and repaints if needed.
+ */
+ var mxGraphViewValidateCellState = mxGraphView.prototype.validateCellState;
+ mxGraphView.prototype.validateCellState = function(cell, recurse)
+ {
+ recurse = (recurse != null) ? recurse : true;
+ var state = this.getState(cell);
+
+ // Forces repaint if jumps change on a valid edge
+ if (state != null && recurse && this.graph.model.isEdge(state.cell) &&
+ state.style != null && state.style[mxConstants.STYLE_CURVED] != 1 &&
+ !state.invalid && this.updateLineJumps(state))
+ {
+ this.graph.cellRenderer.redraw(state, false, this.isRendering());
+ }
+
+ state = mxGraphViewValidateCellState.apply(this, arguments);
+
+ // Adds to the list of edges that may intersect with later edges
+ if (state != null && recurse && this.graph.model.isEdge(state.cell) &&
+ state.style != null && state.style[mxConstants.STYLE_CURVED] != 1)
+ {
+ // LATER: Reuse jumps for valid edges
+ this.validEdges.push(state);
+ }
+
+ return state;
+ };
+
+ /**
+ * Overrides paint to add flowAnimation style.
+ */
+ var mxShapePaint = mxShape.prototype.paint;
+
+ mxShape.prototype.paint = function()
+ {
+ mxShapePaint.apply(this, arguments);
+
+ if (this.state != null && this.node != null &&
+ this.state.view.graph.enableFlowAnimation &&
+ this.state.view.graph.model.isEdge(this.state.cell) &&
+ mxUtils.getValue(this.state.style, 'flowAnimation', '0') == '1')
+ {
+ var paths = this.node.getElementsByTagName('path');
+
+ if (paths.length > 1)
+ {
+ if (mxUtils.getValue(this.state.style, mxConstants.STYLE_DASHED, '0') != '1')
+ {
+ paths[1].setAttribute('stroke-dasharray', (this.state.view.scale * 8));
+ }
+
+ var anim = this.state.view.graph.getFlowAnimationStyle();
+
+ if (anim != null)
+ {
+ paths[1].setAttribute('class', anim.getAttribute('id'));
+ }
+ }
+ }
+ };
+
+ /**
+ * Forces repaint if routed points have changed.
+ */
+ var mxCellRendererIsShapeInvalid = mxCellRenderer.prototype.isShapeInvalid;
+ mxCellRenderer.prototype.isShapeInvalid = function(state, shape)
+ {
+ return mxCellRendererIsShapeInvalid.apply(this, arguments) ||
+ (state.routedPoints != null && shape.routedPoints != null &&
+ !mxUtils.equalPoints(shape.routedPoints, state.routedPoints))
+ };
+
+ /**
+ * Updates jumps for invalid edges.
+ */
+ var mxGraphViewUpdateCellState = mxGraphView.prototype.updateCellState;
+ mxGraphView.prototype.updateCellState = function(state)
+ {
+ mxGraphViewUpdateCellState.apply(this, arguments);
+
+ // Updates jumps on invalid edge before repaint
+ if (this.graph.model.isEdge(state.cell) &&
+ state.style[mxConstants.STYLE_CURVED] != 1)
+ {
+ this.updateLineJumps(state);
+ }
+ };
+
+ /**
+ * Updates the jumps between given state and processed edges.
+ */
+ mxGraphView.prototype.updateLineJumps = function(state)
+ {
+ var pts = state.absolutePoints;
+
+ if (Graph.lineJumpsEnabled)
+ {
+ var changed = state.routedPoints != null;
+ var actual = null;
+
+ if (pts != null && this.validEdges != null &&
+ mxUtils.getValue(state.style, 'jumpStyle', 'none') !== 'none')
+ {
+ var thresh = 0.5 * this.scale;
+ changed = false;
+ actual = [];
+
+ // Type 0 means normal waypoint, 1 means jump
+ function addPoint(type, x, y)
+ {
+ var rpt = new mxPoint(x, y);
+ rpt.type = type;
+
+ actual.push(rpt);
+ var curr = (state.routedPoints != null) ? state.routedPoints[actual.length - 1] : null;
+
+ return curr == null || curr.type != type || curr.x != x || curr.y != y;
+ };
+
+ for (var i = 0; i < pts.length - 1; i++)
+ {
+ var p1 = pts[i + 1];
+ var p0 = pts[i];
+ var list = [];
+
+ // Ignores waypoints on straight segments
+ var pn = pts[i + 2];
+
+ while (i < pts.length - 2 &&
+ mxUtils.ptSegDistSq(p0.x, p0.y, pn.x, pn.y,
+ p1.x, p1.y) < 1 * this.scale * this.scale)
+ {
+ p1 = pn;
+ i++;
+ pn = pts[i + 2];
+ }
+
+ changed = addPoint(0, p0.x, p0.y) || changed;
+
+ // Processes all previous edges
+ for (var e = 0; e < this.validEdges.length; e++)
+ {
+ var state2 = this.validEdges[e];
+ var pts2 = state2.absolutePoints;
+
+ if (pts2 != null && mxUtils.intersects(state, state2) && state2.style['noJump'] != '1')
+ {
+ // Compares each segment of the edge with the current segment
+ for (var j = 0; j < pts2.length - 1; j++)
+ {
+ var p3 = pts2[j + 1];
+ var p2 = pts2[j];
+
+ // Ignores waypoints on straight segments
+ pn = pts2[j + 2];
+
+ while (j < pts2.length - 2 &&
+ mxUtils.ptSegDistSq(p2.x, p2.y, pn.x, pn.y,
+ p3.x, p3.y) < 1 * this.scale * this.scale)
+ {
+ p3 = pn;
+ j++;
+ pn = pts2[j + 2];
+ }
+
+ var pt = mxUtils.intersection(p0.x, p0.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
+
+ // Handles intersection between two segments
+ if (pt != null && (Math.abs(pt.x - p0.x) > thresh ||
+ Math.abs(pt.y - p0.y) > thresh) &&
+ (Math.abs(pt.x - p1.x) > thresh ||
+ Math.abs(pt.y - p1.y) > thresh))
+ {
+ var dx = pt.x - p0.x;
+ var dy = pt.y - p0.y;
+ var temp = {distSq: dx * dx + dy * dy, x: pt.x, y: pt.y};
+
+ // Intersections must be ordered by distance from start of segment
+ for (var t = 0; t < list.length; t++)
+ {
+ if (list[t].distSq > temp.distSq)
+ {
+ list.splice(t, 0, temp);
+ temp = null;
+
+ break;
+ }
+ }
+
+ // Ignores multiple intersections at segment joint
+ if (temp != null && (list.length == 0 ||
+ list[list.length - 1].x !== temp.x ||
+ list[list.length - 1].y !== temp.y))
+ {
+ list.push(temp);
+ }
+ }
+ }
+ }
+ }
+
+ // Adds ordered intersections to routed points
+ for (var j = 0; j < list.length; j++)
+ {
+ changed = addPoint(1, list[j].x, list[j].y) || changed;
+ }
+ }
+
+ var pt = pts[pts.length - 1];
+ changed = addPoint(0, pt.x, pt.y) || changed;
+ }
+
+ state.routedPoints = actual;
+
+ return changed;
+ }
+ else
+ {
+ return false;
+ }
+ };
+
+ /**
+ * Overrides painting the actual shape for taking into account jump style.
+ */
+ var mxConnectorPaintLine = mxConnector.prototype.paintLine;
+
+ mxConnector.prototype.paintLine = function (c, absPts, rounded)
+ {
+ // Required for checking dirty state
+ this.routedPoints = (this.state != null) ? this.state.routedPoints : null;
+
+ if (this.outline || this.state == null || this.style == null ||
+ this.state.routedPoints == null || this.state.routedPoints.length == 0)
+ {
+ mxConnectorPaintLine.apply(this, arguments);
+ }
+ else
+ {
+ var arcSize = mxUtils.getValue(this.style, mxConstants.STYLE_ARCSIZE,
+ mxConstants.LINE_ARCSIZE) / 2;
+ var size = (parseInt(mxUtils.getValue(this.style, 'jumpSize',
+ Graph.defaultJumpSize)) - 2) / 2 + this.strokewidth;
+ var style = mxUtils.getValue(this.style, 'jumpStyle', 'none');
+ var moveTo = true;
+ var last = null;
+ var len = null;
+ var pts = [];
+ var n = null;
+ c.begin();
+
+ for (var i = 0; i < this.state.routedPoints.length; i++)
+ {
+ var rpt = this.state.routedPoints[i];
+ var pt = new mxPoint(rpt.x / this.scale, rpt.y / this.scale);
+
+ // Takes first and last point from passed-in array
+ if (i == 0)
+ {
+ pt = absPts[0];
+ }
+ else if (i == this.state.routedPoints.length - 1)
+ {
+ pt = absPts[absPts.length - 1];
+ }
+
+ var done = false;
+
+ // Type 1 is an intersection
+ if (last != null && rpt.type == 1)
+ {
+ // Checks if next/previous points are too close
+ var next = this.state.routedPoints[i + 1];
+ var dx = next.x / this.scale - pt.x;
+ var dy = next.y / this.scale - pt.y;
+ var dist = dx * dx + dy * dy;
+
+ if (n == null)
+ {
+ n = new mxPoint(pt.x - last.x, pt.y - last.y);
+ len = Math.sqrt(n.x * n.x + n.y * n.y);
+
+ if (len > 0)
+ {
+ n.x = n.x * size / len;
+ n.y = n.y * size / len;
+ }
+ else
+ {
+ n = null;
+ }
+ }
+
+ if (dist > size * size && len > 0)
+ {
+ var dx = last.x - pt.x;
+ var dy = last.y - pt.y;
+ var dist = dx * dx + dy * dy;
+
+ if (dist > size * size)
+ {
+ var p0 = new mxPoint(pt.x - n.x, pt.y - n.y);
+ var p1 = new mxPoint(pt.x + n.x, pt.y + n.y);
+ pts.push(p0);
+
+ this.addPoints(c, pts, rounded, arcSize, false, null, moveTo);
+
+ var f = (Math.round(n.x) < 0 || (Math.round(n.x) == 0
+ && Math.round(n.y) <= 0)) ? 1 : -1;
+ moveTo = false;
+
+ if (style == 'sharp')
+ {
+ c.lineTo(p0.x - n.y * f, p0.y + n.x * f);
+ c.lineTo(p1.x - n.y * f, p1.y + n.x * f);
+ c.lineTo(p1.x, p1.y);
+ }
+ else if (style == 'line')
+ {
+ c.moveTo(p0.x + n.y * f, p0.y - n.x * f);
+ c.lineTo(p0.x - n.y * f, p0.y + n.x * f);
+ c.moveTo(p1.x - n.y * f, p1.y + n.x * f);
+ c.lineTo(p1.x + n.y * f, p1.y - n.x * f);
+ c.moveTo(p1.x, p1.y);
+ }
+ else if (style == 'arc')
+ {
+ f *= 1.3;
+ c.curveTo(p0.x - n.y * f, p0.y + n.x * f,
+ p1.x - n.y * f, p1.y + n.x * f,
+ p1.x, p1.y);
+ }
+ else
+ {
+ c.moveTo(p1.x, p1.y);
+ moveTo = true;
+ }
+
+ pts = [p1];
+ done = true;
+ }
+ }
+ }
+ else
+ {
+ n = null;
+ }
+
+ if (!done)
+ {
+ pts.push(pt);
+ last = pt;
+ }
+ }
+
+ this.addPoints(c, pts, rounded, arcSize, false, null, moveTo);
+ c.stroke();
+ }
+ };
+
+ /**
+ * Adds support for centerPerimeter which is a special case of a fixed point perimeter.
+ */
+ var mxGraphViewGetFixedTerminalPoint = mxGraphView.prototype.getFixedTerminalPoint;
+
+ mxGraphView.prototype.getFixedTerminalPoint = function(edge, terminal, source, constraint)
+ {
+ if (terminal != null && terminal.style[mxConstants.STYLE_PERIMETER] == 'centerPerimeter')
+ {
+ return new mxPoint(terminal.getCenterX(), terminal.getCenterY());
+ }
+ else
+ {
+ return mxGraphViewGetFixedTerminalPoint.apply(this, arguments);
+ }
+ };
+
+ /**
+ * Adds support for snapToPoint style.
+ */
+ var mxGraphViewUpdateFloatingTerminalPoint = mxGraphView.prototype.updateFloatingTerminalPoint;
+
+ mxGraphView.prototype.updateFloatingTerminalPoint = function(edge, start, end, source)
+ {
+ if (start != null && edge != null &&
+ (start.style['snapToPoint'] == '1' ||
+ edge.style['snapToPoint'] == '1'))
+ {
+ start = this.getTerminalPort(edge, start, source);
+ var next = this.getNextPoint(edge, end, source);
+
+ var orth = this.graph.isOrthogonal(edge);
+ var alpha = mxUtils.toRadians(Number(start.style[mxConstants.STYLE_ROTATION] || '0'));
+ var center = new mxPoint(start.getCenterX(), start.getCenterY());
+
+ if (alpha != 0)
+ {
+ var cos = Math.cos(-alpha);
+ var sin = Math.sin(-alpha);
+ next = mxUtils.getRotatedPoint(next, cos, sin, center);
+ }
+
+ var border = parseFloat(edge.style[mxConstants.STYLE_PERIMETER_SPACING] || 0);
+ border += parseFloat(edge.style[(source) ?
+ mxConstants.STYLE_SOURCE_PERIMETER_SPACING :
+ mxConstants.STYLE_TARGET_PERIMETER_SPACING] || 0);
+ var pt = this.getPerimeterPoint(start, next, alpha == 0 && orth, border);
+
+ if (alpha != 0)
+ {
+ var cos = Math.cos(alpha);
+ var sin = Math.sin(alpha);
+ pt = mxUtils.getRotatedPoint(pt, cos, sin, center);
+ }
+
+ edge.setAbsoluteTerminalPoint(this.snapToAnchorPoint(edge, start, end, source, pt), source);
+ }
+ else
+ {
+ mxGraphViewUpdateFloatingTerminalPoint.apply(this, arguments);
+ }
+ };
+
+ mxGraphView.prototype.snapToAnchorPoint = function(edge, start, end, source, pt)
+ {
+ if (start != null && edge != null)
+ {
+ var constraints = this.graph.getAllConnectionConstraints(start)
+ var nearest = null;
+ var dist = null;
+
+ if (constraints != null)
+ {
+ for (var i = 0; i < constraints.length; i++)
+ {
+ var cp = this.graph.getConnectionPoint(start, constraints[i]);
+
+ if (cp != null)
+ {
+ var tmp = (cp.x - pt.x) * (cp.x - pt.x) + (cp.y - pt.y) * (cp.y - pt.y);
+
+ if (dist == null || tmp < dist)
+ {
+ nearest = cp;
+ dist = tmp;
+ }
+ }
+ }
+ }
+
+ if (nearest != null)
+ {
+ pt = nearest;
+ }
+ }
+
+ return pt;
+ };
+
+ /**
+ * Adds support for placeholders in text elements of shapes.
+ */
+ var mxStencilEvaluateTextAttribute = mxStencil.prototype.evaluateTextAttribute;
+
+ mxStencil.prototype.evaluateTextAttribute = function(node, attribute, shape)
+ {
+ var result = mxStencilEvaluateTextAttribute.apply(this, arguments);
+ var placeholders = node.getAttribute('placeholders');
+
+ if (placeholders == '1' && shape.state != null)
+ {
+ result = shape.state.view.graph.replacePlaceholders(shape.state.cell, result);
+ }
+
+ return result;
+ };
+
+ /**
+ * Adds custom stencils defined via shape=stencil(value) style. The value is a base64 encoded, compressed and
+ * URL encoded XML definition of the shape according to the stencil definition language of mxGraph.
+ *
+ * Needs to be in this file to make sure its part of the embed client code. Also the check for ZLib is
+ * different than for the Editor code.
+ */
+ var mxCellRendererCreateShape = mxCellRenderer.prototype.createShape;
+ mxCellRenderer.prototype.createShape = function(state)
+ {
+ if (state.style != null && typeof(pako) !== 'undefined')
+ {
+ var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
+
+ // Extracts and decodes stencil XML if shape has the form shape=stencil(value)
+ if (shape != null && typeof shape === 'string' && shape.substring(0, 8) == 'stencil(')
+ {
+ try
+ {
+ var stencil = shape.substring(8, shape.length - 1);
+ var doc = mxUtils.parseXml(Graph.decompress(stencil));
+
+ return new mxShape(new mxStencil(doc.documentElement));
+ }
+ catch (e)
+ {
+ if (window.console != null)
+ {
+ console.log('Error in shape: ' + e);
+ }
+ }
+ }
+ }
+
+ return mxCellRendererCreateShape.apply(this, arguments);
+ };
+})();
+
+/**
+ * Overrides stencil registry for dynamic loading of stencils.
+ */
+/**
+ * Maps from library names to an array of Javascript filenames,
+ * which are synchronously loaded. Currently only stencil files
+ * (.xml) and JS files (.js) are supported.
+ * IMPORTANT: For embedded diagrams to work entries must also
+ * be added in EmbedServlet.java.
+ */
+mxStencilRegistry.libraries = {};
+
+/**
+ * Global switch to disable dynamic loading.
+ */
+mxStencilRegistry.dynamicLoading = true;
+
+/**
+ * Global switch to disable eval for JS (preload all JS instead).
+ */
+mxStencilRegistry.allowEval = true;
+
+/**
+ * Stores all package names that have been dynamically loaded.
+ * Each package is only loaded once.
+ */
+mxStencilRegistry.packages = [];
+
+/**
+ * Stores all package names that have been dynamically loaded.
+ * Each package is only loaded once.
+ */
+mxStencilRegistry.filesLoaded = {};
+
+// Extends the default stencil registry to add dynamic loading
+mxStencilRegistry.getStencil = function(name)
+{
+ var result = mxStencilRegistry.stencils[name];
+
+ if (result == null && mxCellRenderer.defaultShapes[name] == null && mxStencilRegistry.dynamicLoading)
+ {
+ var basename = mxStencilRegistry.getBasenameForStencil(name);
+
+ // Loads stencil files and tries again
+ if (basename != null)
+ {
+ var libs = mxStencilRegistry.libraries[basename];
+
+ if (libs != null)
+ {
+ if (mxStencilRegistry.packages[basename] == null)
+ {
+ for (var i = 0; i < libs.length; i++)
+ {
+ var fname = libs[i];
+
+ if (!mxStencilRegistry.filesLoaded[fname])
+ {
+ mxStencilRegistry.filesLoaded[fname] = true;
+
+ if (fname.toLowerCase().substring(fname.length - 4, fname.length) == '.xml')
+ {
+ mxStencilRegistry.loadStencilSet(fname, null);
+ }
+ else if (fname.toLowerCase().substring(fname.length - 3, fname.length) == '.js')
+ {
+ try
+ {
+ if (mxStencilRegistry.allowEval)
+ {
+ var req = mxUtils.load(fname);
+
+ if (req != null && req.getStatus() >= 200 && req.getStatus() <= 299)
+ {
+ eval.call(window, req.getText());
+ }
+ }
+ }
+ catch (e)
+ {
+ if (window.console != null)
+ {
+ console.log('error in getStencil:', name, basename, libs, fname, e);
+ }
+ }
+ }
+ else
+ {
+ // FIXME: This does not yet work as the loading is triggered after
+ // the shape was used in the graph, at which point the keys have
+ // typically been translated in the calling method.
+ //mxResources.add(fname);
+ }
+ }
+ }
+
+ mxStencilRegistry.packages[basename] = 1;
+ }
+ }
+ else
+ {
+ // Replaces '_-_' with '_'
+ basename = basename.replace('_-_', '_');
+ mxStencilRegistry.loadStencilSet(STENCIL_PATH + '/' + basename + '.xml', null);
+ }
+
+ result = mxStencilRegistry.stencils[name];
+ }
+ }
+
+ return result;
+};
+
+// Returns the basename for the given stencil or null if no file must be
+// loaded to render the given stencil.
+mxStencilRegistry.getBasenameForStencil = function(name)
+{
+ var tmp = null;
+
+ if (name != null && typeof name === 'string')
+ {
+ var parts = name.split('.');
+
+ if (parts.length > 0 && parts[0] == 'mxgraph')
+ {
+ tmp = parts[1];
+
+ for (var i = 2; i < parts.length - 1; i++)
+ {
+ tmp += '/' + parts[i];
+ }
+ }
+ }
+
+ return tmp;
+};
+
+// Loads the given stencil set
+mxStencilRegistry.loadStencilSet = function(stencilFile, postStencilLoad, force, async)
+{
+ force = (force != null) ? force : false;
+
+ // Uses additional cache for detecting previous load attempts
+ var xmlDoc = mxStencilRegistry.packages[stencilFile];
+
+ if (force || xmlDoc == null)
+ {
+ var install = false;
+
+ if (xmlDoc == null)
+ {
+ try
+ {
+ if (async)
+ {
+ mxStencilRegistry.loadStencil(stencilFile, mxUtils.bind(this, function(xmlDoc2)
+ {
+ if (xmlDoc2 != null && xmlDoc2.documentElement != null)
+ {
+ mxStencilRegistry.packages[stencilFile] = xmlDoc2;
+ install = true;
+ mxStencilRegistry.parseStencilSet(xmlDoc2.documentElement, postStencilLoad, install);
+ }
+ }));
+
+ return;
+ }
+ else
+ {
+ xmlDoc = mxStencilRegistry.loadStencil(stencilFile);
+ mxStencilRegistry.packages[stencilFile] = xmlDoc;
+ install = true;
+ }
+ }
+ catch (e)
+ {
+ if (window.console != null)
+ {
+ console.log('error in loadStencilSet:', stencilFile, e);
+ }
+ }
+ }
+
+ if (xmlDoc != null && xmlDoc.documentElement != null)
+ {
+ mxStencilRegistry.parseStencilSet(xmlDoc.documentElement, postStencilLoad, install);
+ }
+ }
+};
+
+// Loads the given stencil XML file.
+mxStencilRegistry.loadStencil = function(filename, fn)
+{
+ if (fn != null)
+ {
+ var req = mxUtils.get(filename, mxUtils.bind(this, function(req)
+ {
+ fn((req.getStatus() >= 200 && req.getStatus() <= 299) ? req.getXml() : null);
+ }), mxUtils.bind(this, function(req)
+ {
+ fn(null);
+ }));
+ }
+ else
+ {
+ return mxUtils.load(filename).getXml();
+ }
+};
+
+// Takes array of strings
+mxStencilRegistry.parseStencilSets = function(stencils)
+{
+ for (var i = 0; i < stencils.length; i++)
+ {
+ mxStencilRegistry.parseStencilSet(mxUtils.parseXml(stencils[i]).documentElement);
+ }
+};
+
+// Parses the given stencil set
+mxStencilRegistry.parseStencilSet = function(root, postStencilLoad, install)
+{
+ if (root.nodeName == 'stencils')
+ {
+ var shapes = root.firstChild;
+
+ while (shapes != null)
+ {
+ if (shapes.nodeName == 'shapes')
+ {
+ mxStencilRegistry.parseStencilSet(shapes, postStencilLoad, install);
+ }
+
+ shapes = shapes.nextSibling;
+ }
+ }
+ else
+ {
+ install = (install != null) ? install : true;
+ var shape = root.firstChild;
+ var packageName = '';
+ var name = root.getAttribute('name');
+
+ if (name != null)
+ {
+ packageName = name + '.';
+ }
+
+ while (shape != null)
+ {
+ if (shape.nodeType == mxConstants.NODETYPE_ELEMENT)
+ {
+ name = shape.getAttribute('name');
+
+ if (name != null)
+ {
+ packageName = packageName.toLowerCase();
+ var stencilName = name.replace(/ /g,"_");
+
+ if (install)
+ {
+ mxStencilRegistry.addStencil(packageName + stencilName.toLowerCase(), new mxStencil(shape));
+ }
+
+ if (postStencilLoad != null)
+ {
+ var w = shape.getAttribute('w');
+ var h = shape.getAttribute('h');
+
+ w = (w == null) ? 80 : parseInt(w, 10);
+ h = (h == null) ? 80 : parseInt(h, 10);
+
+ postStencilLoad(packageName, stencilName, name, w, h);
+ }
+ }
+ }
+
+ shape = shape.nextSibling;
+ }
+ }
+};
+
+/**
+ * These overrides are only added if mxVertexHandler is defined (ie. not in embedded graph)
+ */
+if (typeof mxVertexHandler !== 'undefined')
+{
+ (function()
+ {
+ // Sets colors for handles
+ mxConstants.HANDLE_FILLCOLOR = '#29b6f2';
+ mxConstants.HANDLE_STROKECOLOR = '#0088cf';
+ mxConstants.VERTEX_SELECTION_COLOR = '#00a8ff';
+ mxConstants.OUTLINE_COLOR = '#00a8ff';
+ mxConstants.OUTLINE_HANDLE_FILLCOLOR = '#99ccff';
+ mxConstants.OUTLINE_HANDLE_STROKECOLOR = '#00a8ff';
+ mxConstants.CONNECT_HANDLE_FILLCOLOR = '#cee7ff';
+ mxConstants.EDGE_SELECTION_COLOR = '#00a8ff';
+ mxConstants.DEFAULT_VALID_COLOR = '#00a8ff';
+ mxConstants.LABEL_HANDLE_FILLCOLOR = '#cee7ff';
+ mxConstants.GUIDE_COLOR = '#0088cf';
+ mxConstants.HIGHLIGHT_STROKEWIDTH = 5;
+ mxConstants.HIGHLIGHT_OPACITY = 50;
+ mxConstants.HIGHLIGHT_SIZE = 5;
+
+ // Sets window decoration icons
+ mxWindow.prototype.closeImage = Graph.createSvgImage(18, 10,
+ '').src;
+ mxWindow.prototype.minimizeImage = Graph.createSvgImage(14, 10,
+ '').src;
+ mxWindow.prototype.normalizeImage = Graph.createSvgImage(14, 10,
+ '').src;
+ mxWindow.prototype.resizeImage = Graph.createSvgImage(10, 10,
+ '').src;
+
+ // Enables snapping to off-grid terminals for edge waypoints
+ mxEdgeHandler.prototype.snapToTerminals = true;
+
+ // Enables guides
+ mxGraphHandler.prototype.guidesEnabled = true;
+
+ // Removes parents where all child cells are moved out
+ mxGraphHandler.prototype.removeEmptyParents = true;
+
+ // Enables fading of rubberband
+ mxRubberband.prototype.fadeOut = true;
+
+ // Alt-move disables guides
+ mxGuide.prototype.isEnabledForEvent = function(evt)
+ {
+ return !mxEvent.isAltDown(evt);
+ };
+
+ // Ignores all table cells in layouts
+ var graphLayoutIsVertexIgnored = mxGraphLayout.prototype.isVertexIgnored;
+ mxGraphLayout.prototype.isVertexIgnored = function(vertex)
+ {
+ return graphLayoutIsVertexIgnored.apply(this, arguments) ||
+ this.graph.isTableRow(vertex) || this.graph.isTableCell(vertex);
+ };
+
+ // Adds support for ignoreEdge style
+ var graphLayoutIsEdgeIgnored = mxGraphLayout.prototype.isEdgeIgnored;
+ mxGraphLayout.prototype.isEdgeIgnored = function(edge)
+ {
+ return graphLayoutIsEdgeIgnored.apply(this, arguments) ||
+ this.graph.isEdgeIgnored(edge);
+ };
+
+ // Extends connection handler to enable ctrl+drag for cloning source cell
+ // since copyOnConnect is now disabled by default
+ var mxConnectionHandlerCreateTarget = mxConnectionHandler.prototype.isCreateTarget;
+ mxConnectionHandler.prototype.isCreateTarget = function(evt)
+ {
+ return this.graph.isCloneEvent(evt) != mxConnectionHandlerCreateTarget.apply(this, arguments);
+ };
+
+ // Overrides highlight shape for connection points
+ mxConstraintHandler.prototype.createHighlightShape = function()
+ {
+ var hl = new mxEllipse(null, this.highlightColor, this.highlightColor, 0);
+ hl.opacity = mxConstants.HIGHLIGHT_OPACITY;
+
+ return hl;
+ };
+
+ // Overrides edge preview to use current edge shape and default style
+ mxConnectionHandler.prototype.livePreview = true;
+ mxConnectionHandler.prototype.cursor = 'crosshair';
+
+ // Uses current edge style for connect preview
+ mxConnectionHandler.prototype.createEdgeState = function(me)
+ {
+ var style = this.graph.createCurrentEdgeStyle();
+ var edge = this.graph.createEdge(null, null, null, null, null, style);
+ var state = new mxCellState(this.graph.view, edge, this.graph.getCellStyle(edge));
+
+ for (var key in this.graph.currentEdgeStyle)
+ {
+ state.style[key] = this.graph.currentEdgeStyle[key];
+ }
+
+ // Applies newEdgeStyle for preview
+ if (this.previous != null)
+ {
+ var temp = this.previous.style['newEdgeStyle'];
+
+ if (temp != null)
+ {
+ try
+ {
+ var styles = JSON.parse(temp);
+
+ for (var key in styles)
+ {
+ state.style[key] = styles[key];
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+ }
+ }
+
+ state.style = this.graph.postProcessCellStyle(state.cell, state.style);
+
+ return state;
+ };
+
+ // Overrides dashed state with current edge style
+ var connectionHandlerCreateShape = mxConnectionHandler.prototype.createShape;
+ mxConnectionHandler.prototype.createShape = function()
+ {
+ var shape = connectionHandlerCreateShape.apply(this, arguments);
+
+ shape.isDashed = this.graph.currentEdgeStyle[mxConstants.STYLE_DASHED] == '1';
+
+ return shape;
+ }
+
+ // Overrides live preview to keep current style
+ mxConnectionHandler.prototype.updatePreview = function(valid)
+ {
+ // do not change color of preview
+ };
+
+ // Overrides connection handler to ignore edges instead of not allowing connections
+ var mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker;
+ mxConnectionHandler.prototype.createMarker = function()
+ {
+ var marker = mxConnectionHandlerCreateMarker.apply(this, arguments);
+
+ var markerGetCell = marker.getCell;
+ marker.getCell = mxUtils.bind(this, function(me)
+ {
+ var result = markerGetCell.apply(this, arguments);
+
+ this.error = null;
+
+ return result;
+ });
+
+ return marker;
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.defaultVertexStyle = {};
+
+ /**
+ * Contains the default style for edges.
+ */
+ Graph.prototype.defaultEdgeStyle = {'edgeStyle': 'orthogonalEdgeStyle', 'rounded': '0',
+ 'jettySize': 'auto', 'orthogonalLoop': '1'};
+
+ /**
+ * Returns the current edge style as a string.
+ */
+ Graph.prototype.createCurrentEdgeStyle = function()
+ {
+ var style = 'edgeStyle=' + (this.currentEdgeStyle['edgeStyle'] || 'none') + ';';
+ var keys = ['shape', 'curved', 'rounded', 'comic', 'sketch', 'fillWeight', 'hachureGap',
+ 'hachureAngle', 'jiggle', 'disableMultiStroke', 'disableMultiStrokeFill', 'fillStyle',
+ 'curveFitting', 'simplification', 'comicStyle', 'jumpStyle', 'jumpSize'];
+
+ for (var i = 0; i < keys.length; i++)
+ {
+ if (this.currentEdgeStyle[keys[i]] != null)
+ {
+ style += keys[i] + '=' + this.currentEdgeStyle[keys[i]] + ';';
+ }
+ }
+
+ // Overrides the global default to match the default edge style
+ if (this.currentEdgeStyle['orthogonalLoop'] != null)
+ {
+ style += 'orthogonalLoop=' + this.currentEdgeStyle['orthogonalLoop'] + ';';
+ }
+ else if (Graph.prototype.defaultEdgeStyle['orthogonalLoop'] != null)
+ {
+ style += 'orthogonalLoop=' + Graph.prototype.defaultEdgeStyle['orthogonalLoop'] + ';';
+ }
+
+ // Overrides the global default to match the default edge style
+ if (this.currentEdgeStyle['jettySize'] != null)
+ {
+ style += 'jettySize=' + this.currentEdgeStyle['jettySize'] + ';';
+ }
+ else if (Graph.prototype.defaultEdgeStyle['jettySize'] != null)
+ {
+ style += 'jettySize=' + Graph.prototype.defaultEdgeStyle['jettySize'] + ';';
+ }
+
+ // Special logic for custom property of elbowEdgeStyle
+ if (this.currentEdgeStyle['edgeStyle'] == 'elbowEdgeStyle' && this.currentEdgeStyle['elbow'] != null)
+ {
+ style += 'elbow=' + this.currentEdgeStyle['elbow'] + ';';
+ }
+
+ if (this.currentEdgeStyle['html'] != null)
+ {
+ style += 'html=' + this.currentEdgeStyle['html'] + ';';
+ }
+ else
+ {
+ style += 'html=1;';
+ }
+
+ return style;
+ };
+
+ /**
+ * Hook for subclassers.
+ */
+ Graph.prototype.getPagePadding = function()
+ {
+ return new mxPoint(0, 0);
+ };
+
+ /**
+ * Loads the stylesheet for this graph.
+ */
+ Graph.prototype.loadStylesheet = function()
+ {
+ var node = (this.themes != null) ? this.themes[this.defaultThemeName] :
+ (!mxStyleRegistry.dynamicLoading) ? null :
+ mxUtils.load(STYLE_PATH + '/default.xml').getDocumentElement();
+
+ if (node != null)
+ {
+ var dec = new mxCodec(node.ownerDocument);
+ dec.decode(node, this.getStylesheet());
+ }
+ };
+
+ /**
+ * Creates lookup from object IDs to cell IDs.
+ */
+ Graph.prototype.createCellLookup = function(cells, lookup)
+ {
+ lookup = (lookup != null) ? lookup : new Object();
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = cells[i];
+ lookup[mxObjectIdentity.get(cell)] = cell.getId();
+ var childCount = this.model.getChildCount(cell);
+
+ for (var j = 0; j < childCount; j++)
+ {
+ this.createCellLookup([this.model.getChildAt(cell, j)], lookup);
+ }
+ }
+
+ return lookup;
+ };
+
+ /**
+ * Creates lookup from original to cloned cell IDs where mapping is
+ * the mapping used in cloneCells and lookup is a mapping from
+ * object IDs to cell IDs.
+ */
+ Graph.prototype.createCellMapping = function(mapping, lookup, cellMapping)
+ {
+ cellMapping = (cellMapping != null) ? cellMapping : new Object();
+
+ for (var objectId in mapping)
+ {
+ var cellId = lookup[objectId];
+
+ if (cellMapping[cellId] == null)
+ {
+ // Uses empty string if clone ID was null which means
+ // the cell was cloned but not inserted into the model.
+ cellMapping[cellId] = mapping[objectId].getId() || '';
+ }
+ }
+
+ return cellMapping;
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.importGraphModel = function(node, dx, dy, crop)
+ {
+ dx = (dx != null) ? dx : 0;
+ dy = (dy != null) ? dy : 0;
+
+ var codec = new mxCodec(node.ownerDocument);
+ var tempModel = new mxGraphModel();
+ codec.decode(node, tempModel);
+ var cells = []
+
+ // Clones cells to remove invalid edges
+ var cloneMap = new Object();
+ var cellMapping = new Object();
+ var layers = tempModel.getChildren(this.cloneCell(tempModel.root,
+ this.isCloneInvalidEdges(), cloneMap));
+
+ if (layers != null)
+ {
+ // Creates lookup from object IDs to cell IDs
+ var lookup = this.createCellLookup([tempModel.root]);
+
+ // Uses copy as layers are removed from array inside loop
+ layers = layers.slice();
+
+ this.model.beginUpdate();
+ try
+ {
+ // Merges into unlocked current layer if one layer is pasted
+ if (layers.length == 1 && !this.isCellLocked(this.getDefaultParent()))
+ {
+ var children = tempModel.getChildren(layers[0]);
+
+ if (children != null)
+ {
+ cells = this.moveCells(children,
+ dx, dy, false, this.getDefaultParent());
+
+ // Imported default parent maps to local default parent
+ cellMapping[tempModel.getChildAt(tempModel.root, 0).getId()] =
+ this.getDefaultParent().getId();
+ }
+ }
+ else
+ {
+ for (var i = 0; i < layers.length; i++)
+ {
+ var children = this.model.getChildren(this.moveCells(
+ [layers[i]], dx, dy, false, this.model.getRoot())[0]);
+
+ if (children != null)
+ {
+ cells = cells.concat(children);
+ }
+ }
+ }
+
+ if (cells != null)
+ {
+ // Adds mapping for all cloned entries from imported to local cell ID
+ this.createCellMapping(cloneMap, lookup, cellMapping);
+ this.updateCustomLinks(cellMapping, cells);
+
+ if (crop)
+ {
+ if (this.isGridEnabled())
+ {
+ dx = this.snap(dx);
+ dy = this.snap(dy);
+ }
+
+ var bounds = this.getBoundingBoxFromGeometry(cells, true);
+
+ if (bounds != null)
+ {
+ this.moveCells(cells, dx - bounds.x, dy - bounds.y);
+ }
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ }
+
+ return cells;
+ };
+
+ /**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+ Graph.prototype.encodeCells = function(cells)
+ {
+ var cloneMap = new Object();
+ var clones = this.cloneCells(cells, null, cloneMap);
+
+ // Creates a dictionary for fast lookups
+ var dict = new mxDictionary();
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ dict.put(cells[i], true);
+ }
+
+ var codec = new mxCodec();
+ var model = new mxGraphModel();
+ var parent = model.getChildAt(model.getRoot(), 0);
+
+ for (var i = 0; i < clones.length; i++)
+ {
+ model.add(parent, clones[i]);
+
+ // Checks for orphaned relative children and makes absolute
+ var state = this.view.getState(cells[i]);
+
+ if (state != null)
+ {
+ var geo = this.getCellGeometry(clones[i]);
+
+ if (geo != null && geo.relative && !this.model.isEdge(cells[i]) &&
+ dict.get(this.model.getParent(cells[i])) == null)
+ {
+ geo.offset = null;
+ geo.relative = false;
+ geo.x = state.x / state.view.scale - state.view.translate.x;
+ geo.y = state.y / state.view.scale - state.view.translate.y;
+ }
+ }
+ }
+
+ this.updateCustomLinks(this.createCellMapping(cloneMap,
+ this.createCellLookup(cells)), clones);
+
+ return codec.encode(model);
+ };
+
+ /**
+ * Overridden to use table cell instead of table as parent.
+ */
+ Graph.prototype.isSwimlane = function(cell, ignoreState)
+ {
+ var shape = null;
+
+ if (cell != null && !this.model.isEdge(cell) &&
+ this.model.getParent(cell) !=
+ this.model.getRoot())
+ {
+ var style = this.getCurrentCellStyle(cell, ignoreState)
+ shape = style[mxConstants.STYLE_SHAPE];
+ }
+
+ return shape == mxConstants.SHAPE_SWIMLANE ||
+ shape == 'table' || shape == 'tableRow';
+ };
+
+ /**
+ * Overridden to check table cells and rows.
+ */
+ var graphIsCellEditable = Graph.prototype.isCellEditable;
+ Graph.prototype.isCellEditable = function(cell)
+ {
+ if (cell == null || !graphIsCellEditable.apply(this, arguments))
+ {
+ return false;
+ }
+ else if (this.isTableCell(cell) || this.isTableRow(cell))
+ {
+ return this.isCellEditable(this.model.getParent(cell));
+ }
+ else
+ {
+ return true;
+ }
+ };
+
+ /**
+ * Overridden to check table cells and rows.
+ */
+ var graphIsCellMovable = Graph.prototype.isCellMovable;
+ Graph.prototype.isCellMovable = function(cell)
+ {
+ if (cell == null || !graphIsCellMovable.apply(this, arguments))
+ {
+ return false;
+ }
+ else if (this.isTableCell(cell) || this.isTableRow(cell))
+ {
+ return this.isCellMovable(this.model.getParent(cell));
+ }
+ else
+ {
+ return true;
+ }
+ };
+
+ /**
+ * Overridden to add expand style.
+ */
+ var graphIsExtendParent = Graph.prototype.isExtendParent;
+ Graph.prototype.isExtendParent = function(cell)
+ {
+ var parent = this.model.getParent(cell);
+
+ if (parent != null)
+ {
+ var style = this.getCurrentCellStyle(parent);
+
+ if (style['expand'] != null)
+ {
+ return style['expand'] != '0';
+ }
+ }
+
+ return graphIsExtendParent.apply(this, arguments) &&
+ (parent == null || !this.isTable(parent));
+ };
+
+ /**
+ * Overridden to use table cell instead of table as parent.
+ */
+ var graphSplitEdge = Graph.prototype.splitEdge;
+ Graph.prototype.splitEdge = function(edge, cells, newEdge, dx, dy, x, y, parent)
+ {
+ if (parent == null)
+ {
+ parent = this.model.getParent(edge);
+
+ if (this.isTable(parent) || this.isTableRow(parent))
+ {
+ parent = this.getCellAt(x, y, null, true, false);
+ }
+ }
+
+ var newEdge = null;
+
+ this.model.beginUpdate();
+ try
+ {
+ var newEdge = graphSplitEdge.apply(this, [edge, cells, newEdge, dx, dy, x, y, parent]);
+
+ // Removes cloned value on first segment
+ this.model.setValue(newEdge, '');
+
+ // Removes child labels on first or second segment depending on coordinate
+ // LATER: Split and reposition labels based on x and y
+ var sourceLabels = this.getChildCells(newEdge, true);
+
+ for (var i = 0; i < sourceLabels.length; i++)
+ {
+ var geo = this.getCellGeometry(sourceLabels[i]);
+
+ if (geo != null && geo.relative && geo.x > 0)
+ {
+ this.model.remove(sourceLabels[i]);
+ }
+ }
+
+ var targetLabels = this.getChildCells(edge, true);
+
+ for (var i = 0; i < targetLabels.length; i++)
+ {
+ var geo = this.getCellGeometry(targetLabels[i]);
+
+ if (geo != null && geo.relative && geo.x <= 0)
+ {
+ this.model.remove(targetLabels[i]);
+ }
+ }
+
+ // Removes entryX/Y and exitX/Y if snapToPoint is used
+ var target = this.model.getTerminal(newEdge, false);
+
+ if (target != null)
+ {
+ var style = this.getCurrentCellStyle(target);
+
+ if (style != null && style['snapToPoint'] == '1')
+ {
+ this.setCellStyles(mxConstants.STYLE_EXIT_X, null, [edge]);
+ this.setCellStyles(mxConstants.STYLE_EXIT_Y, null, [edge]);
+ this.setCellStyles(mxConstants.STYLE_ENTRY_X, null, [newEdge]);
+ this.setCellStyles(mxConstants.STYLE_ENTRY_Y, null, [newEdge]);
+ }
+ }
+
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ return newEdge;
+ };
+
+ /**
+ * Overridden to flatten cell hierarchy for selecting next and previous.
+ */
+ var graphSelectCell = Graph.prototype.selectCell;
+ Graph.prototype.selectCell = function(isNext, isParent, isChild)
+ {
+ if (isParent || isChild)
+ {
+ graphSelectCell.apply(this, arguments);
+ }
+ else
+ {
+ var cell = this.getSelectionCell();
+ var index = null;
+ var cells = [];
+
+ // LATER: Reverse traverse order for !isNext
+ var flatten = mxUtils.bind(this, function(temp)
+ {
+ if (this.view.getState(temp) != null &&
+ (this.model.isVertex(temp) ||
+ this.model.isEdge(temp)))
+ {
+ cells.push(temp);
+
+ if (temp == cell)
+ {
+ index = cells.length - 1;
+ }
+ else if ((isNext && cell == null && cells.length > 0) ||
+ (index != null && ((isNext && cells.length > index)) ||
+ (!isNext && index > 0)))
+ {
+ return;
+ }
+ }
+
+ for (var i = 0; i < this.model.getChildCount(temp); i++)
+ {
+ flatten(this.model.getChildAt(temp, i));
+ }
+ });
+
+ flatten(this.model.root);
+
+ if (cells.length > 0)
+ {
+ if (index != null)
+ {
+ index = mxUtils.mod(index + ((isNext) ? 1 : -1), cells.length)
+ }
+ else
+ {
+ index = 0;
+ }
+
+ this.setSelectionCell(cells[index]);
+ }
+ }
+ };
+
+ /**
+ * Swaps the given shapes.
+ */
+ Graph.prototype.swapShapes = function(cells, dx, dy, clone, target, evt, mapping)
+ {
+ var result = false;
+
+ if (!clone && target != null && cells.length == 1)
+ {
+ var targetState = this.view.getState(target);
+ var sourceState = this.view.getState(cells[0]);
+
+ if (targetState != null && sourceState != null &&
+ (evt != null && mxEvent.isShiftDown(evt)))
+ {
+ var g1 = this.getCellGeometry(target);
+ var g2 = this.getCellGeometry(cells[0]);
+
+ if (g1 != null && g2 != null)
+ {
+ var ng1 = g1.clone();
+ var ng2 = g2.clone();
+ ng2.x = ng1.x;
+ ng2.y = ng1.y;
+ ng1.x = g2.x;
+ ng1.y = g2.y;
+
+ this.model.beginUpdate();
+ try
+ {
+ this.model.setGeometry(target, ng1);
+ this.model.setGeometry(cells[0], ng2);
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ result = true;
+ }
+ }
+ }
+
+ return result;
+ };
+
+ /**
+ * Overrides cloning cells in moveCells.
+ */
+ var graphMoveCells = Graph.prototype.moveCells;
+ Graph.prototype.moveCells = function(cells, dx, dy, clone, target, evt, mapping)
+ {
+ if (this.swapShapes(cells, dx, dy, clone, target, evt, mapping))
+ {
+ return cells;
+ }
+
+ mapping = (mapping != null) ? mapping : new Object();
+
+ // Replaces source tables with rows
+ if (this.isTable(target))
+ {
+ var newCells = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.isTable(cells[i]))
+ {
+ newCells = newCells.concat(this.model.getChildCells(cells[i], true).reverse());
+ }
+ else
+ {
+ newCells.push(cells[i]);
+ }
+ }
+
+ cells = newCells;
+ }
+
+ this.model.beginUpdate();
+ try
+ {
+ // Updates source and target table heights and matches
+ // column count for moving rows between tables
+ var sourceTables = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (target != null && this.isTableRow(cells[i]))
+ {
+ var parent = this.model.getParent(cells[i]);
+ var row = this.getCellGeometry(cells[i]);
+
+ if (this.isTable(parent))
+ {
+ sourceTables.push(parent);
+ }
+
+ if (parent != null && row != null &&
+ this.isTable(parent) &&
+ this.isTable(target) &&
+ (clone || parent != target))
+ {
+ if (!clone)
+ {
+ var table = this.getCellGeometry(parent);
+
+ if (table != null)
+ {
+ table = table.clone();
+ table.height -= row.height;
+ this.model.setGeometry(parent, table);
+ }
+ }
+
+ var table = this.getCellGeometry(target);
+
+ if (table != null)
+ {
+ table = table.clone();
+ table.height += row.height;
+ this.model.setGeometry(target, table);
+ }
+
+ // Matches column count
+ var rows = this.model.getChildCells(target, true);
+
+ if (rows.length > 0)
+ {
+ cells[i] = (clone) ? this.cloneCell(cells[i]) : cells[i];
+ var sourceCols = this.model.getChildCells(cells[i], true);
+ var cols = this.model.getChildCells(rows[0], true);
+ var count = cols.length - sourceCols.length;
+
+ if (count > 0)
+ {
+ for (var j = 0; j < count; j++)
+ {
+ var col = this.cloneCell(sourceCols[sourceCols.length - 1]);
+
+ if (col != null)
+ {
+ col.value = '';
+
+ this.model.add(cells[i], col);
+ }
+ }
+ }
+ else if (count < 0)
+ {
+ for (var j = 0; j > count; j--)
+ {
+ this.model.remove(sourceCols[sourceCols.length + j - 1]);
+ }
+ }
+
+ // Updates column widths
+ sourceCols = this.model.getChildCells(cells[i], true);
+
+ for (var j = 0; j < cols.length; j++)
+ {
+ var geo = this.getCellGeometry(cols[j]);
+ var geo2 = this.getCellGeometry(sourceCols[j]);
+
+ if (geo != null && geo2 != null)
+ {
+ geo2 = geo2.clone();
+ geo2.width = geo.width;
+
+ this.model.setGeometry(sourceCols[j], geo2);
+ }
+ }
+ }
+ }
+ }
+ }
+
+ var result = graphMoveCells.apply(this, arguments);
+
+ // Removes empty tables
+ for (var i = 0; i < sourceTables.length; i++)
+ {
+ if (!clone && this.model.contains(sourceTables[i]) &&
+ this.model.getChildCount(sourceTables[i]) == 0)
+ {
+ this.model.remove(sourceTables[i]);
+ }
+ }
+
+ if (clone)
+ {
+ this.updateCustomLinks(this.createCellMapping(mapping,
+ this.createCellLookup(cells)), result);
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ return result;
+ };
+
+ /**
+ * Overriddes to delete label for table cells.
+ */
+ var graphRemoveCells = Graph.prototype.removeCells;
+ Graph.prototype.removeCells = function(cells, includeEdges)
+ {
+ var result = [];
+
+ this.model.beginUpdate();
+ try
+ {
+ // Clears labels on table cells
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.isTableCell(cells[i]))
+ {
+ var row = this.model.getParent(cells[i]);
+ var table = this.model.getParent(row);
+
+ // Removes table if one cell in one row left
+ if (this.model.getChildCount(row) == 1 &&
+ this.model.getChildCount(table) == 1)
+ {
+ if (mxUtils.indexOf(cells, table) < 0 &&
+ mxUtils.indexOf(result, table) < 0)
+ {
+ result.push(table);
+ }
+ }
+ else
+ {
+ this.labelChanged(cells[i], '');
+ }
+ }
+ else
+ {
+ // Deletes table if all rows are removed
+ if (this.isTableRow(cells[i]))
+ {
+ var table = this.model.getParent(cells[i]);
+
+ if (mxUtils.indexOf(cells, table) < 0 &&
+ mxUtils.indexOf(result, table) < 0)
+ {
+ var rows = this.model.getChildCells(table, true);
+ var deleteCount = 0;
+
+ for (var j = 0; j < rows.length; j++)
+ {
+ if (mxUtils.indexOf(cells, rows[j]) >= 0)
+ {
+ deleteCount++;
+ }
+ }
+
+ if (deleteCount == rows.length)
+ {
+ result.push(table);
+ }
+ }
+ }
+
+ result.push(cells[i]);
+ }
+ }
+
+ result = graphRemoveCells.apply(this, [result, includeEdges]);
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ return result;
+ };
+
+ /**
+ * Updates cells IDs for custom links in the given cells using an
+ * optional graph to avoid changing the undo history.
+ */
+ Graph.prototype.updateCustomLinks = function(mapping, cells, graph)
+ {
+ graph = (graph != null) ? graph : new Graph();
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (cells[i] != null)
+ {
+ graph.updateCustomLinksForCell(mapping, cells[i], graph);
+ }
+ }
+ };
+
+ /**
+ * Updates cell IDs in custom links on the given cell and its label.
+ */
+ Graph.prototype.updateCustomLinksForCell = function(mapping, cell)
+ {
+ this.doUpdateCustomLinksForCell(mapping, cell);
+ var childCount = this.model.getChildCount(cell);
+
+ for (var i = 0; i < childCount; i++)
+ {
+ this.updateCustomLinksForCell(mapping,
+ this.model.getChildAt(cell, i));
+ }
+ };
+
+ /**
+ * Updates cell IDs in custom links on the given cell and its label.
+ */
+ Graph.prototype.doUpdateCustomLinksForCell = function(mapping, cell)
+ {
+ // Hook for subclassers
+ };
+
+ /**
+ * Overrides method to provide connection constraints for shapes.
+ */
+ Graph.prototype.getAllConnectionConstraints = function(terminal, source)
+ {
+ if (terminal != null)
+ {
+ var constraints = mxUtils.getValue(terminal.style, 'points', null);
+
+ if (constraints != null)
+ {
+ // Requires an array of arrays with x, y (0..1), an optional
+ // [perimeter (0 or 1), dx, and dy] eg. points=[[0,0,1,-10,10],[0,1,0],[1,1]]
+ var result = [];
+
+ try
+ {
+ var c = JSON.parse(constraints);
+
+ for (var i = 0; i < c.length; i++)
+ {
+ var tmp = c[i];
+ result.push(new mxConnectionConstraint(new mxPoint(tmp[0], tmp[1]), (tmp.length > 2) ? tmp[2] != '0' : true,
+ null, (tmp.length > 3) ? tmp[3] : 0, (tmp.length > 4) ? tmp[4] : 0));
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+
+ return result;
+ }
+ else if (terminal.shape != null && terminal.shape.bounds != null)
+ {
+ var dir = terminal.shape.direction;
+ var bounds = terminal.shape.bounds;
+ var scale = terminal.shape.scale;
+ var w = bounds.width / scale;
+ var h = bounds.height / scale;
+
+ if (dir == mxConstants.DIRECTION_NORTH || dir == mxConstants.DIRECTION_SOUTH)
+ {
+ var tmp = w;
+ w = h;
+ h = tmp;
+ }
+
+ constraints = terminal.shape.getConstraints(terminal.style, w, h);
+
+ if (constraints != null)
+ {
+ return constraints;
+ }
+ else if (terminal.shape.stencil != null && terminal.shape.stencil.constraints != null)
+ {
+ return terminal.shape.stencil.constraints;
+ }
+ else if (terminal.shape.constraints != null)
+ {
+ return terminal.shape.constraints;
+ }
+ }
+ }
+
+ return null;
+ };
+
+ /**
+ * Inverts the elbow edge style without removing existing styles.
+ */
+ Graph.prototype.flipEdge = function(edge)
+ {
+ if (edge != null)
+ {
+ var style = this.getCurrentCellStyle(edge);
+ var elbow = mxUtils.getValue(style, mxConstants.STYLE_ELBOW,
+ mxConstants.ELBOW_HORIZONTAL);
+ var value = (elbow == mxConstants.ELBOW_HORIZONTAL) ?
+ mxConstants.ELBOW_VERTICAL : mxConstants.ELBOW_HORIZONTAL;
+ this.setCellStyles(mxConstants.STYLE_ELBOW, value, [edge]);
+ }
+ };
+
+ /**
+ * Disables drill-down for non-swimlanes.
+ */
+ Graph.prototype.isValidRoot = function(cell)
+ {
+ // Counts non-relative children
+ var childCount = this.model.getChildCount(cell);
+ var realChildCount = 0;
+
+ for (var i = 0; i < childCount; i++)
+ {
+ var child = this.model.getChildAt(cell, i);
+
+ if (this.model.isVertex(child))
+ {
+ var geometry = this.getCellGeometry(child);
+
+ if (geometry != null && !geometry.relative)
+ {
+ realChildCount++;
+ }
+ }
+ }
+
+ return realChildCount > 0 || this.isContainer(cell);
+ };
+
+ /**
+ * Disables drill-down for non-swimlanes.
+ */
+ Graph.prototype.isValidDropTarget = function(cell, cells, evt)
+ {
+ var style = this.getCurrentCellStyle(cell);
+ var tables = true;
+ var rows = true;
+
+ for (var i = 0; i < cells.length && rows; i++)
+ {
+ tables = tables && this.isTable(cells[i]);
+ rows = rows && this.isTableRow(cells[i]);
+ }
+
+ return !this.isCellLocked(cell) && ((cells.length == 1 && evt != null &&
+ mxEvent.isShiftDown(evt) && !mxEvent.isControlDown(evt) &&
+ !mxEvent.isAltDown(evt)) || this.isTargetShape(cell, cells, evt) ||
+ ((mxUtils.getValue(style, 'part', '0') != '1' || this.isContainer(cell)) &&
+ mxUtils.getValue(style, 'dropTarget', '1') != '0' && (mxGraph.prototype.
+ isValidDropTarget.apply(this, arguments) || this.isContainer(cell)) &&
+ !this.isTableRow(cell) && (!this.isTable(cell) || rows || tables)));
+ };
+
+ /**
+ * Overrides createGroupCell to set the group style for new groups to 'group'.
+ */
+ Graph.prototype.createGroupCell = function()
+ {
+ var group = mxGraph.prototype.createGroupCell.apply(this, arguments);
+ group.setStyle('group');
+
+ return group;
+ };
+
+ /**
+ * Disables extending parents with stack layouts on add
+ */
+ Graph.prototype.isExtendParentsOnAdd = function(cell)
+ {
+ var result = mxGraph.prototype.isExtendParentsOnAdd.apply(this, arguments);
+
+ if (result && cell != null && this.layoutManager != null)
+ {
+ var parent = this.model.getParent(cell);
+
+ if (parent != null)
+ {
+ var layout = this.layoutManager.getLayout(parent);
+
+ if (layout != null && layout.constructor == mxStackLayout)
+ {
+ result = false;
+ }
+ }
+ }
+
+ return result;
+ };
+
+ /**
+ * Overrides autosize to add a border.
+ */
+ Graph.prototype.getPreferredSizeForCell = function(cell)
+ {
+ var result = mxGraph.prototype.getPreferredSizeForCell.apply(this, arguments);
+
+ // Adds buffer
+ if (result != null)
+ {
+ result.width += 10;
+ result.height += 4;
+
+ if (this.gridEnabled)
+ {
+ result.width = this.snap(result.width);
+ result.height = this.snap(result.height);
+ }
+ }
+
+ return result;
+ }
+
+ /**
+ * Turns the given cells and returns the changed cells.
+ */
+ Graph.prototype.turnShapes = function(cells, backwards)
+ {
+ var model = this.getModel();
+ var select = [];
+
+ model.beginUpdate();
+ try
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = cells[i];
+
+ if (model.isEdge(cell))
+ {
+ var src = model.getTerminal(cell, true);
+ var trg = model.getTerminal(cell, false);
+
+ model.setTerminal(cell, trg, true);
+ model.setTerminal(cell, src, false);
+
+ var geo = model.getGeometry(cell);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ if (geo.points != null)
+ {
+ geo.points.reverse();
+ }
+
+ var sp = geo.getTerminalPoint(true);
+ var tp = geo.getTerminalPoint(false)
+
+ geo.setTerminalPoint(sp, false);
+ geo.setTerminalPoint(tp, true);
+ model.setGeometry(cell, geo);
+
+ // Inverts constraints
+ var edgeState = this.view.getState(cell);
+ var sourceState = this.view.getState(src);
+ var targetState = this.view.getState(trg);
+
+ if (edgeState != null)
+ {
+ var sc = (sourceState != null) ? this.getConnectionConstraint(edgeState, sourceState, true) : null;
+ var tc = (targetState != null) ? this.getConnectionConstraint(edgeState, targetState, false) : null;
+
+ this.setConnectionConstraint(cell, src, true, tc);
+ this.setConnectionConstraint(cell, trg, false, sc);
+
+ // Inverts perimeter spacings
+ var temp = mxUtils.getValue(edgeState.style, mxConstants.STYLE_SOURCE_PERIMETER_SPACING);
+ this.setCellStyles(mxConstants.STYLE_SOURCE_PERIMETER_SPACING, mxUtils.getValue(
+ edgeState.style, mxConstants.STYLE_TARGET_PERIMETER_SPACING), [cell]);
+ this.setCellStyles(mxConstants.STYLE_TARGET_PERIMETER_SPACING, temp, [cell]);
+ }
+
+ select.push(cell);
+ }
+ }
+ else if (model.isVertex(cell))
+ {
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ // Rotates the size and position in the geometry
+ if (!this.isTable(cell) && !this.isTableRow(cell) &&
+ !this.isTableCell(cell) && !this.isSwimlane(cell))
+ {
+ geo = geo.clone();
+ geo.x += geo.width / 2 - geo.height / 2;
+ geo.y += geo.height / 2 - geo.width / 2;
+ var tmp = geo.width;
+ geo.width = geo.height;
+ geo.height = tmp;
+ model.setGeometry(cell, geo);
+ }
+
+ // Reads the current direction and advances by 90 degrees
+ var state = this.view.getState(cell);
+
+ if (state != null)
+ {
+ var dirs = [mxConstants.DIRECTION_EAST, mxConstants.DIRECTION_SOUTH,
+ mxConstants.DIRECTION_WEST, mxConstants.DIRECTION_NORTH];
+ var dir = mxUtils.getValue(state.style, mxConstants.STYLE_DIRECTION,
+ mxConstants.DIRECTION_EAST);
+ this.setCellStyles(mxConstants.STYLE_DIRECTION,
+ dirs[mxUtils.mod(mxUtils.indexOf(dirs, dir) +
+ ((backwards) ? -1 : 1), dirs.length)], [cell]);
+ }
+
+ select.push(cell);
+ }
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+
+ return select;
+ };
+
+ /**
+ * Returns true if the given stencil contains any placeholder text.
+ */
+ Graph.prototype.stencilHasPlaceholders = function(stencil)
+ {
+ if (stencil != null && stencil.fgNode != null)
+ {
+ var node = stencil.fgNode.firstChild;
+
+ while (node != null)
+ {
+ if (node.nodeName == 'text' && node.getAttribute('placeholders') == '1')
+ {
+ return true;
+ }
+
+ node = node.nextSibling;
+ }
+ }
+
+ return false;
+ };
+
+ /**
+ * Updates the child cells with placeholders if metadata of a
+ * cell has changed and propagates geometry changes in tables.
+ */
+ var graphProcessChange = Graph.prototype.processChange;
+ Graph.prototype.processChange = function(change)
+ {
+ if (change instanceof mxGeometryChange &&
+ (this.isTableCell(change.cell) || this.isTableRow(change.cell)) &&
+ ((change.previous == null && change.geometry != null) ||
+ (change.previous != null && !change.previous.equals(change.geometry))))
+ {
+ var cell = change.cell;
+
+ if (this.isTableCell(cell))
+ {
+ cell = this.model.getParent(cell);
+ }
+
+ if (this.isTableRow(cell))
+ {
+ cell = this.model.getParent(cell);
+ }
+
+ // Forces repaint of table with unchanged style and geometry
+ var state = this.view.getState(cell);
+
+ if (state != null && state.shape != null)
+ {
+ this.view.invalidate(cell);
+ state.shape.bounds = null;
+ }
+ }
+
+ graphProcessChange.apply(this, arguments);
+
+ if (change instanceof mxValueChange && change.cell != null &&
+ change.cell.value != null && typeof(change.cell.value) == 'object')
+ {
+ this.invalidateDescendantsWithPlaceholders(change.cell);
+ }
+ };
+
+ /**
+ * Replaces the given element with a span.
+ */
+ Graph.prototype.invalidateDescendantsWithPlaceholders = function(cell)
+ {
+ // Invalidates all descendants with placeholders
+ var desc = this.model.getDescendants(cell);
+
+ // LATER: Check if only label or tooltip have changed
+ if (desc.length > 0)
+ {
+ for (var i = 0; i < desc.length; i++)
+ {
+ var state = this.view.getState(desc[i]);
+
+ if (state != null && state.shape != null && state.shape.stencil != null &&
+ this.stencilHasPlaceholders(state.shape.stencil))
+ {
+ this.removeStateForCell(desc[i]);
+ }
+ else if (this.isReplacePlaceholders(desc[i]))
+ {
+ this.view.invalidate(desc[i], false, false);
+ }
+ }
+ }
+ };
+
+ /**
+ * Replaces the given element with a span.
+ */
+ Graph.prototype.replaceElement = function(elt, tagName)
+ {
+ var span = elt.ownerDocument.createElement((tagName != null) ? tagName : 'span');
+ var attributes = Array.prototype.slice.call(elt.attributes);
+
+ while (attr = attributes.pop())
+ {
+ span.setAttribute(attr.nodeName, attr.nodeValue);
+ }
+
+ span.innerHTML = elt.innerHTML;
+ elt.parentNode.replaceChild(span, elt);
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.processElements = function(elt, fn)
+ {
+ if (elt != null)
+ {
+ var elts = elt.getElementsByTagName('*');
+
+ for (var i = 0; i < elts.length; i++)
+ {
+ fn(elts[i]);
+ }
+ }
+ };
+
+ /**
+ * Handles label changes for XML user objects.
+ */
+ Graph.prototype.updateLabelElements = function(cells, fn, tagName)
+ {
+ cells = (cells != null) ? cells : this.getSelectionCells();
+ var div = document.createElement('div');
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ // Changes font tags inside HTML labels
+ var style = this.getCurrentCellStyle(cells[i]);
+
+ if (style != null && style['html'] == '1')
+ {
+ var label = this.convertValueToString(cells[i]);
+
+ if (label != null && label.length > 0)
+ {
+ div.innerHTML = label;
+ var elts = div.getElementsByTagName((tagName != null) ? tagName : '*');
+
+ for (var j = 0; j < elts.length; j++)
+ {
+ fn(elts[j]);
+ }
+
+ if (div.innerHTML != label)
+ {
+ this.cellLabelChanged(cells[i], div.innerHTML);
+ }
+ }
+ }
+ }
+ };
+
+ /**
+ * Handles label changes for XML user objects.
+ */
+ Graph.prototype.cellLabelChanged = function(cell, value, autoSize)
+ {
+ // Removes all illegal control characters in user input
+ value = Graph.zapGremlins(value);
+
+ this.model.beginUpdate();
+ try
+ {
+ if (cell.value != null && typeof cell.value == 'object')
+ {
+ if (this.isReplacePlaceholders(cell) &&
+ cell.getAttribute('placeholder') != null)
+ {
+ // LATER: Handle delete, name change
+ var name = cell.getAttribute('placeholder');
+ var current = cell;
+
+ while (current != null)
+ {
+ if (current == this.model.getRoot() || (current.value != null &&
+ typeof(current.value) == 'object' && current.hasAttribute(name)))
+ {
+ this.setAttributeForCell(current, name, value);
+
+ break;
+ }
+
+ current = this.model.getParent(current);
+ }
+ }
+
+ var tmp = cell.value.cloneNode(true);
+
+ if (Graph.translateDiagram && Graph.diagramLanguage != null &&
+ tmp.hasAttribute('label_' + Graph.diagramLanguage))
+ {
+ tmp.setAttribute('label_' + Graph.diagramLanguage, value);
+ }
+ else
+ {
+ tmp.setAttribute('label', value);
+ }
+
+ value = tmp;
+ }
+
+ mxGraph.prototype.cellLabelChanged.apply(this, arguments);
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ };
+
+ /**
+ * Removes transparent empty groups if all children are removed.
+ */
+ Graph.prototype.cellsRemoved = function(cells)
+ {
+ if (cells != null)
+ {
+ var dict = new mxDictionary();
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ dict.put(cells[i], true);
+ }
+
+ // LATER: Recurse up the cell hierarchy
+ var parents = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var parent = this.model.getParent(cells[i]);
+
+ if (parent != null && !dict.get(parent))
+ {
+ dict.put(parent, true);
+ parents.push(parent);
+ }
+ }
+
+ for (var i = 0; i < parents.length; i++)
+ {
+ var state = this.view.getState(parents[i]);
+
+ if (state != null && (this.model.isEdge(state.cell) ||
+ this.model.isVertex(state.cell)) &&
+ this.isCellDeletable(state.cell) &&
+ this.isTransparentState(state))
+ {
+ var allChildren = true;
+
+ for (var j = 0; j < this.model.getChildCount(state.cell) && allChildren; j++)
+ {
+ if (!dict.get(this.model.getChildAt(state.cell, j)))
+ {
+ allChildren = false;
+ }
+ }
+
+ if (allChildren)
+ {
+ cells.push(state.cell);
+ }
+ }
+ }
+ }
+
+ mxGraph.prototype.cellsRemoved.apply(this, arguments);
+ };
+
+ /**
+ * Overrides ungroup to check if group should be removed.
+ */
+ Graph.prototype.removeCellsAfterUngroup = function(cells)
+ {
+ var cellsToRemove = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.isCellDeletable(cells[i]) &&
+ this.isTransparentState(
+ this.view.getState(cells[i])))
+ {
+ cellsToRemove.push(cells[i]);
+ }
+ }
+
+ cells = cellsToRemove;
+
+ mxGraph.prototype.removeCellsAfterUngroup.apply(this, arguments);
+ };
+
+ /**
+ * Sets the link for the given cell.
+ */
+ Graph.prototype.setLinkForCell = function(cell, link)
+ {
+ this.setAttributeForCell(cell, 'link', link);
+ };
+
+ /**
+ * Sets the link for the given cell.
+ */
+ Graph.prototype.setTooltipForCell = function(cell, link)
+ {
+ var key = 'tooltip';
+
+ if (Graph.translateDiagram && Graph.diagramLanguage != null &&
+ mxUtils.isNode(cell.value) && cell.value.hasAttribute('tooltip_' + Graph.diagramLanguage))
+ {
+ key = 'tooltip_' + Graph.diagramLanguage;
+ }
+
+ this.setAttributeForCell(cell, key, link);
+ };
+
+ /**
+ * Returns the cells in the model (or given array) that have all of the
+ * given tags in their tags property.
+ */
+ Graph.prototype.getAttributeForCell = function(cell, attributeName, defaultValue)
+ {
+ var value = (cell.value != null && typeof cell.value === 'object') ?
+ cell.value.getAttribute(attributeName) : null;
+
+ return (value != null) ? value : defaultValue;
+ };
+
+ /**
+ * Sets the link for the given cell.
+ */
+ Graph.prototype.setAttributeForCell = function(cell, attributeName, attributeValue)
+ {
+ var value = null;
+
+ if (cell.value != null && typeof(cell.value) == 'object')
+ {
+ value = cell.value.cloneNode(true);
+ }
+ else
+ {
+ var doc = mxUtils.createXmlDocument();
+
+ value = doc.createElement('UserObject');
+ value.setAttribute('label', cell.value || '');
+ }
+
+ if (attributeValue != null)
+ {
+ value.setAttribute(attributeName, attributeValue);
+ }
+ else
+ {
+ value.removeAttribute(attributeName);
+ }
+
+ this.model.setValue(cell, value);
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.isTargetShape = function(target, cells, evt)
+ {
+ var shape = mxUtils.getValue(
+ this.getCurrentCellStyle(target),
+ mxConstants.STYLE_SHAPE, '');
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var shapes = mxUtils.getValue(
+ this.getCurrentCellStyle(cells[i]),
+ 'targetShapes', '').split(',');
+
+ if (mxUtils.indexOf(shapes, shape) >= 0)
+ {
+ return true;
+ }
+ }
+
+ return false;
+ };
+
+ /**
+ * Overridden to stop moving edge labels between cells.
+ */
+ var graphGetDropTarget = Graph.prototype.getDropTarget;
+ Graph.prototype.getDropTarget = function(cells, evt, cell, clone)
+ {
+ // Disables drop into group if alt is pressed
+ if (mxEvent.isAltDown(evt))
+ {
+ return null;
+ }
+
+ // Disables dragging edge labels out of edges
+ for (var i = 0; i < cells.length; i++)
+ {
+ var parent = this.model.getParent(cells[i]);
+
+ if (this.model.isEdge(parent) && mxUtils.indexOf(cells, parent) < 0)
+ {
+ return null;
+ }
+ }
+
+ var target = graphGetDropTarget.apply(this, arguments);
+
+ // Always drops rows to tables
+ var rows = true;
+
+ for (var i = 0; i < cells.length && rows; i++)
+ {
+ rows = rows && this.isTableRow(cells[i]);
+ }
+
+ if (rows)
+ {
+ if (this.isTableCell(target))
+ {
+ target = this.model.getParent(target);
+ }
+
+ if (this.isTableRow(target))
+ {
+ target = this.model.getParent(target);
+ }
+
+ if (!this.isTable(target))
+ {
+ target = null;
+ }
+ }
+
+ return target;
+ };
+
+ /**
+ * Overrides double click handling to avoid accidental inserts of new labels in dblClick below.
+ */
+ Graph.prototype.click = function(me)
+ {
+ mxGraph.prototype.click.call(this, me);
+
+ // Stores state and source for checking in dblClick
+ this.firstClickState = me.getState();
+ this.firstClickSource = me.getSource();
+ };
+
+ /**
+ * Overrides double click handling to add the tolerance and inserting text.
+ */
+ Graph.prototype.dblClick = function(evt, cell)
+ {
+ if (this.isEnabled())
+ {
+ cell = this.insertTextForEvent(evt, cell);
+ mxGraph.prototype.dblClick.call(this, evt, cell);
+ }
+ };
+
+ /**
+ * Overrides double click handling to add the tolerance and inserting text.
+ */
+ Graph.prototype.insertTextForEvent = function(evt, cell)
+ {
+ var pt = mxUtils.convertPoint(this.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt));
+
+ // Automatically adds new child cells to edges on double click
+ if (evt != null && !this.model.isVertex(cell))
+ {
+ var state = (this.model.isEdge(cell)) ? this.view.getState(cell) : null;
+ var src = mxEvent.getSource(evt);
+
+ if ((this.firstClickState == state && this.firstClickSource == src) &&
+ (state == null || (state.text == null || state.text.node == null ||
+ state.text.boundingBox == null || (!mxUtils.contains(state.text.boundingBox,
+ pt.x, pt.y) && !mxUtils.isAncestorNode(state.text.node, mxEvent.getSource(evt))))) &&
+ ((state == null && !this.isCellLocked(this.getDefaultParent())) ||
+ (state != null && !this.isCellLocked(state.cell))) &&
+ (state != null ||
+ (mxClient.IS_SVG && src == this.view.getCanvas().ownerSVGElement)))
+ {
+ if (state == null)
+ {
+ state = this.view.getState(this.getCellAt(pt.x, pt.y));
+ }
+
+ cell = this.addText(pt.x, pt.y, state);
+ }
+ }
+
+ return cell;
+ };
+
+ /**
+ * Returns a point that specifies the location for inserting cells.
+ */
+ Graph.prototype.getInsertPoint = function()
+ {
+ var gs = this.getGridSize();
+ var dx = this.container.scrollLeft / this.view.scale - this.view.translate.x;
+ var dy = this.container.scrollTop / this.view.scale - this.view.translate.y;
+
+ if (this.pageVisible)
+ {
+ var layout = this.getPageLayout();
+ var page = this.getPageSize();
+ dx = Math.max(dx, layout.x * page.width);
+ dy = Math.max(dy, layout.y * page.height);
+ }
+
+ return new mxPoint(this.snap(dx + gs), this.snap(dy + gs));
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.getFreeInsertPoint = function()
+ {
+ var view = this.view;
+ var bds = this.getGraphBounds();
+ var pt = this.getInsertPoint();
+
+ // Places at same x-coord and 2 grid sizes below existing graph
+ var x = this.snap(Math.round(Math.max(pt.x, bds.x / view.scale - view.translate.x +
+ ((bds.width == 0) ? 2 * this.gridSize : 0))));
+ var y = this.snap(Math.round(Math.max(pt.y, (bds.y + bds.height) / view.scale - view.translate.y +
+ 2 * this.gridSize)));
+
+ return new mxPoint(x, y);
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.getCenterInsertPoint = function(bbox)
+ {
+ bbox = (bbox != null) ? bbox : new mxRectangle();
+
+ if (mxUtils.hasScrollbars(this.container))
+ {
+ return new mxPoint(
+ this.snap(Math.round((this.container.scrollLeft + this.container.clientWidth / 2) /
+ this.view.scale - this.view.translate.x - bbox.width / 2)),
+ this.snap(Math.round((this.container.scrollTop + this.container.clientHeight / 2) /
+ this.view.scale - this.view.translate.y - bbox.height / 2)));
+ }
+ else
+ {
+ return new mxPoint(
+ this.snap(Math.round(this.container.clientWidth / 2 / this.view.scale -
+ this.view.translate.x - bbox.width / 2)),
+ this.snap(Math.round(this.container.clientHeight / 2 / this.view.scale -
+ this.view.translate.y - bbox.height / 2)));
+ }
+ };
+
+ /**
+ * Hook for subclassers to return true if the current insert point was defined
+ * using a mouse hover event.
+ */
+ Graph.prototype.isMouseInsertPoint = function()
+ {
+ return false;
+ };
+
+ /**
+ * Adds a new label at the given position and returns the new cell. State is
+ * an optional edge state to be used as the parent for the label. Vertices
+ * are not allowed currently as states.
+ */
+ Graph.prototype.addText = function(x, y, state)
+ {
+ // Creates a new edge label with a predefined text
+ var label = new mxCell();
+ label.value = 'Text';
+ label.geometry = new mxGeometry(0, 0, 0, 0);
+ label.vertex = true;
+ var style = 'html=1;align=center;verticalAlign=middle;resizable=0;points=[];';
+
+ if (state != null && this.model.isEdge(state.cell))
+ {
+ label.style = 'edgeLabel;' + style;
+ label.geometry.relative = true;
+ label.connectable = false;
+
+ // Resets the relative location stored inside the geometry
+ var pt2 = this.view.getRelativePoint(state, x, y);
+ label.geometry.x = Math.round(pt2.x * 10000) / 10000;
+ label.geometry.y = Math.round(pt2.y);
+
+ // Resets the offset inside the geometry to find the offset from the resulting point
+ label.geometry.offset = new mxPoint(0, 0);
+ pt2 = this.view.getPoint(state, label.geometry);
+
+ var scale = this.view.scale;
+ label.geometry.offset = new mxPoint(Math.round((x - pt2.x) / scale), Math.round((y - pt2.y) / scale));
+ }
+ else
+ {
+ var tr = this.view.translate;
+ label.style = 'text;' + style;
+ label.geometry.width = 40;
+ label.geometry.height = 20;
+ label.geometry.x = Math.round(x / this.view.scale) -
+ tr.x - ((state != null) ? state.origin.x : 0);
+ label.geometry.y = Math.round(y / this.view.scale) -
+ tr.y - ((state != null) ? state.origin.y : 0);
+ label.style += 'autosize=1;'
+ }
+
+ this.getModel().beginUpdate();
+ try
+ {
+ this.addCells([label], (state != null) ? state.cell : null);
+ this.fireEvent(new mxEventObject('textInserted', 'cells', [label]));
+
+ // Updates size of text after possible change of style via event
+ this.autoSizeCell(label);
+ }
+ finally
+ {
+ this.getModel().endUpdate();
+ }
+
+ return label;
+ };
+
+ /**
+ * Adds a handler for clicking on shapes with links. This replaces all links in labels.
+ */
+ Graph.prototype.addClickHandler = function(highlight, beforeClick, onClick)
+ {
+ // Replaces links in labels for consistent right-clicks
+ var checkLinks = mxUtils.bind(this, function()
+ {
+ var links = this.container.getElementsByTagName('a');
+
+ if (links != null)
+ {
+ for (var i = 0; i < links.length; i++)
+ {
+ var href = this.getAbsoluteUrl(links[i].getAttribute('href'));
+
+ if (href != null)
+ {
+ links[i].setAttribute('rel', this.linkRelation);
+ links[i].setAttribute('href', href);
+
+ if (beforeClick != null)
+ {
+ mxEvent.addGestureListeners(links[i], null, null, beforeClick);
+ }
+ }
+ }
+ }
+ });
+
+ this.model.addListener(mxEvent.CHANGE, checkLinks);
+ checkLinks();
+
+ var cursor = this.container.style.cursor;
+ var tol = this.getTolerance();
+ var graph = this;
+
+ var mouseListener =
+ {
+ currentState: null,
+ currentLink: null,
+ currentTarget: null,
+ highlight: (highlight != null && highlight != '' && highlight != mxConstants.NONE) ?
+ new mxCellHighlight(graph, highlight, 4) : null,
+ startX: 0,
+ startY: 0,
+ scrollLeft: 0,
+ scrollTop: 0,
+ updateCurrentState: function(me)
+ {
+ var tmp = me.sourceState;
+
+ // Gets first intersecting ancestor with link
+ if (tmp == null || graph.getLinkForCell(tmp.cell) == null)
+ {
+ var cell = graph.getCellAt(me.getGraphX(), me.getGraphY(), null, null, null, function(state, x, y)
+ {
+ return graph.getLinkForCell(state.cell) == null;
+ });
+
+ tmp = (tmp != null && !graph.model.isAncestor(cell, tmp.cell)) ? null : graph.view.getState(cell);
+ }
+
+ if (tmp != this.currentState)
+ {
+ if (this.currentState != null)
+ {
+ this.clear();
+ }
+
+ this.currentState = tmp;
+
+ if (this.currentState != null)
+ {
+ this.activate(this.currentState);
+ }
+ }
+ },
+ mouseDown: function(sender, me)
+ {
+ this.startX = me.getGraphX();
+ this.startY = me.getGraphY();
+ this.scrollLeft = graph.container.scrollLeft;
+ this.scrollTop = graph.container.scrollTop;
+
+ if (this.currentLink == null && graph.container.style.overflow == 'auto')
+ {
+ graph.container.style.cursor = 'move';
+ }
+
+ this.updateCurrentState(me);
+ },
+ mouseMove: function(sender, me)
+ {
+ if (graph.isMouseDown)
+ {
+ if (this.currentLink != null)
+ {
+ var dx = Math.abs(this.startX - me.getGraphX());
+ var dy = Math.abs(this.startY - me.getGraphY());
+
+ if (dx > tol || dy > tol)
+ {
+ this.clear();
+ }
+ }
+ }
+ else
+ {
+ // Checks for parent link
+ var linkNode = me.getSource();
+
+ while (linkNode != null && linkNode.nodeName.toLowerCase() != 'a')
+ {
+ linkNode = linkNode.parentNode;
+ }
+
+ if (linkNode != null)
+ {
+ this.clear();
+ }
+ else
+ {
+ if (graph.tooltipHandler != null && this.currentLink != null && this.currentState != null)
+ {
+ graph.tooltipHandler.reset(me, true, this.currentState);
+ }
+
+ if (this.currentState != null && (me.getState() == this.currentState || me.sourceState == null) &&
+ graph.intersects(this.currentState, me.getGraphX(), me.getGraphY()))
+ {
+ return;
+ }
+
+ this.updateCurrentState(me);
+ }
+ }
+ },
+ mouseUp: function(sender, me)
+ {
+ var source = me.getSource();
+ var evt = me.getEvent();
+
+ // Checks for parent link
+ var linkNode = source;
+
+ while (linkNode != null && linkNode.nodeName.toLowerCase() != 'a')
+ {
+ linkNode = linkNode.parentNode;
+ }
+
+ // Ignores clicks on links and collapse/expand icon
+ if (linkNode == null &&
+ (((Math.abs(this.scrollLeft - graph.container.scrollLeft) < tol &&
+ Math.abs(this.scrollTop - graph.container.scrollTop) < tol) &&
+ (me.sourceState == null || !me.isSource(me.sourceState.control))) &&
+ (((mxEvent.isLeftMouseButton(evt) || mxEvent.isMiddleMouseButton(evt)) &&
+ !mxEvent.isPopupTrigger(evt)) || mxEvent.isTouchEvent(evt))))
+ {
+ if (this.currentLink != null)
+ {
+ var blank = graph.isBlankLink(this.currentLink);
+
+ if ((this.currentLink.substring(0, 5) === 'data:' ||
+ !blank) && beforeClick != null)
+ {
+ beforeClick(evt, this.currentLink);
+ }
+
+ if (!mxEvent.isConsumed(evt))
+ {
+ var target = (this.currentTarget != null) ?
+ this.currentTarget : ((mxEvent.isMiddleMouseButton(evt)) ? '_blank' :
+ ((blank) ? graph.linkTarget : '_top'));
+
+ graph.openLink(this.currentLink, target);
+ me.consume();
+ }
+ }
+ else if (onClick != null && !me.isConsumed() &&
+ (Math.abs(this.scrollLeft - graph.container.scrollLeft) < tol &&
+ Math.abs(this.scrollTop - graph.container.scrollTop) < tol) &&
+ (Math.abs(this.startX - me.getGraphX()) < tol &&
+ Math.abs(this.startY - me.getGraphY()) < tol))
+ {
+ onClick(me.getEvent());
+ }
+ }
+
+ this.clear();
+ },
+ activate: function(state)
+ {
+ this.currentLink = graph.getAbsoluteUrl(graph.getLinkForCell(state.cell));
+
+ if (this.currentLink != null)
+ {
+ this.currentTarget = graph.getLinkTargetForCell(state.cell)
+ graph.container.style.cursor = 'pointer';
+
+ if (this.highlight != null)
+ {
+ this.highlight.highlight(state);
+ }
+ }
+ },
+ clear: function()
+ {
+ if (graph.container != null)
+ {
+ graph.container.style.cursor = cursor;
+ }
+
+ this.currentTarget = null;
+ this.currentState = null;
+ this.currentLink = null;
+
+ if (this.highlight != null)
+ {
+ this.highlight.hide();
+ }
+
+ if (graph.tooltipHandler != null)
+ {
+ graph.tooltipHandler.hide();
+ }
+ }
+ };
+
+ // Ignores built-in click handling
+ graph.click = function(me) {};
+ graph.addMouseListener(mouseListener);
+
+ mxEvent.addListener(document, 'mouseleave', function(evt)
+ {
+ mouseListener.clear();
+ });
+ };
+
+ /**
+ * Duplicates the given cells and returns the duplicates.
+ */
+ Graph.prototype.duplicateCells = function(cells, append)
+ {
+ cells = (cells != null) ? cells : this.getSelectionCells();
+ append = (append != null) ? append : true;
+
+ // Duplicates rows for table cells
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.isTableCell(cells[i]))
+ {
+ cells[i] = this.model.getParent(cells[i]);
+ }
+ }
+
+ cells = this.model.getTopmostCells(cells);
+
+ var model = this.getModel();
+ var s = this.gridSize;
+ var select = [];
+
+ model.beginUpdate();
+ try
+ {
+ var cloneMap = new Object();
+ var lookup = this.createCellLookup(cells);
+ var clones = this.cloneCells(cells, false, cloneMap, true);
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ var parent = model.getParent(cells[i]);
+
+ if (parent != null)
+ {
+ var child = this.moveCells([clones[i]], s, s, false)[0];
+ select.push(child);
+
+ if (append)
+ {
+ model.add(parent, clones[i]);
+ }
+ else
+ {
+ // Maintains child index by inserting after clone in parent
+ var index = parent.getIndex(cells[i]);
+ model.add(parent, clones[i], index + 1);
+ }
+
+ // Extends tables
+ if (this.isTable(parent))
+ {
+ var row = this.getCellGeometry(clones[i]);
+ var table = this.getCellGeometry(parent);
+
+ if (row != null && table != null)
+ {
+ table = table.clone();
+ table.height += row.height;
+ model.setGeometry(parent, table);
+ }
+ }
+ }
+ else
+ {
+ select.push(clones[i]);
+ }
+ }
+
+ // Updates custom links after inserting into the model for cells to have new IDs
+ this.updateCustomLinks(this.createCellMapping(cloneMap, lookup), clones, this);
+ this.fireEvent(new mxEventObject(mxEvent.CELLS_ADDED, 'cells', clones));
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+
+ return select;
+ };
+
+ /**
+ * Inserts the given image at the cursor in a content editable text box using
+ * the insertimage command on the document instance.
+ */
+ Graph.prototype.insertImage = function(newValue, w, h)
+ {
+ // To find the new image, we create a list of all existing links first
+ if (newValue != null && this.cellEditor.textarea != null)
+ {
+ var tmp = this.cellEditor.textarea.getElementsByTagName('img');
+ var oldImages = [];
+
+ for (var i = 0; i < tmp.length; i++)
+ {
+ oldImages.push(tmp[i]);
+ }
+
+ // LATER: Fix inserting link/image in IE8/quirks after focus lost
+ document.execCommand('insertimage', false, newValue);
+
+ // Sets size of new image
+ var newImages = this.cellEditor.textarea.getElementsByTagName('img');
+
+ if (newImages.length == oldImages.length + 1)
+ {
+ // Inverse order in favor of appended images
+ for (var i = newImages.length - 1; i >= 0; i--)
+ {
+ if (i == 0 || newImages[i] != oldImages[i - 1])
+ {
+ // Workaround for lost styles during undo and redo is using attributes
+ newImages[i].setAttribute('width', w);
+ newImages[i].setAttribute('height', h);
+
+ break;
+ }
+ }
+ }
+ }
+ };
+
+ /**
+ * Inserts the given image at the cursor in a content editable text box using
+ * the insertimage command on the document instance.
+ */
+ Graph.prototype.insertLink = function(value)
+ {
+ if (this.cellEditor.textarea != null)
+ {
+ if (value.length == 0)
+ {
+ document.execCommand('unlink', false);
+ }
+ else if (mxClient.IS_FF)
+ {
+ // Workaround for Firefox that adds a new link and removes
+ // the href from the inner link if its parent is a span is
+ // to remove all inner links inside the new outer link
+ var tmp = this.cellEditor.textarea.getElementsByTagName('a');
+ var oldLinks = [];
+
+ for (var i = 0; i < tmp.length; i++)
+ {
+ oldLinks.push(tmp[i]);
+ }
+
+ document.execCommand('createlink', false, mxUtils.trim(value));
+
+ // Finds the new link element
+ var newLinks = this.cellEditor.textarea.getElementsByTagName('a');
+
+ if (newLinks.length == oldLinks.length + 1)
+ {
+ // Inverse order in favor of appended links
+ for (var i = newLinks.length - 1; i >= 0; i--)
+ {
+ if (newLinks[i] != oldLinks[i - 1])
+ {
+ // Removes all inner links from the new link and
+ // moves the children to the inner link parent
+ var tmp = newLinks[i].getElementsByTagName('a');
+
+ while (tmp.length > 0)
+ {
+ var parent = tmp[0].parentNode;
+
+ while (tmp[0].firstChild != null)
+ {
+ parent.insertBefore(tmp[0].firstChild, tmp[0]);
+ }
+
+ parent.removeChild(tmp[0]);
+ }
+
+ break;
+ }
+ }
+ }
+ }
+ else
+ {
+ // LATER: Fix inserting link/image in IE8/quirks after focus lost
+ document.execCommand('createlink', false, mxUtils.trim(value));
+ }
+ }
+ };
+
+ /**
+ *
+ * @param cell
+ * @returns {Boolean}
+ */
+ Graph.prototype.isCellResizable = function(cell)
+ {
+ var result = mxGraph.prototype.isCellResizable.apply(this, arguments);
+ var style = this.getCurrentCellStyle(cell);
+
+ return !this.isTableCell(cell) && !this.isTableRow(cell) && (result ||
+ (mxUtils.getValue(style, mxConstants.STYLE_RESIZABLE, '1') != '0' &&
+ style[mxConstants.STYLE_WHITE_SPACE] == 'wrap'));
+ };
+
+ /**
+ * Function: distributeCells
+ *
+ * Distribuets the centers of the given cells equally along the available
+ * horizontal or vertical space.
+ *
+ * Parameters:
+ *
+ * horizontal - Boolean that specifies the direction of the distribution.
+ * cells - Optional array of to be distributed. Edges are ignored.
+ */
+ Graph.prototype.distributeCells = function(horizontal, cells, spacing)
+ {
+ if (cells == null)
+ {
+ cells = this.getSelectionCells();
+ }
+
+ if (cells != null && cells.length > 1)
+ {
+ var vertices = [];
+ var max = null;
+ var min = null;
+ var cellsSize = 0;
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.getModel().isVertex(cells[i]))
+ {
+ var state = this.view.getState(cells[i]);
+
+ if (state != null)
+ {
+ var tmp = (horizontal) ? state.getCenterX() : state.getCenterY();
+ max = (max != null) ? Math.max(max, tmp) : tmp;
+ min = (min != null) ? Math.min(min, tmp) : tmp;
+
+ if (spacing)
+ {
+ cellsSize += (horizontal) ? state.width : state.height;
+ }
+
+ vertices.push(state);
+ }
+ }
+ }
+
+ if (vertices.length > 2)
+ {
+ vertices.sort(function(a, b)
+ {
+ return (horizontal) ? a.x - b.x : a.y - b.y;
+ });
+
+ if (spacing)
+ {
+ cellsSize -= (horizontal? (vertices[0].width / 2 + vertices[vertices.length - 1].width / 2) :
+ (vertices[0].height / 2 + vertices[vertices.length - 1].height / 2))
+ }
+
+ var t = this.view.translate;
+ var s = this.view.scale;
+
+ min = min / s - ((horizontal) ? t.x : t.y);
+ max = max / s - ((horizontal) ? t.x : t.y);
+
+ this.getModel().beginUpdate();
+ try
+ {
+ var dt = (max - min - cellsSize) / (vertices.length - 1);
+ var t0 = min + (spacing? (horizontal? vertices[0].width / 2 : vertices[0].height / 2) : 0);
+
+ for (var i = 1; i < vertices.length - 1; i++)
+ {
+ var pstate = this.view.getState(this.model.getParent(vertices[i].cell));
+ var geo = this.getCellGeometry(vertices[i].cell);
+ t0 += dt;
+
+ if (geo != null && pstate != null)
+ {
+ geo = geo.clone();
+
+ if (horizontal)
+ {
+ geo.x = Math.round(t0 - (spacing? 0 : geo.width / 2)) - pstate.origin.x;
+ }
+ else
+ {
+ geo.y = Math.round(t0 - (spacing? 0 : geo.height / 2)) - pstate.origin.y;
+ }
+
+ this.getModel().setGeometry(vertices[i].cell, geo);
+ }
+
+ if (spacing)
+ {
+ t0 += horizontal? vertices[i].width : vertices[i].height;
+ }
+ }
+ }
+ finally
+ {
+ this.getModel().endUpdate();
+ }
+ }
+ }
+
+ return cells;
+ };
+
+ /**
+ * Adds meta-drag an Mac.
+ * @param evt
+ * @returns
+ */
+ Graph.prototype.isCloneEvent = function(evt)
+ {
+ return (mxClient.IS_MAC && mxEvent.isMetaDown(evt)) || mxEvent.isControlDown(evt);
+ };
+
+ /**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+ Graph.prototype.createSvgImageExport = function()
+ {
+ var exp = new mxImageExport();
+
+ // Adds hyperlinks (experimental)
+ exp.getLinkForCellState = mxUtils.bind(this, function(state, canvas)
+ {
+ return this.getLinkForCell(state.cell);
+ });
+
+ // Adds tooltips (experimental)
+ exp.getTitleForCellState = mxUtils.bind(this, function(state, canvas)
+ {
+ return Editor.convertHtmlToText(this.convertValueToTooltip(state.cell));
+ });
+
+ return exp;
+ };
+
+ /**
+ * Parses the given background image.
+ */
+ Graph.prototype.parseBackgroundImage = function(json)
+ {
+ var result = null;
+
+ if (json != null && json.length > 0)
+ {
+ var obj = JSON.parse(json);
+ result = new mxImage(obj.src, obj.width, obj.height)
+ }
+
+ return result;
+ };
+
+ /**
+ * Parses the given background image.
+ */
+ Graph.prototype.getBackgroundImageObject = function(obj)
+ {
+ return obj;
+ };
+
+ /**
+ * Translates this point by the given vector.
+ *
+ * @param {number} dx X-coordinate of the translation.
+ * @param {number} dy Y-coordinate of the translation.
+ */
+ Graph.prototype.getSvg = function(background, scale, border, nocrop, crisp,
+ ignoreSelection, showText, imgExport, linkTarget, hasShadow, incExtFonts,
+ keepTheme, exportType, cells)
+ {
+ var lookup = null;
+
+ if (cells != null)
+ {
+ lookup = new mxDictionary();
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ lookup.put(cells[i], true);
+ }
+ }
+
+ //Disable Css Transforms if it is used
+ var origUseCssTrans = this.useCssTransforms;
+
+ if (origUseCssTrans)
+ {
+ this.useCssTransforms = false;
+ this.view.revalidate();
+ this.sizeDidChange();
+ }
+
+ try
+ {
+ scale = (scale != null) ? scale : 1;
+ border = (border != null) ? border : 0;
+ crisp = (crisp != null) ? crisp : true;
+ ignoreSelection = (ignoreSelection != null) ? ignoreSelection : true;
+ showText = (showText != null) ? showText : true;
+ hasShadow = (hasShadow != null) ? hasShadow : false;
+
+ var bounds = (exportType == 'page') ? this.view.getBackgroundPageBounds() :
+ (((ignoreSelection && lookup == null) || nocrop ||
+ exportType == 'diagram') ? this.getGraphBounds() :
+ this.getBoundingBox(this.getSelectionCells()));
+ var vs = this.view.scale;
+
+ if (exportType == 'diagram' && this.backgroundImage != null)
+ {
+ bounds = mxRectangle.fromRectangle(bounds);
+ bounds.add(new mxRectangle(
+ (this.view.translate.x + this.backgroundImage.x) * vs,
+ (this.view.translate.y + this.backgroundImage.y) * vs,
+ this.backgroundImage.width * vs,
+ this.backgroundImage.height * vs));
+ }
+
+ if (bounds == null)
+ {
+ throw Error(mxResources.get('drawingEmpty'));
+ }
+
+ // Prepares SVG document that holds the output
+ var s = scale / vs;
+ var w = Math.max(1, Math.ceil(bounds.width * s) + 2 * border) +
+ ((hasShadow && border == 0) ? 5 : 0);
+ var h = Math.max(1, Math.ceil(bounds.height * s) + 2 * border) +
+ ((hasShadow && border == 0) ? 5 : 0);
+ var tmp = (crisp) ? -0.5 : 0;
+ var root = Graph.createSvgNode(tmp, tmp, w, h, background);
+ var svgDoc = root.ownerDocument;
+
+ // Renders graph. Offset will be multiplied with state's scale when painting state.
+ // TextOffset only seems to affect FF output but used everywhere for consistency.
+ var group = (svgDoc.createElementNS != null) ?
+ svgDoc.createElementNS(mxConstants.NS_SVG, 'g') : svgDoc.createElement('g');
+ root.appendChild(group);
+
+ var svgCanvas = this.createSvgCanvas(group);
+ svgCanvas.foOffset = (crisp) ? -0.5 : 0;
+ svgCanvas.textOffset = (crisp) ? -0.5 : 0;
+ svgCanvas.imageOffset = (crisp) ? -0.5 : 0;
+ svgCanvas.translate(Math.floor(border / scale - bounds.x / vs),
+ Math.floor(border / scale - bounds.y / vs));
+
+ // Convert HTML entities
+ var htmlConverter = document.createElement('div');
+
+ // Adds simple text fallback for viewers with no support for foreignObjects
+ var getAlternateText = svgCanvas.getAlternateText;
+ svgCanvas.getAlternateText = function(fo, x, y, w, h, str,
+ align, valign, wrap, format, overflow, clip, rotation)
+ {
+ // Assumes a max character width of 0.5em
+ if (str != null && this.state.fontSize > 0)
+ {
+ try
+ {
+ if (mxUtils.isNode(str))
+ {
+ str = str.innerText;
+ }
+ else
+ {
+ htmlConverter.innerHTML = str;
+ str = mxUtils.extractTextWithWhitespace(htmlConverter.childNodes);
+ }
+
+ // Workaround for substring breaking double byte UTF
+ var exp = Math.ceil(2 * w / this.state.fontSize);
+ var result = [];
+ var length = 0;
+ var index = 0;
+
+ while ((exp == 0 || length < exp) && index < str.length)
+ {
+ var char = str.charCodeAt(index);
+
+ if (char == 10 || char == 13)
+ {
+ if (length > 0)
+ {
+ break;
+ }
+ }
+ else
+ {
+ result.push(str.charAt(index));
+
+ if (char < 255)
+ {
+ length++;
+ }
+ }
+
+ index++;
+ }
+
+ // Uses result and adds ellipsis if more than 1 char remains
+ if (result.length < str.length && str.length - result.length > 1)
+ {
+ str = mxUtils.trim(result.join('')) + '...';
+ }
+
+ return str;
+ }
+ catch (e)
+ {
+ return getAlternateText.apply(this, arguments);
+ }
+ }
+ else
+ {
+ return getAlternateText.apply(this, arguments);
+ }
+ };
+
+ // Paints background image
+ var bgImg = this.backgroundImage;
+
+ if (bgImg != null)
+ {
+ var s2 = vs / scale;
+ var tr = this.view.translate;
+ var tmp = new mxRectangle((bgImg.x + tr.x) * s2, (bgImg.y + tr.y) * s2,
+ bgImg.width * s2, bgImg.height * s2);
+
+ // Checks if visible
+ if (mxUtils.intersects(bounds, tmp))
+ {
+ svgCanvas.image(bgImg.x + tr.x, bgImg.y + tr.y,
+ bgImg.width, bgImg.height, bgImg.src, true);
+ }
+ }
+
+ svgCanvas.scale(s);
+ svgCanvas.textEnabled = showText;
+
+ imgExport = (imgExport != null) ? imgExport : this.createSvgImageExport();
+ var imgExportDrawCellState = imgExport.drawCellState;
+
+ // Ignores custom links
+ var imgExportGetLinkForCellState = imgExport.getLinkForCellState;
+
+ imgExport.getLinkForCellState = function(state, canvas)
+ {
+ var result = imgExportGetLinkForCellState.apply(this, arguments);
+
+ return (result != null && !state.view.graph.isCustomLink(result)) ? result : null;
+ };
+
+ imgExport.getLinkTargetForCellState = function(state, canvas)
+ {
+ return state.view.graph.getLinkTargetForCell(state.cell);
+ };
+
+ // Implements ignoreSelection flag
+ imgExport.drawCellState = function(state, canvas)
+ {
+ var graph = state.view.graph;
+ var selected = (lookup != null) ? lookup.get(state.cell) :
+ graph.isCellSelected(state.cell);
+ var parent = graph.model.getParent(state.cell);
+
+ // Checks if parent cell is selected
+ while ((!ignoreSelection || lookup != null) &&
+ !selected && parent != null)
+ {
+ selected = (lookup != null) ? lookup.get(parent) :
+ graph.isCellSelected(parent);
+ parent = graph.model.getParent(parent);
+ }
+
+ if ((ignoreSelection && lookup == null) || selected)
+ {
+ graph.view.redrawEnumerationState(state);
+ imgExportDrawCellState.apply(this, arguments);
+ this.doDrawShape(state.secondLabel, canvas);
+ }
+ };
+
+ var viewRoot = (this.view.currentRoot != null) ?
+ this.view.currentRoot : this.model.root;
+ imgExport.drawState(this.getView().getState(viewRoot), svgCanvas);
+ this.updateSvgLinks(root, linkTarget, true);
+ this.addForeignObjectWarning(svgCanvas, root);
+
+ return root;
+ }
+ finally
+ {
+ if (origUseCssTrans)
+ {
+ this.useCssTransforms = true;
+ this.view.revalidate();
+ this.sizeDidChange();
+ }
+ }
+ };
+
+ /**
+ * Adds warning for truncated labels in older viewers.
+ */
+ Graph.prototype.addForeignObjectWarning = function(canvas, root)
+ {
+ if (urlParams['svg-warning'] != '0' && root.getElementsByTagName('foreignObject').length > 0)
+ {
+ var sw = canvas.createElement('switch');
+ var g1 = canvas.createElement('g');
+ g1.setAttribute('requiredFeatures', 'http://www.w3.org/TR/SVG11/feature#Extensibility');
+ var a = canvas.createElement('a');
+ a.setAttribute('transform', 'translate(0,-5)');
+
+ // Workaround for implicit namespace handling in HTML5 export, IE adds NS1 namespace so use code below
+ // in all IE versions except quirks mode. KNOWN: Adds xlink namespace to each image tag in output.
+ if (a.setAttributeNS == null || (root.ownerDocument != document && document.documentMode == null))
+ {
+ a.setAttribute('xlink:href', Graph.foreignObjectWarningLink);
+ a.setAttribute('target', '_blank');
+ }
+ else
+ {
+ a.setAttributeNS(mxConstants.NS_XLINK, 'xlink:href', Graph.foreignObjectWarningLink);
+ a.setAttributeNS(mxConstants.NS_XLINK, 'target', '_blank');
+ }
+
+ var text = canvas.createElement('text');
+ text.setAttribute('text-anchor', 'middle');
+ text.setAttribute('font-size', '10px');
+ text.setAttribute('x', '50%');
+ text.setAttribute('y', '100%');
+ mxUtils.write(text, Graph.foreignObjectWarningText);
+
+ sw.appendChild(g1);
+ a.appendChild(text);
+ sw.appendChild(a);
+ root.appendChild(sw);
+ }
+ };
+
+ /**
+ * Hook for creating the canvas used in getSvg.
+ */
+ Graph.prototype.updateSvgLinks = function(node, target, removeCustom)
+ {
+ var links = node.getElementsByTagName('a');
+
+ for (var i = 0; i < links.length; i++)
+ {
+ if (links[i].getAttribute('target') == null)
+ {
+ var href = links[i].getAttribute('href');
+
+ if (href == null)
+ {
+ href = links[i].getAttribute('xlink:href');
+ }
+
+ if (href != null)
+ {
+ if (target != null && /^https?:\/\//.test(href))
+ {
+ links[i].setAttribute('target', target);
+ }
+ else if (removeCustom && this.isCustomLink(href))
+ {
+ links[i].setAttribute('href', 'javascript:void(0);');
+ }
+ }
+ }
+ }
+ };
+
+ /**
+ * Hook for creating the canvas used in getSvg.
+ */
+ Graph.prototype.createSvgCanvas = function(node)
+ {
+ var canvas = new mxSvgCanvas2D(node);
+ canvas.minStrokeWidth = this.cellRenderer.minSvgStrokeWidth;
+ canvas.pointerEvents = true;
+
+ return canvas;
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.getSelectedTextBlocks = function()
+ {
+ // See https://stackoverflow.com/questions/667951/how-to-get-nodes-lying-inside-a-range-with-javascript
+ function getNextNode(node)
+ {
+ if (node.firstChild)
+ return node.firstChild;
+ while (node)
+ {
+ if (node.nextSibling)
+ return node.nextSibling;
+ node = node.parentNode;
+ }
+ };
+
+ function getNodesInRange(range)
+ {
+ var start = range.startContainer;
+ var end = range.endContainer;
+ var commonAncestor = range.commonAncestorContainer;
+ var nodes = [];
+ var node;
+
+ // walk parent nodes from start to common ancestor
+ for (node = start.parentNode; node; node = node.parentNode)
+ {
+ nodes.push(node);
+ if (node == commonAncestor)
+ break;
+ }
+ nodes.reverse();
+
+ // walk children and siblings from start until end is found
+ for (node = start; node; node = getNextNode(node))
+ {
+ nodes.push(node);
+ if (node == end)
+ break;
+ }
+
+ return nodes;
+ };
+
+ var nodes = [this.getSelectedElement()];
+
+ if (window.getSelection)
+ {
+ var sel = window.getSelection();
+
+ if (sel.getRangeAt && sel.rangeCount)
+ {
+ nodes = getNodesInRange(sel.getRangeAt(0));
+ }
+ }
+
+ var result = [];
+
+ for (var i = 0; i < nodes.length; i++)
+ {
+ var node = nodes[i];
+
+ while (this.cellEditor.textarea != null &&
+ this.cellEditor.textarea.contains(node) &&
+ node != this.cellEditor.textarea &&
+ node.parentNode != null)
+ {
+ if (node.nodeType == mxConstants.NODETYPE_ELEMENT &&
+ mxUtils.getCurrentStyle(node).display == 'block')
+ {
+ if (mxUtils.indexOf(result, node) < 0)
+ {
+ result.push(node);
+ }
+
+ break;
+ }
+ else
+ {
+ node = node.parentNode;
+ }
+ }
+ }
+
+ return result;
+ };
+
+ /**
+ * Returns the first ancestor of the current selection with the given name.
+ */
+ Graph.prototype.getSelectedElement = function()
+ {
+ var node = null;
+
+ if (window.getSelection)
+ {
+ var sel = window.getSelection();
+
+ if (sel.getRangeAt && sel.rangeCount)
+ {
+ var range = sel.getRangeAt(0);
+ node = range.commonAncestorContainer;
+ }
+ }
+ else if (document.selection)
+ {
+ node = document.selection.createRange().parentElement();
+ }
+
+ return node;
+ };
+
+ /**
+ * Returns the text editing element.
+ */
+ Graph.prototype.getSelectedEditingElement = function()
+ {
+ var node = this.getSelectedElement();
+
+ while (node != null && node.nodeType != mxConstants.NODETYPE_ELEMENT)
+ {
+ node = node.parentNode;
+ }
+
+ if (node != null)
+ {
+ // Workaround for commonAncestor on range in IE11 returning parent of common ancestor
+ if (node == this.cellEditor.textarea && this.cellEditor.textarea.children.length == 1 &&
+ this.cellEditor.textarea.firstChild.nodeType == mxConstants.NODETYPE_ELEMENT)
+ {
+ node = this.cellEditor.textarea.firstChild;
+ }
+ }
+
+ return node;
+ };
+
+ /**
+ * Returns the first ancestor of the current selection with the given name.
+ */
+ Graph.prototype.getParentByName = function(node, name, stopAt)
+ {
+ while (node != null)
+ {
+ if (node.nodeName == name)
+ {
+ return node;
+ }
+
+ if (node == stopAt)
+ {
+ return null;
+ }
+
+ node = node.parentNode;
+ }
+
+ return node;
+ };
+
+ /**
+ * Returns the first ancestor of the current selection with the given name.
+ */
+ Graph.prototype.getParentByNames = function(node, names, stopAt)
+ {
+ while (node != null)
+ {
+ if (mxUtils.indexOf(names, node.nodeName) >= 0)
+ {
+ return node;
+ }
+
+ if (node == stopAt)
+ {
+ return null;
+ }
+
+ node = node.parentNode;
+ }
+
+ return node;
+ };
+
+ /**
+ * Selects the given node.
+ */
+ Graph.prototype.selectNode = function(node)
+ {
+ var sel = null;
+
+ // IE9 and non-IE
+ if (window.getSelection)
+ {
+ sel = window.getSelection();
+
+ if (sel.getRangeAt && sel.rangeCount)
+ {
+ var range = document.createRange();
+ range.selectNode(node);
+ sel.removeAllRanges();
+ sel.addRange(range);
+ }
+ }
+ // IE < 9
+ else if ((sel = document.selection) && sel.type != 'Control')
+ {
+ var originalRange = sel.createRange();
+ originalRange.collapse(true);
+ var range = sel.createRange();
+ range.setEndPoint('StartToStart', originalRange);
+ range.select();
+ }
+ };
+
+ /**
+ * Flips the given cells horizontally or vertically.
+ */
+ Graph.prototype.flipEdgePoints = function(cell, horizontal, c)
+ {
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ if (geo.points != null)
+ {
+ for (var i = 0; i < geo.points.length; i++)
+ {
+ if (horizontal)
+ {
+ geo.points[i].x = c + (c - geo.points[i].x);
+ }
+ else
+ {
+ geo.points[i].y = c + (c - geo.points[i].y);
+ }
+ }
+ }
+
+ var flipTerminalPoint = function(pt)
+ {
+ if (pt != null)
+ {
+ if (horizontal)
+ {
+ pt.x = c + (c - pt.x);
+ }
+ else
+ {
+ pt.y = c + (c - pt.y);
+ }
+ }
+ };
+
+ flipTerminalPoint(geo.getTerminalPoint(true));
+ flipTerminalPoint(geo.getTerminalPoint(false));
+
+ this.model.setGeometry(cell, geo);
+ }
+ };
+
+ /**
+ * Flips the given cells horizontally or vertically.
+ */
+ Graph.prototype.flipChildren = function(cell, horizontal, c)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ var childCount = this.model.getChildCount(cell);
+
+ for (var i = 0; i < childCount; i++)
+ {
+ var child = this.model.getChildAt(cell, i);
+
+ if (this.model.isEdge(child))
+ {
+ this.flipEdgePoints(child, horizontal, c);
+ }
+ else
+ {
+ var geo = this.getCellGeometry(child);
+
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ if (horizontal)
+ {
+ geo.x = c + (c - geo.x - geo.width);
+ }
+ else
+ {
+ geo.y = c + (c - geo.y - geo.height);
+ }
+
+ this.model.setGeometry(child, geo);
+ }
+ }
+ }
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ };
+
+ /**
+ * Flips the given cells horizontally or vertically.
+ */
+ Graph.prototype.flipCells = function(cells, horizontal)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ cells = this.model.getTopmostCells(cells);
+ var vertices = [];
+
+ for (var i = 0; i < cells.length; i++)
+ {
+ if (this.model.isEdge(cells[i]))
+ {
+ var state = this.view.getState(cells[i]);
+
+ if (state != null)
+ {
+ this.flipEdgePoints(cells[i], horizontal, ((horizontal ? state.getCenterX() :
+ state.getCenterY()) / this.view.scale) - ((horizontal) ?
+ state.origin.x : state.origin.y) - ((horizontal) ?
+ this.view.translate.x : this.view.translate.y));
+ }
+ }
+ else
+ {
+ var geo = this.getCellGeometry(cells[i]);
+
+ if (geo != null)
+ {
+ this.flipChildren(cells[i], horizontal, horizontal ?
+ geo.getCenterX() - geo.x :
+ geo.getCenterY() - geo.y);
+ }
+
+ vertices.push(cells[i]);
+ }
+ }
+
+ this.toggleCellStyles(horizontal ? mxConstants.STYLE_FLIPH :
+ mxConstants.STYLE_FLIPV, false, vertices);
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+ };
+
+ /**
+ * Deletes the given cells and returns the cells to be selected.
+ */
+ Graph.prototype.deleteCells = function(cells, includeEdges)
+ {
+ var select = null;
+
+ if (cells != null && cells.length > 0)
+ {
+ this.model.beginUpdate();
+ try
+ {
+ // Shrinks tables
+ for (var i = 0; i < cells.length; i++)
+ {
+ var parent = this.model.getParent(cells[i]);
+
+ if (this.isTable(parent))
+ {
+ var row = this.getCellGeometry(cells[i]);
+ var table = this.getCellGeometry(parent);
+
+ if (row != null && table != null)
+ {
+ table = table.clone();
+ table.height -= row.height;
+ this.model.setGeometry(parent, table);
+ }
+ }
+ }
+
+ var parents = (this.selectParentAfterDelete) ? this.model.getParents(cells) : null;
+ this.removeCells(cells, includeEdges);
+ }
+ finally
+ {
+ this.model.endUpdate();
+ }
+
+ // Selects parents for easier editing of groups
+ if (parents != null)
+ {
+ select = [];
+
+ for (var i = 0; i < parents.length; i++)
+ {
+ if (this.model.contains(parents[i]) &&
+ (this.model.isVertex(parents[i]) ||
+ this.model.isEdge(parents[i])))
+ {
+ select.push(parents[i]);
+ }
+ }
+ }
+ }
+
+ return select;
+ };
+
+ /**
+ * Inserts a column in the table for the given cell.
+ */
+ Graph.prototype.insertTableColumn = function(cell, before)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var table = cell;
+ var index = 0;
+
+ if (this.isTableCell(cell))
+ {
+ var row = model.getParent(cell);
+ table = model.getParent(row);
+ index = mxUtils.indexOf(model.getChildCells(row, true), cell);
+ }
+ else
+ {
+ if (this.isTableRow(cell))
+ {
+ table = model.getParent(cell);
+ }
+ else
+ {
+ cell = model.getChildCells(table, true)[0];
+ }
+
+ if (!before)
+ {
+ index = model.getChildCells(cell, true).length - 1;
+ }
+ }
+
+ var rows = model.getChildCells(table, true);
+ var dw = Graph.minTableColumnWidth;
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ var child = model.getChildCells(rows[i], true)[index];
+ var clone = model.cloneCell(child, false);
+
+ // Handles possible missing child in row
+ if (clone == null)
+ {
+ clone = this.createVertex();
+ }
+
+ var geo = this.getCellGeometry(clone);
+
+ // Removes value, col/rowspan and alternate bounds
+ clone.value = null;
+ clone.style = mxUtils.setStyle(mxUtils.setStyle(
+ clone.style, 'rowspan', null), 'colspan', null);
+
+ if (geo != null)
+ {
+ if (geo.alternateBounds != null)
+ {
+ geo.width = geo.alternateBounds.width;
+ geo.height = geo.alternateBounds.height;
+ geo.alternateBounds = null;
+ }
+
+ dw = geo.width;
+ var rowGeo = this.getCellGeometry(rows[i]);
+
+ if (rowGeo != null)
+ {
+ geo.height = rowGeo.height;
+ }
+ }
+
+ model.add(rows[i], clone, index + ((before) ? 0 : 1));
+ }
+
+ var tableGeo = this.getCellGeometry(table);
+
+ if (tableGeo != null)
+ {
+ tableGeo = tableGeo.clone();
+ tableGeo.width += dw;
+
+ model.setGeometry(table, tableGeo);
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ * Inserts a row in the table for the given cell.
+ */
+ Graph.prototype.deleteLane = function(cell)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var pool = null;
+ var lane = cell;
+ var style = this.getCurrentCellStyle(lane);
+
+ if (style['childLayout'] == 'stackLayout')
+ {
+ pool = lane;
+ }
+ else
+ {
+ pool = model.getParent(lane);
+ }
+
+ var lanes = model.getChildCells(pool, true);
+
+ if (lanes.length == 0)
+ {
+ model.remove(pool);
+ }
+ else
+ {
+ if (pool == lane)
+ {
+ lane = lanes[lanes.length - 1];
+ }
+
+ model.remove(lane);
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ * Inserts a row in the table for the given cell.
+ */
+ Graph.prototype.insertLane = function(cell, before)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var pool = null;
+ var lane = cell;
+ var style = this.getCurrentCellStyle(lane);
+
+ if (style['childLayout'] == 'stackLayout')
+ {
+ pool = lane;
+ var lanes = model.getChildCells(pool, true);
+ lane = lanes[(before) ? 0 : lanes.length - 1];
+ }
+ else
+ {
+ pool = model.getParent(lane);
+ }
+
+ var index = pool.getIndex(lane);
+ lane = model.cloneCell(lane, false);
+ lane.value = null;
+ model.add(pool, lane, index + ((before) ? 0 : 1));
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ * Inserts a row in the table for the given cell.
+ */
+ Graph.prototype.insertTableRow = function(cell, before)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var table = cell;
+ var row = cell;
+
+ if (this.isTableCell(cell))
+ {
+ row = model.getParent(cell);
+ table = model.getParent(row);
+ }
+ else if (this.isTableRow(cell))
+ {
+ table = model.getParent(cell);
+ }
+ else
+ {
+ var rows = model.getChildCells(table, true);
+ row = rows[(before) ? 0 : rows.length - 1];
+ }
+
+ var cells = model.getChildCells(row, true);
+ var index = table.getIndex(row);
+ row = model.cloneCell(row, false);
+ row.value = null;
+
+ var rowGeo = this.getCellGeometry(row);
+
+ if (rowGeo != null)
+ {
+ for (var i = 0; i < cells.length; i++)
+ {
+ var cell = model.cloneCell(cells[i], false);
+
+ // Removes value, col/rowspan and alternate bounds
+ cell.value = null;
+ cell.style = mxUtils.setStyle(mxUtils.setStyle(
+ cell.style, 'rowspan', null), 'colspan', null);
+
+ var geo = this.getCellGeometry(cell);
+
+ if (geo != null)
+ {
+ if (geo.alternateBounds != null)
+ {
+ geo.width = geo.alternateBounds.width;
+ geo.height = geo.alternateBounds.height;
+ geo.alternateBounds = null;
+ }
+
+ geo.height = rowGeo.height;
+ }
+
+ row.insert(cell);
+ }
+
+ model.add(table, row, index + ((before) ? 0 : 1));
+
+ var tableGeo = this.getCellGeometry(table);
+
+ if (tableGeo != null)
+ {
+ tableGeo = tableGeo.clone();
+ tableGeo.height += rowGeo.height;
+
+ model.setGeometry(table, tableGeo);
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.deleteTableColumn = function(cell)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var table = cell;
+ var row = cell;
+
+ if (this.isTableCell(cell))
+ {
+ row = model.getParent(cell);
+ }
+
+ if (this.isTableRow(row))
+ {
+ table = model.getParent(row);
+ }
+
+ var rows = model.getChildCells(table, true);
+
+ if (rows.length == 0)
+ {
+ model.remove(table);
+ }
+ else
+ {
+ if (!this.isTableRow(row))
+ {
+ row = rows[0];
+ }
+
+ var cells = model.getChildCells(row, true);
+
+ if (cells.length <= 1)
+ {
+ model.remove(table);
+ }
+ else
+ {
+ var index = cells.length - 1;
+
+ if (this.isTableCell(cell))
+ {
+ index = mxUtils.indexOf(cells, cell);
+ }
+
+ var width = 0;
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ var child = model.getChildCells(rows[i], true)[index];
+ model.remove(child);
+
+ var geo = this.getCellGeometry(child);
+
+ if (geo != null)
+ {
+ width = Math.max(width, geo.width);
+ }
+ }
+
+ var tableGeo = this.getCellGeometry(table);
+
+ if (tableGeo != null)
+ {
+ tableGeo = tableGeo.clone();
+ tableGeo.width -= width;
+
+ model.setGeometry(table, tableGeo);
+ }
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ *
+ */
+ Graph.prototype.deleteTableRow = function(cell)
+ {
+ var model = this.getModel();
+ model.beginUpdate();
+
+ try
+ {
+ var table = cell;
+ var row = cell;
+
+ if (this.isTableCell(cell))
+ {
+ row = model.getParent(cell);
+ cell = row;
+ }
+
+ if (this.isTableRow(cell))
+ {
+ table = model.getParent(row);
+ }
+
+ var rows = model.getChildCells(table, true);
+
+ if (rows.length <= 1)
+ {
+ model.remove(table);
+ }
+ else
+ {
+ if (!this.isTableRow(row))
+ {
+ row = rows[rows.length - 1];
+ }
+
+ model.remove(row);
+ var height = 0;
+
+ var geo = this.getCellGeometry(row);
+
+ if (geo != null)
+ {
+ height = geo.height;
+ }
+
+ var tableGeo = this.getCellGeometry(table);
+
+ if (tableGeo != null)
+ {
+ tableGeo = tableGeo.clone();
+ tableGeo.height -= height;
+
+ model.setGeometry(table, tableGeo);
+ }
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+ };
+
+ /**
+ * Inserts a new row into the given table.
+ */
+ Graph.prototype.insertRow = function(table, index)
+ {
+ var bd = table.tBodies[0];
+ var cells = bd.rows[0].cells;
+ var cols = 0;
+
+ // Counts columns including colspans
+ for (var i = 0; i < cells.length; i++)
+ {
+ var colspan = cells[i].getAttribute('colspan');
+ cols += (colspan != null) ? parseInt(colspan) : 1;
+ }
+
+ var row = bd.insertRow(index);
+
+ for (var i = 0; i < cols; i++)
+ {
+ mxUtils.br(row.insertCell(-1));
+ }
+
+ return row.cells[0];
+ };
+
+ /**
+ * Deletes the given column.
+ */
+ Graph.prototype.deleteRow = function(table, index)
+ {
+ table.tBodies[0].deleteRow(index);
+ };
+
+ /**
+ * Deletes the given column.
+ */
+ Graph.prototype.insertColumn = function(table, index)
+ {
+ var hd = table.tHead;
+
+ if (hd != null)
+ {
+ // TODO: use colIndex
+ for (var h = 0; h < hd.rows.length; h++)
+ {
+ var th = document.createElement('th');
+ hd.rows[h].appendChild(th);
+ mxUtils.br(th);
+ }
+ }
+
+ var bd = table.tBodies[0];
+
+ for (var i = 0; i < bd.rows.length; i++)
+ {
+ var cell = bd.rows[i].insertCell(index);
+ mxUtils.br(cell);
+ }
+
+ return bd.rows[0].cells[(index >= 0) ? index : bd.rows[0].cells.length - 1];
+ };
+
+ /**
+ * Deletes the given column.
+ */
+ Graph.prototype.deleteColumn = function(table, index)
+ {
+ if (index >= 0)
+ {
+ var bd = table.tBodies[0];
+ var rows = bd.rows;
+
+ for (var i = 0; i < rows.length; i++)
+ {
+ if (rows[i].cells.length > index)
+ {
+ rows[i].deleteCell(index);
+ }
+ }
+ }
+ };
+
+ /**
+ * Inserts the given HTML at the caret position (no undo).
+ */
+ Graph.prototype.pasteHtmlAtCaret = function(html)
+ {
+ var sel, range;
+
+ // IE9 and non-IE
+ if (window.getSelection)
+ {
+ sel = window.getSelection();
+
+ if (sel.getRangeAt && sel.rangeCount)
+ {
+ range = sel.getRangeAt(0);
+ range.deleteContents();
+
+ // Range.createContextualFragment() would be useful here but is
+ // only relatively recently standardized and is not supported in
+ // some browsers (IE9, for one)
+ var el = document.createElement("div");
+ el.innerHTML = html;
+ var frag = document.createDocumentFragment(), node;
+
+ while ((node = el.firstChild))
+ {
+ lastNode = frag.appendChild(node);
+ }
+
+ range.insertNode(frag);
+ }
+ }
+ // IE < 9
+ else if ((sel = document.selection) && sel.type != "Control")
+ {
+ // FIXME: Does not work if selection is empty
+ sel.createRange().pasteHTML(html);
+ }
+ };
+
+ /**
+ * Creates an anchor elements for handling the given link in the
+ * hint that is shown when the cell is selected.
+ */
+ Graph.prototype.createLinkForHint = function(link, label)
+ {
+ link = (link != null) ? link : 'javascript:void(0);';
+
+ if (label == null || label.length == 0)
+ {
+ if (this.isCustomLink(link))
+ {
+ label = this.getLinkTitle(link);
+ }
+ else
+ {
+ label = link;
+ }
+ }
+
+ // Helper function to shorten strings
+ function short(str, max)
+ {
+ if (str.length > max)
+ {
+ str = str.substring(0, Math.round(max / 2)) + '...' +
+ str.substring(str.length - Math.round(max / 4));
+ }
+
+ return str;
+ };
+
+ var a = document.createElement('a');
+ a.setAttribute('rel', this.linkRelation);
+ a.setAttribute('href', this.getAbsoluteUrl(link));
+ a.setAttribute('title', short((this.isCustomLink(link)) ?
+ this.getLinkTitle(link) : link, 80));
+
+ if (this.linkTarget != null)
+ {
+ a.setAttribute('target', this.linkTarget);
+ }
+
+ // Adds shortened label to link
+ mxUtils.write(a, short(label, 40));
+
+ // Handles custom links
+ if (this.isCustomLink(link))
+ {
+ mxEvent.addListener(a, 'click', mxUtils.bind(this, function(evt)
+ {
+ this.customLinkClicked(link);
+ mxEvent.consume(evt);
+ }));
+ }
+
+ return a;
+ };
+
+ /**
+ * Customized graph for touch devices.
+ */
+ Graph.prototype.initTouch = function()
+ {
+ // Disables new connections via "hotspot"
+ this.connectionHandler.marker.isEnabled = function()
+ {
+ return this.graph.connectionHandler.first != null;
+ };
+
+ // Hides menu when editing starts
+ this.addListener(mxEvent.START_EDITING, function(sender, evt)
+ {
+ this.popupMenuHandler.hideMenu();
+ });
+
+ // Adds custom hit detection if native hit detection found no cell
+ var graphUpdateMouseEvent = this.updateMouseEvent;
+ this.updateMouseEvent = function(me)
+ {
+ me = graphUpdateMouseEvent.apply(this, arguments);
+
+ if (mxEvent.isTouchEvent(me.getEvent()) && me.getState() == null)
+ {
+ var cell = this.getCellAt(me.graphX, me.graphY);
+
+ if (cell != null && this.isSwimlane(cell) && this.hitsSwimlaneContent(cell, me.graphX, me.graphY))
+ {
+ cell = null;
+ }
+ else
+ {
+ me.state = this.view.getState(cell);
+
+ if (me.state != null && me.state.shape != null)
+ {
+ this.container.style.cursor = me.state.shape.node.style.cursor;
+ }
+ }
+ }
+
+ if (me.getState() == null && this.isEnabled())
+ {
+ this.container.style.cursor = 'default';
+ }
+
+ return me;
+ };
+
+ // Context menu trigger implementation depending on current selection state
+ // combined with support for normal popup trigger.
+ var cellSelected = false;
+ var selectionEmpty = false;
+ var menuShowing = false;
+
+ var oldFireMouseEvent = this.fireMouseEvent;
+
+ this.fireMouseEvent = function(evtName, me, sender)
+ {
+ if (evtName == mxEvent.MOUSE_DOWN)
+ {
+ // For hit detection on edges
+ me = this.updateMouseEvent(me);
+
+ cellSelected = this.isCellSelected(me.getCell());
+ selectionEmpty = this.isSelectionEmpty();
+ menuShowing = this.popupMenuHandler.isMenuShowing();
+ }
+
+ oldFireMouseEvent.apply(this, arguments);
+ };
+
+ // Shows popup menu if cell was selected or selection was empty and background was clicked
+ // FIXME: Conflicts with mxPopupMenuHandler.prototype.getCellForPopupEvent in Editor.js by
+ // selecting parent for selected children in groups before this check can be made.
+ this.popupMenuHandler.mouseUp = mxUtils.bind(this, function(sender, me)
+ {
+ var isMouseEvent = mxEvent.isMouseEvent(me.getEvent());
+ this.popupMenuHandler.popupTrigger = !this.isEditing() && this.isEnabled() &&
+ (me.getState() == null || !me.isSource(me.getState().control)) &&
+ (this.popupMenuHandler.popupTrigger || (!menuShowing && !isMouseEvent &&
+ ((selectionEmpty && me.getCell() == null && this.isSelectionEmpty()) ||
+ (cellSelected && this.isCellSelected(me.getCell())))));
+
+ // Delays popup menu to allow for double tap to start editing
+ var popup = (!cellSelected || isMouseEvent) ? null : mxUtils.bind(this, function(cell)
+ {
+ window.setTimeout(mxUtils.bind(this, function()
+ {
+ if (!this.isEditing())
+ {
+ var origin = mxUtils.getScrollOrigin();
+ this.popupMenuHandler.popup(me.getX() + origin.x + 1,
+ me.getY() + origin.y + 1, cell, me.getEvent());
+ }
+ }), 300);
+ });
+
+ mxPopupMenuHandler.prototype.mouseUp.apply(this.popupMenuHandler, [sender, me, popup]);
+ });
+ };
+
+ /**
+ * HTML in-place editor
+ */
+ mxCellEditor.prototype.isContentEditing = function()
+ {
+ var state = this.graph.view.getState(this.editingCell);
+
+ return state != null && state.style['html'] == 1;
+ };
+
+ /**
+ * Returns true if all selected text is inside a table element.
+ */
+ mxCellEditor.prototype.isTableSelected = function()
+ {
+ return this.graph.getParentByName(
+ this.graph.getSelectedElement(),
+ 'TABLE', this.textarea) != null;
+ };
+
+ /**
+ * Returns true if text is selected.
+ */
+ mxCellEditor.prototype.isTextSelected = function()
+ {
+ var txt = '';
+
+ if (window.getSelection)
+ {
+ txt = window.getSelection();
+ }
+ else if (document.getSelection)
+ {
+ txt = document.getSelection();
+ }
+ else if (document.selection)
+ {
+ txt = document.selection.createRange().text;
+ }
+
+ return txt != '';
+ };
+
+ /**
+ * Inserts a tab at the cursor position.
+ */
+ mxCellEditor.prototype.insertTab = function(spaces)
+ {
+ var editor = this.textarea;
+ var doc = editor.ownerDocument.defaultView;
+ var sel = doc.getSelection();
+ var range = sel.getRangeAt(0);
+ var tabNode = Graph.createTabNode(spaces);
+ range.insertNode(tabNode);
+ range.setStartAfter(tabNode);
+ range.setEndAfter(tabNode);
+ sel.removeAllRanges();
+ sel.addRange(range);
+ };
+
+ /**
+ * Sets the alignment of the current selected cell. This sets the
+ * alignment in the cell style, removes all alignment within the
+ * text and invokes the built-in alignment function.
+ *
+ * Only the built-in function is invoked if shift is pressed or
+ * if table cells are selected and shift is not pressed.
+ */
+ mxCellEditor.prototype.alignText = function(align, evt)
+ {
+ var shiftPressed = evt != null && mxEvent.isShiftDown(evt);
+
+ if (shiftPressed || (window.getSelection != null && window.getSelection().containsNode != null))
+ {
+ var allSelected = true;
+
+ this.graph.processElements(this.textarea, function(node)
+ {
+ if (shiftPressed || window.getSelection().containsNode(node, true))
+ {
+ node.removeAttribute('align');
+ node.style.textAlign = null;
+ }
+ else
+ {
+ allSelected = false;
+ }
+ });
+
+ if (allSelected)
+ {
+ this.graph.cellEditor.setAlign(align);
+ }
+ }
+
+ document.execCommand('justify' + align.toLowerCase(), false, null);
+ };
+
+ /**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+ mxCellEditor.prototype.saveSelection = function()
+ {
+ if (window.getSelection)
+ {
+ var sel = window.getSelection();
+
+ if (sel.getRangeAt && sel.rangeCount)
+ {
+ var ranges = [];
+
+ for (var i = 0, len = sel.rangeCount; i < len; ++i)
+ {
+ ranges.push(sel.getRangeAt(i));
+ }
+
+ return ranges;
+ }
+ }
+ else if (document.selection && document.selection.createRange)
+ {
+ return document.selection.createRange();
+ }
+
+ return null;
+ };
+
+ /**
+ * Creates the keyboard event handler for the current graph and history.
+ */
+ mxCellEditor.prototype.restoreSelection = function(savedSel)
+ {
+ try
+ {
+ if (savedSel)
+ {
+ if (window.getSelection)
+ {
+ sel = window.getSelection();
+ sel.removeAllRanges();
+
+ for (var i = 0, len = savedSel.length; i < len; ++i)
+ {
+ sel.addRange(savedSel[i]);
+ }
+ }
+ else if (document.selection && savedSel.select)
+ {
+ savedSel.select();
+ }
+ }
+ }
+ catch (e)
+ {
+ // ignore
+ }
+ };
+
+ /**
+ * Handling of special nl2Br style for not converting newlines to breaks in HTML labels.
+ * NOTE: Since it's easier to set this when the label is created we assume that it does
+ * not change during the lifetime of the mxText instance.
+ */
+ var mxCellRendererInitializeLabel = mxCellRenderer.prototype.initializeLabel;
+ mxCellRenderer.prototype.initializeLabel = function(state)
+ {
+ if (state.text != null)
+ {
+ state.text.replaceLinefeeds = mxUtils.getValue(state.style, 'nl2Br', '1') != '0';
+ }
+
+ mxCellRendererInitializeLabel.apply(this, arguments);
+ };
+
+ var mxConstraintHandlerUpdate = mxConstraintHandler.prototype.update;
+ mxConstraintHandler.prototype.update = function(me, source)
+ {
+ if (this.isKeepFocusEvent(me) || !mxEvent.isAltDown(me.getEvent()))
+ {
+ mxConstraintHandlerUpdate.apply(this, arguments);
+ }
+ else
+ {
+ this.reset();
+ }
+ };
+
+ /**
+ * No dashed shapes.
+ */
+ mxGuide.prototype.createGuideShape = function(horizontal)
+ {
+ var guide = new mxPolyline([], mxConstants.GUIDE_COLOR, mxConstants.GUIDE_STROKEWIDTH);
+
+ return guide;
+ };
+
+ /**
+ * HTML in-place editor
+ */
+ mxCellEditor.prototype.escapeCancelsEditing = false;
+
+ /**
+ * Overridden to set CSS classes.
+ */
+ var mxCellEditorStartEditing = mxCellEditor.prototype.startEditing;
+ mxCellEditor.prototype.startEditing = function(cell, trigger)
+ {
+ cell = this.graph.getStartEditingCell(cell, trigger);
+
+ mxCellEditorStartEditing.apply(this, arguments);
+
+ // Overrides class in case of HTML content to add
+ // dashed borders for divs and table cells
+ var state = this.graph.view.getState(cell);
+
+ if (state != null && state.style['html'] == 1)
+ {
+ this.textarea.className = 'mxCellEditor geContentEditable';
+ }
+ else
+ {
+ this.textarea.className = 'mxCellEditor mxPlainTextEditor';
+ }
+
+ // Toggles markup vs wysiwyg mode
+ this.codeViewMode = false;
+
+ // Stores current selection range when switching between markup and code
+ this.switchSelectionState = null;
+
+ // Selects editing cell
+ this.graph.setSelectionCell(cell);
+
+ // Enables focus outline for edges and edge labels
+ var parent = this.graph.getModel().getParent(cell);
+ var geo = this.graph.getCellGeometry(cell);
+
+ if ((this.graph.getModel().isEdge(parent) && geo != null && geo.relative) ||
+ this.graph.getModel().isEdge(cell))
+ {
+ // IE>8 and FF on Windows uses outline default of none
+ if (mxClient.IS_IE || mxClient.IS_IE11 || (mxClient.IS_FF && mxClient.IS_WIN))
+ {
+ this.textarea.style.outline = 'gray dotted 1px';
+ }
+ else
+ {
+ this.textarea.style.outline = '';
+ }
+ }
+ }
+
+ /**
+ * HTML in-place editor
+ */
+ var cellEditorInstallListeners = mxCellEditor.prototype.installListeners;
+ mxCellEditor.prototype.installListeners = function(elt)
+ {
+ cellEditorInstallListeners.apply(this, arguments);
+
+ // Adds a reference from the clone to the original node, recursively
+ function reference(node, clone)
+ {
+ clone.originalNode = node;
+
+ node = node.firstChild;
+ var child = clone.firstChild;
+
+ while (node != null && child != null)
+ {
+ reference(node, child);
+ node = node.nextSibling;
+ child = child.nextSibling;
+ }
+
+ return clone;
+ };
+
+ // Checks the given node for new nodes, recursively
+ function checkNode(node, clone)
+ {
+ if (node != null)
+ {
+ if (clone.originalNode != node)
+ {
+ cleanNode(node);
+ }
+ else
+ {
+ node = node.firstChild;
+ clone = clone.firstChild;
+
+ while (node != null)
+ {
+ var nextNode = node.nextSibling;
+
+ if (clone == null)
+ {
+ cleanNode(node);
+ }
+ else
+ {
+ checkNode(node, clone);
+ clone = clone.nextSibling;
+ }
+
+ node = nextNode;
+ }
+ }
+ }
+ };
+
+ // Removes unused DOM nodes and attributes, recursively
+ function cleanNode(node)
+ {
+ var child = node.firstChild;
+
+ while (child != null)
+ {
+ var next = child.nextSibling;
+ cleanNode(child);
+ child = next;
+ }
+
+ if ((node.nodeType != 1 || (node.nodeName !== 'BR' && node.firstChild == null)) &&
+ (node.nodeType != 3 || mxUtils.trim(mxUtils.getTextContent(node)).length == 0))
+ {
+ node.parentNode.removeChild(node);
+ }
+ else
+ {
+ // Removes linefeeds
+ if (node.nodeType == 3)
+ {
+ mxUtils.setTextContent(node, mxUtils.getTextContent(node).replace(/\n|\r/g, ''));
+ }
+
+ // Removes CSS classes and styles (for Word and Excel)
+ if (node.nodeType == 1)
+ {
+ node.removeAttribute('style');
+ node.removeAttribute('class');
+ node.removeAttribute('width');
+ node.removeAttribute('cellpadding');
+ node.removeAttribute('cellspacing');
+ node.removeAttribute('border');
+ }
+ }
+ };
+
+ // Handles paste from Word, Excel etc by removing styles, classnames and unused nodes
+ // LATER: Fix undo/redo for paste
+ if (document.documentMode !== 7 && document.documentMode !== 8)
+ {
+ mxEvent.addListener(this.textarea, 'paste', mxUtils.bind(this, function(evt)
+ {
+ var clone = reference(this.textarea, this.textarea.cloneNode(true));
+
+ window.setTimeout(mxUtils.bind(this, function()
+ {
+ if (this.textarea != null)
+ {
+ // Paste from Word or Excel
+ if (this.textarea.innerHTML.indexOf('') >= 0 ||
+ this.textarea.innerHTML.indexOf('
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-bold.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-bold.svg
new file mode 100644
index 0000000..d0aeceb
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-bold.svg
@@ -0,0 +1,12 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-bottom.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-bottom.svg
new file mode 100644
index 0000000..fd16bb5
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-bottom.svg
@@ -0,0 +1,24 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-center.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-center.svg
new file mode 100644
index 0000000..8e53158
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-center.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-code.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-code.svg
new file mode 100644
index 0000000..120ae11
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-code.svg
@@ -0,0 +1,16 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-connection.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-connection.svg
new file mode 100644
index 0000000..2d69f9e
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-connection.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-curved.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-curved.svg
new file mode 100644
index 0000000..769bfbf
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-curved.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-delete.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-delete.svg
new file mode 100644
index 0000000..071fa43
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-delete.svg
@@ -0,0 +1,15 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-dots.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-dots.svg
new file mode 100644
index 0000000..944f52a
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-dots.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-entity.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-entity.svg
new file mode 100644
index 0000000..9aeebd4
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-entity.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-fit.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-fit.svg
new file mode 100644
index 0000000..45b3e2c
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-fit.svg
@@ -0,0 +1,45 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-fontbackground.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-fontbackground.svg
new file mode 100644
index 0000000..c068dc8
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-fontbackground.svg
@@ -0,0 +1,15 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-fontcolor.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-fontcolor.svg
new file mode 100644
index 0000000..13a6d06
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-fontcolor.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-formatpanel.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-formatpanel.svg
new file mode 100644
index 0000000..50f04c4
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-formatpanel.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalelbow.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalelbow.svg
new file mode 100644
index 0000000..ba4c53e
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalelbow.svg
@@ -0,0 +1,45 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalisometric.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalisometric.svg
new file mode 100644
index 0000000..9bd95bf
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalisometric.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalrule.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalrule.svg
new file mode 100644
index 0000000..0372f6b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-horizontalrule.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-indent.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-indent.svg
new file mode 100644
index 0000000..b38419e
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-indent.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-italic.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-italic.svg
new file mode 100644
index 0000000..f5d1050
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-italic.svg
@@ -0,0 +1,8 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-justifyfull.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-justifyfull.svg
new file mode 100644
index 0000000..a78cad0
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-justifyfull.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-left.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-left.svg
new file mode 100644
index 0000000..12fbac7
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-left.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-link.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-link.svg
new file mode 100644
index 0000000..4eac588
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-link.svg
@@ -0,0 +1,16 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-linkedge.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-linkedge.svg
new file mode 100644
index 0000000..b3ed4b8
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-linkedge.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-middle.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-middle.svg
new file mode 100644
index 0000000..c9425eb
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-middle.svg
@@ -0,0 +1,40 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-orderedlist.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-orderedlist.svg
new file mode 100644
index 0000000..e7828ab
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-orderedlist.svg
@@ -0,0 +1,21 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-orthogonal.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-orthogonal.svg
new file mode 100644
index 0000000..64de585
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-orthogonal.svg
@@ -0,0 +1,10 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-outdent.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-outdent.svg
new file mode 100644
index 0000000..dfe17a8
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-outdent.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-plus.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-plus.svg
new file mode 100644
index 0000000..37b9b74
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-plus.svg
@@ -0,0 +1,8 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-redo.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-redo.svg
new file mode 100644
index 0000000..3c353fd
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-redo.svg
@@ -0,0 +1,45 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-removeformat.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-removeformat.svg
new file mode 100644
index 0000000..78bd454
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-removeformat.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-right.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-right.svg
new file mode 100644
index 0000000..ff375c6
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-right.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-shadow.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-shadow.svg
new file mode 100644
index 0000000..7113884
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-shadow.svg
@@ -0,0 +1,8 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-simplearrow.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-simplearrow.svg
new file mode 100644
index 0000000..4259b39
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-simplearrow.svg
@@ -0,0 +1,22 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-straight.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-straight.svg
new file mode 100644
index 0000000..fd2ec9b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-straight.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-strokecolor.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-strokecolor.svg
new file mode 100644
index 0000000..cd3cc12
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-strokecolor.svg
@@ -0,0 +1,12 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-subscript.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-subscript.svg
new file mode 100644
index 0000000..197492b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-subscript.svg
@@ -0,0 +1,15 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-superscript.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-superscript.svg
new file mode 100644
index 0000000..d678c32
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-superscript.svg
@@ -0,0 +1,15 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-table.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-table.svg
new file mode 100644
index 0000000..00fa4aa
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-table.svg
@@ -0,0 +1,12 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-toback.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-toback.svg
new file mode 100644
index 0000000..c8d108e
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-toback.svg
@@ -0,0 +1,22 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-tofront.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-tofront.svg
new file mode 100644
index 0000000..0d4a95a
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-tofront.svg
@@ -0,0 +1,43 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-top.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-top.svg
new file mode 100644
index 0000000..dfde68f
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-top.svg
@@ -0,0 +1,24 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-underline.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-underline.svg
new file mode 100644
index 0000000..e6b807b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-underline.svg
@@ -0,0 +1,13 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-undo.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-undo.svg
new file mode 100644
index 0000000..7100b88
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-undo.svg
@@ -0,0 +1,45 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-unorderedlist.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-unorderedlist.svg
new file mode 100644
index 0000000..b6fb870
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-unorderedlist.svg
@@ -0,0 +1,17 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-vertical.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-vertical.svg
new file mode 100644
index 0000000..b9b08c1
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-vertical.svg
@@ -0,0 +1,15 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-verticalelbow.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-verticalelbow.svg
new file mode 100644
index 0000000..3b6fa63
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-verticalelbow.svg
@@ -0,0 +1,40 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-verticalisometric.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-verticalisometric.svg
new file mode 100644
index 0000000..6de0229
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-verticalisometric.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zoomin.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zoomin.svg
new file mode 100644
index 0000000..751ecce
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zoomin.svg
@@ -0,0 +1,21 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zoomout.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zoomout.svg
new file mode 100644
index 0000000..5eb98b5
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zoomout.svg
@@ -0,0 +1,20 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zz-填充色_icon.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-填充色_icon.svg
new file mode 100644
index 0000000..58c8837
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-填充色_icon.svg
@@ -0,0 +1,34 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zz-复选框.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-复选框.svg
new file mode 100644
index 0000000..b72daf6
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-复选框.svg
@@ -0,0 +1,10 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zz-查看画图2.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-查看画图2.svg
new file mode 100644
index 0000000..50f04c4
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-查看画图2.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/font/svg/geSprite-zz-线条颜色_icon.svg b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-线条颜色_icon.svg
new file mode 100644
index 0000000..cd3cc12
--- /dev/null
+++ b/oaweb/public/cherry/drawio/font/svg/geSprite-zz-线条颜色_icon.svg
@@ -0,0 +1,12 @@
+
+
+
diff --git a/oaweb/public/cherry/drawio/fonts/ArchitectsDaughter-Regular.ttf b/oaweb/public/cherry/drawio/fonts/ArchitectsDaughter-Regular.ttf
new file mode 100644
index 0000000..421f247
Binary files /dev/null and b/oaweb/public/cherry/drawio/fonts/ArchitectsDaughter-Regular.ttf differ
diff --git a/oaweb/public/cherry/drawio/grapheditor.css b/oaweb/public/cherry/drawio/grapheditor.css
new file mode 100644
index 0000000..22c088a
--- /dev/null
+++ b/oaweb/public/cherry/drawio/grapheditor.css
@@ -0,0 +1,2101 @@
+:root {
+ --panel-color: #f1f3f4;
+ --border-color: #dadce0;
+ --text-color: #707070;
+}
+.geEditor *, div.mxWindow, .mxWindowTitle,
+.geEditor .geToolbarContainer .geColorButton {
+ border-color:var(--border-color);
+}
+html div.mxWindow, .geDialog, .geSketch .geToolbarContainer {
+ border-radius: 5px;
+ box-shadow: 0px 0px 2px #C0C0C0;
+}
+div td.mxWindowTitle {
+ border-bottom-style:solid;
+ border-bottom-width:1px;
+ font-size: 13px;
+ height: 22px;
+}
+.mxWindowTitle > div > img {
+ padding: 4px;
+}
+.geEditor {
+ font-family:-apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", system-ui, ui-sans-serif, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+ font-size:14px;
+ border:none;
+ margin:0px;
+}
+.geBackground {
+ background:white;
+}
+.geEditor input[type=text]::-ms-clear {
+ display: none;
+}
+.geEditor input, .geEditor select,
+.geEditor textarea, .geEditor button {
+ font-size: inherit;
+}
+.geMenubarContainer, .geToolbarContainer, .geHsplit,
+.geVsplit, .mxWindowTitle, .geSidebarContainer,
+.geEditor .geTabItem {
+ background:var(--panel-color);
+}
+.geButtonContainer {
+ display: inline-flex;
+ align-items: center;
+ padding: 0 32px 0 0;
+ margin-left: auto;
+}
+.geEditor .geTabItem {
+ border-width:1px;
+ border-top-style:solid;
+}
+.geEditor .geTabItem {
+ cursor:default;
+ user-select:none;
+}
+.geEditor div.mxTooltip {
+ background: var(--panel-color);
+ font-size: 11px;
+ color: black;
+ padding:6px;
+}
+.geDragPreview {
+ border: 1px dashed black;
+}
+html > body > div > div.geToolbarContainer.geSimpleMainMenu,
+html > body > div > div.geToolbarContainer.geSimpleMainMenu .geToolbarContainer{
+ border-top: none !important;
+ border-left: none !important;
+ border-right: none !important;
+}
+html > body > div > div.geToolbarContainer.geSimpleMainMenu .geToolbarContainer{
+ border:none !important;
+}
+.geMenubarContainer {
+ display:inline-flex;
+ align-items:center;
+}
+.geMenubarContainer .geItem, .geToolbar .geButton, .geToolbar .geLabel {
+ cursor:pointer !important;
+}
+.geSidebarContainer .geTitle {
+ cursor:default !important;
+}
+.geBackgroundPage {
+ box-shadow:0px 0px 2px 1px #d1d1d1;
+}
+.geSidebarContainer a, .geMenubarContainer a, .geToolbar a {
+ color:#000000;
+ text-decoration:none;
+}
+.geMenubarContainer, .geToolbarContainer, .geDiagramContainer, .geSidebarContainer, .geFooterContainer, .geHsplit, .geVsplit {
+ overflow:hidden;
+ position:absolute;
+ cursor:default;
+}
+.geFormatContainer {
+ overflow-x:hidden !important;
+ overflow-y:auto !important;
+ font-size:12px;
+ border-left:1px solid #dadce0;
+ transition:width 0.3s;
+}
+.geFormatContainer button:not(.geColorBtn), .geFormatContainer select {
+ border-radius:4px;
+ padding:2px;
+}
+.geSidebarFooter {
+ border-top:1px solid #dadce0;
+}
+.geFormatSection {
+ border-bottom:1px solid #dadce0;
+ border-color:#dadce0;
+}
+.geDiagramContainer {
+ background-color:#ffffff;
+ font-size:0px;
+ outline:none;
+}
+.geMenubar, .geToolbar {
+ white-space:nowrap;
+ display:block;
+ width:100%;
+}
+.geMenubarContainer .geItem, .geToolbar .geButton, .geToolbar .geLabel,
+.geSidebar, .geSidebar .geItem, .mxPopupMenuItem {
+ -webkit-transition: all 0.1s ease-in-out;
+ -moz-transition: all 0.1s ease-in-out;
+ -o-transition: all 0.1s ease-in-out;
+ -ms-transition: all 0.1s ease-in-out;
+ transition: all 0.1s ease-in-out;
+}
+.geHint {
+ background-color: #ffffff;
+ border: 1px solid gray;
+ padding: 4px 16px 4px 16px;
+ border-radius:3px;
+ -webkit-box-shadow: 1px 1px 2px 0px #ddd;
+ -moz-box-shadow: 1px 1px 2px 0px #ddd;
+ box-shadow: 1px 1px 2px 0px #ddd;
+ opacity:0.8;
+ font-size:9pt;
+}
+.geHint img {
+ opacity: 0.7;
+}
+.geHint img:hover
+{
+ opacity: 1;
+}
+.geUser {
+ color:var(--text-color);
+ display:inline-block;
+ cursor:pointer;
+ font-size:10px;
+}
+.geStatus > * {
+ overflow:hidden;
+ white-space:nowrap;
+ vertical-align:middle;
+ display:inline-block;
+ font-size:12px;
+ color:var(--text-color);
+}
+a.geStatus {
+ display:inline-flex;
+ align-items:center;
+ white-space:nowrap;
+ min-width:0;
+ height:100%;
+}
+.geStatus *[data-action] {
+ cursor:pointer;
+}
+.geStatus img {
+ max-width:16px;
+ vertical-align:bottom;
+}
+a.geStatus div + div {
+ margin-left:8px;
+}
+a.geStatus .geStatusBox {
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 3px;
+ font-size: 10px;
+ padding: 3px;
+}
+a.geStatus .geStatusAlert {
+ padding:4px 8px;
+ background-color:#eacccc;
+ border:1px solid #dca4ad;
+ color:#b62623 !important;
+ border-radius:3px;
+}
+a.geStatus .geStatusAlertOrange {
+ padding:4px 8px;
+ background-color:rgb(242, 147, 30);
+ border:rgb(240, 135, 5);
+ color:#000000 !important;
+ border-radius:3px;
+}
+html body div.geSmallBanner {
+ background-color: #F2931E;
+ background-image: linear-gradient(#F2931E 0px,#F08707 100%);
+ border: 1px solid #F08707;
+ color: #000;
+}
+html body div.geSmallBanner:hover:not([disabled]) {
+ background-color: #ffb75e;
+ background-image: linear-gradient(#ffb75e 0px,#F2931E 100%);
+ border: 1px solid #F08707;
+ color: #000;
+}
+a.geStatus .geStatusMessage {
+ padding:4px 6px 4px 6px;
+ font-size:12px;
+ background: -webkit-linear-gradient(top,#dff0d8 0,#c8e5bc 100%);
+ background: -o-linear-gradient(top,#dff0d8 0,#c8e5bc 100%);
+ background: -webkit-gradient(linear,left top,left bottom,from(#dff0d8),to(#c8e5bc));
+ background: linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%);
+ background-repeat: repeat-x;
+ border:1px solid #b2dba1;
+ border-radius:3px;
+ color:#3c763d !important;
+}
+.geAlert {
+ position:absolute;
+ white-space:nowrap;
+ padding:14px;
+ background-color:#f2dede;
+ border:1px solid #ebccd1;
+ color:#a94442;
+ border-radius:3px;
+ -webkit-box-shadow: 2px 2px 3px 0px #ddd;
+ -moz-box-shadow: 2px 2px 3px 0px #ddd;
+ box-shadow: 2px 2px 3px 0px #ddd;
+}
+.geEditor input, .geEditor button, .geEditor select, .geColorBtn {
+ border: 1px solid #d8d8d8;
+ border-radius: 4px;
+}
+.geEditor button, .geEditor select, .geColorBtn {
+ background:#eee;
+}
+.geEditor button:hover:not([disabled], .geBigButton, .geShareBtn),
+.geEditor select:hover:not([disabled]), .geColorBtn:hover:not([disabled]) {
+ background:#e5e5e5;
+}
+.geColorDropper {
+ cursor:pointer;
+ opacity:0.7;
+}
+.geColorDropper:hover {
+ opacity:1;
+}
+.geBtn, .mxWindow .geBtn {
+ font-size: 13px;
+ font-weight: 500;
+ border-radius: 4px;
+ height: 30px;
+ margin: 0 0 0 8px;
+ min-width: 72px;
+ outline: 0;
+ padding: 0 8px;
+}
+.geBtn:hover:not([disabled]), .geBtn:focus {
+ -webkit-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
+ -moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
+ box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
+ color: #111;
+}
+.geToolbarContainer {
+ border-width:1px;
+ border-color:lightgray;
+ border-style:none none solid none;
+ box-shadow:none;
+ z-index:1;
+}
+.geShapePicker {
+ position:absolute;
+ border-radius:10px;
+ border-style:solid;
+ border-width:1px;
+ padding:6px 0 8px 0;
+ text-align:center;
+ box-shadow:0px 0px 3px 1px #d1d1d1;
+}
+.geBtnStepper {
+ border-radius:3px;
+ border-style:solid;
+ border-width:1px;
+}
+.geBtnUp {
+ background-image: url(data:image/gif;base64,R0lGODlhCgAGAJECAGZmZtXV1f///wAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0QzM3ODJERjg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0QzM3ODJFMDg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRDMzc4MkREODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRDMzc4MkRFODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAQAAAgAsAAAAAAoABgAAAg6UjwiQBhGYglCKhXFLBQA7);
+ background-position: center center;
+ background-repeat: no-repeat;
+ border-bottom-style:solid;
+ border-width:1px;
+}
+.geBtnUp:active {
+ background-color: #4d90fe;
+ background-image: linear-gradient(#4d90fe 0px,#357ae8 100%);
+}
+.geBtnDown {
+ background-image: url(data:image/gif;base64,R0lGODlhCgAGAJECANXV1WZmZv///wAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0QzM3ODJEQjg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0QzM3ODJEQzg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRDMzc4MkQ5ODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRDMzc4MkRBODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAQAAAgAsAAAAAAoABgAAAg6UjxLLewEiCAnOZBzeBQA7);
+ background-position: center center;
+ background-repeat: no-repeat;
+ border-style:solid;
+ border-width:1px;
+}
+.geBtnDown:active {
+ background-color: #4d90fe;
+ background-image: linear-gradient(#4d90fe 0px,#357ae8 100%);
+}
+html .geColorBtn {
+ padding: 0px;
+}
+html .geColorBtn:disabled {
+ opacity: 0.5;
+}
+html .gePrimaryBtn {
+ background-color: #4d90fe;
+ background-image: linear-gradient(#4d90fe 0px,#4787ed 100%);
+ border: 1px solid #3079ed;
+ color: #fff;
+}
+html .gePrimaryBtn:hover:not([disabled]), html .gePrimaryBtn:focus {
+ background-color: #357ae8;
+ background-image: linear-gradient(#4d90fe 0px,#357ae8 100%);
+ border: 1px solid #2f5bb7;
+ color: #fff;
+}
+.gePrimaryBtn:disabled {
+ opacity: .5;
+}
+button.geShareBtn {
+ background-color: #F2931E;
+ border-color: #F08705;
+ color:#000000;
+}
+.geAlertLink {
+ color:#843534;
+ font-weight:700;
+ text-decoration:none;
+}
+.geMenubar {
+ padding:0px 2px 0px 2px;
+ display:inline-flex;
+ align-items:center;
+}
+.geMenubarContainer .geItem, .geToolbar .geItem {
+ padding:6px 6px 6px 9px;
+ cursor:default;
+}
+.geItem:hover:not([disabled]), .geToolbarButton:hover:not([disabled]),
+.geBtn:hover:not([disabled]) {
+ opacity: 1 !important;
+}
+.geItem:active:not([disabled]):not(.geStatus), .geBtn:active:not([disabled]),
+.geStatus div[data-action]:active:not([disabled]),
+html .geToolbarButton:active:not([disabled]) {
+ opacity: 0.7 !important;
+}
+.geBtn:disabled {
+ opacity: 0.5;
+}
+.geMenubarContainer .geItem:active {
+ background: #F8C382;
+}
+.geToolbarContainer .geButton:hover {
+ opacity:1;
+ background: #eee;
+ border-radius:2px;
+}
+.geToolbarContainer .geButton:active, .geToolbarContainer .geLabel:active {
+ background: #F8C382;
+}
+.geToolbarContainer .geLabel:hover {
+ background: #eee;
+ border-radius:2px;
+}
+.geActiveButton:hover {
+ opacity: 0.7;
+}
+.geActiveButton:active {
+ opacity: 0.3;
+}
+.geToolbarButton {
+ opacity: 0.6;
+}
+.geToolbarButton:active {
+ opacity: 0.2 !important;
+}
+.mxDisabled:hover {
+ background:inherit !important;
+}
+.geMenubar a.geStatus {
+ color:#888888;
+ padding:0px 0px 0px 10px;
+ display:inline-flex;
+ align-items:center;
+ cursor:default !important;
+}
+.geMenubar a.geStatus:hover {
+ background:transparent;
+}
+.geSidebarContainer .geToolbarContainer {
+ background:transparent;
+ border-bottom:none;
+}
+.geSidebarContainer button {
+ text-overflow:ellipsis;
+ overflow:hidden;
+}
+.geToolbar {
+ padding:5px 0px 0px 6px;
+ border-top:1px solid #dadce0;
+ -webkit-box-shadow: inset 0 1px 0 0 #fff;
+ -moz-box-shadow: inset 0 1px 0 0 #fff;
+ box-shadow: inset 0 1px 0 0 #fff;
+}
+.geToolbarContainer .geSeparator {
+ float:left;
+ width:1px;
+ height:20px;
+ background:#e5e5e5;
+ margin-left:6px;
+ margin-right:6px;
+ margin-top:4px;
+}
+.geToolbarContainer .geButton {
+ float:left;
+ width:20px;
+ height:20px;
+ padding:0px 2px 4px 2px;
+ margin:2px;
+ border:1px solid transparent;
+ cursor:pointer;
+ opacity:0.6;
+}
+div.mxWindow .geButton {
+ margin: -1px 2px 2px 2px;
+ padding: 1px 2px 2px 1px;
+}
+.geToolbarContainer .geLabel {
+ float:left;
+ margin:2px;
+ cursor:pointer;
+ padding:3px 5px 3px 5px;
+ border:1px solid transparent;
+}
+.geToolbarContainer .mxDisabled:hover {
+ border:1px solid transparent !important;
+ opacity:0.2 !important;
+}
+.geDiagramBackdrop {
+ background-color: #fbfbfb;
+}
+.geSidebarContainer {
+ position:absolute;
+ overflow-x:hidden;
+ overflow-y:auto;
+}
+.mxWindowPane .geSidebarContainer {
+ width:100%;
+ height:100%;
+}
+.geEditor > div > .geMenubarContainer {
+ border-bottom-style:solid;
+ border-bottom-width:1px;
+}
+.geTabContainer {
+ border-width:1px;
+ border-top-style:solid;
+ border-left-style:solid;
+ border-right-style:solid;
+ display:flex;
+ white-space:nowrap;
+ overflow:hidden;
+ position:absolute;
+ z-index:1;
+}
+.geTabScroller {
+ display:inline-block;
+ position:relative;
+ max-width:calc(100% - 90px);
+ white-space:nowrap;
+ overflow:hidden;
+ overflow-x:auto;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ left:0px;
+}
+.geTabScroller::-webkit-scrollbar {
+ display: none;
+}
+.geToggleItem {
+ padding:4px;
+ border-radius:8px;
+}
+.geActiveItem {
+ background-color:var(--border-color);
+}
+html body div.geActivePage, .geRuler {
+ background:#fff;
+}
+.geInactivePage:hover, .geControlTab:hover {
+ opacity:0.5;
+}
+.geTabMenuButton {
+ width:14px;
+ height:14px;
+ margin-left:4px;
+ margin-right:-6px;
+ cursor:pointer;
+}
+.geInactivePage .geTabMenuButton {
+ display:none;
+}
+.geTabMenuButton {
+ display:inline-block;
+ opacity:1;
+}
+.geTabMenuButton:hover {
+ opacity:0.7;
+}
+.geTabContainer > :first-child {
+ border-left-style:none;
+}
+.geTabContainer > :first-child > :first-child {
+ border-left-style:none;
+}
+.geTab {
+ height: 100%;
+ border-left-width:1px;
+ border-left-style:solid;
+ text-overflow:ellipsis;
+ border-color:#dadce0;
+ color:rgb(112, 112, 112);
+ font-size:12px;
+ font-weight: 600;
+ display: inline-flex;
+ align-items: center;
+}
+.gePageTab {
+ padding: 0px 12px 0px 12px;
+}
+.geSidebar {
+ border-bottom:1px solid #e5e5e5;
+ padding:6px;
+ padding-left:10px;
+ padding-bottom:6px;
+ overflow:hidden;
+}
+.geSidebarContainer .geTitle {
+ display:block;
+ font-size:13px;
+ border-color: #e5e5e5;
+ border-bottom:1px solid #e5e5e5;
+ font-weight:500;
+ padding:8px 0px 8px 20px;
+ margin:0px;
+ cursor:default;
+ white-space:nowrap;
+ overflow:hidden;
+ text-overflow:ellipsis;
+ line-height:1.4em;
+}
+.geSidebarContainer .geTitle:hover {
+ background: #eee;
+ border-radius:2px;
+}
+.geSidebarContainer .geTitle:active {
+ background-color:#F8C382;
+}
+.geSidebarContainer .geDropTarget {
+ border-radius:10px;
+ border:2px dotted #b0b0b0;
+ text-align:center;
+ padding:6px;
+ margin:6px;
+ color:#a0a0a0;
+ font-size:13px;
+}
+.geTitle img {
+ opacity:0.5;
+}
+.geTitle img:hover {
+ opacity:1;
+}
+.geTitle .geButton {
+ border:1px solid transparent;
+ padding:3px;
+ border-radius:2px;
+}
+.geTitle .geButton:hover {
+ border:1px solid gray;
+}
+.geSidebar .geItem {
+ display:inline-block;
+ background-repeat:no-repeat;
+ background-position:50% 50%;
+ border-radius: 8px;
+}
+.geSidebar .geItem, .geShapePicker .geItem {
+ transition: transform 100ms ease-out;
+}
+.geSidebar .geItem:hover {
+ background-color:#e0e0e0;
+}
+.geSidebar .geItem:active, .geShapePicker .geItem:active {
+ transform: scale(0.8,0.8);
+}
+.geItem {
+ vertical-align: top;
+ display: inline-block;
+}
+.geSidebarTooltip {
+ position:absolute;
+ background:#fbfbfb;
+ overflow:hidden;
+ box-shadow:0 2px 6px 2px rgba(60,64,67,.15);
+ border-radius:6px;
+}
+.geFooterContainer {
+ background:#e5e5e5;
+ border-top:1px solid #c0c0c0;
+}
+.geFooterContainer a {
+ display:inline-block;
+ box-sizing:border-box;
+ width:100%;
+ white-space:nowrap;
+ font-size:14px;
+ color:#235695;
+ font-weight:bold;
+ text-decoration:none;
+}
+.geFooterContainer table {
+ border-collapse:collapse;
+ margin:0 auto;
+}
+.geFooterContainer td {
+ border-left:1px solid #c0c0c0;
+ border-right:1px solid #c0c0c0;
+}
+.geToolbarButton {
+ border-color:#333333;
+}
+.geFooterContainer td:hover {
+ background-color: #b3b3b3;
+}
+.geHsplit {
+ cursor:col-resize;
+}
+.geVsplit {
+ font-size:1pt;
+ cursor:row-resize;
+}
+.geHsplit {
+ border-left:1px solid var(--border-color);
+ background-color:transparent;
+}
+.geVSplit {
+ border-top:1px solid var(--border-color);
+ border-bottom:1px solid var(--border-color);
+}
+.geHsplit:hover, .geVsplit:hover {
+ background-color:var(--border-color);
+ opacity:0.7;
+}
+.mxWindow {
+ background:var(--panel-color);
+}
+.geDialog {
+ position:absolute;
+ background:white;
+ line-height:1em;
+ overflow:hidden;
+ padding:30px;
+ border:1px solid #acacac;
+ -webkit-box-shadow:0px 0px 2px 2px #d5d5d5;
+ -moz-box-shadow:0px 0px 2px 2px #d5d5d5;
+ box-shadow:0px 0px 2px 2px #d5d5d5;
+ z-index: 2;
+}
+.geTransDialog {
+ position:absolute;
+ overflow:hidden;
+ z-index: 2;
+}
+.geDialogClose {
+ position:absolute;
+ width:9px;
+ height:9px;
+ opacity:0.5;
+ cursor:pointer;
+}
+.geDialogClose:hover {
+ opacity:1;
+}
+.geDialogTitle {
+ box-sizing:border-box;
+ white-space:nowrap;
+ background:rgb(229, 229, 229);
+ border-bottom:1px solid rgb(192, 192, 192);
+ font-size:15px;
+ font-weight:bold;
+ text-align:center;
+ color:rgb(35, 86, 149);
+}
+.geDialogFooter {
+ background:whiteSmoke;
+ white-space:nowrap;
+ text-align:right;
+ box-sizing:border-box;
+ border-top:1px solid #e5e5e5;
+ color:darkGray;
+}
+.geSprite {
+ background:url('data:image/png;base64,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') no-repeat;
+ width:21px;
+ height:21px;
+}
+.geEditor .geBaseButton {
+ padding:10px;
+ border-radius:6px;
+ border:1px solid #c0c0c0;
+ cursor:pointer;
+ background-color:#ececec;
+ background-image:linear-gradient(#ececec 0%, #fcfcfc 100%);
+}
+.geEditor .geBaseButton:hover {
+ background:#ececec;
+}
+.geEditor .geBigButton {
+ color:#ffffff;
+ border: none;
+ padding:4px 10px;
+ font-size:14px;
+ white-space: nowrap;
+ border-radius:3px;
+ background-color:#0052cc;
+ cursor:pointer;
+ transition: background-color 0.1s ease-out;
+ overflow:hidden;
+ text-overflow: ellipsis;
+}
+.geEditor .geBigButton:hover {
+ background-color:#0065ff;
+}
+.geEditor .geBigButton:active {
+ background-color:#0747a6;
+ opacity:1;
+}
+html body .geBigStandardButton {
+ color: #344563;
+ background-color: rgba(9, 30, 66, 0.08);
+}
+html body .geBigStandardButton:hover {
+ background-color: rgba(9, 30, 66, 0.13);
+}
+html body .geBigStandardButton:active {
+ background-color: #F8C382;
+ color: #600000;
+}
+@media print {
+ div.geNoPrint { display: none !important; }
+}
+.geSprite-actualsize { background-position: 0 0; }
+.geSprite-bold { background-position: 0 -46px; }
+.geSprite-bottom { background-position: 0 -92px; }
+.geSprite-center { background-position: 0 -138px; }
+.geSprite-delete { background-position: 0 -184px; }
+.geSprite-fillcolor { background-position: 0 -229px; }
+.geSprite-fit { background-position: 0 -277px; }
+.geSprite-fontcolor { background-position: 0 -322px; }
+.geSprite-gradientcolor { background-position: 0 -368px; }
+.geSprite-image { background-position: 0 -414px; }
+.geSprite-italic { background-position: 0 -460px; }
+.geSprite-left { background-position: 0 -505px; }
+.geSprite-middle { background-position: 0 -552px; }
+.geSprite-print { background-position: 0 -598px; }
+.geSprite-redo { background-position: 0 -644px; }
+.geSprite-right { background-position: 0 -689px; }
+.geSprite-shadow { background-position: 0 -735px; }
+.geSprite-strokecolor { background-position: 0 -782px; }
+.geSprite-top { background-position: 0 -828px; }
+.geSprite-underline { background-position: 0 -874px; }
+.geSprite-undo { background-position: 0 -920px; }
+.geSprite-zoomin { background-position: 0 -966px; }
+.geSprite-zoomout { background-position: 0 -1012px; }
+.geSprite-arrow { background-position: 0 -1059px; }
+.geSprite-linkedge { background-position: 0 -1105px; }
+.geSprite-straight { background-position: 0 -1150px; }
+.geSprite-entity { background-position: 0 -1196px; }
+.geSprite-orthogonal { background-position: 0 -1242px; }
+.geSprite-curved { background-position: 0 -1288px; }
+.geSprite-noarrow { background-position: 0 -1334px; }
+.geSprite-endclassic { background-position: 0 -1380px; }
+.geSprite-endopen { background-position: 0 -1426px; }
+.geSprite-endblock { background-position: 0 -1472px; }
+.geSprite-endoval { background-position: 0 -1518px; }
+.geSprite-enddiamond { background-position: 0 -1564px; }
+.geSprite-endthindiamond { background-position: 0 -1610px; }
+.geSprite-endclassictrans { background-position: 0 -1656px; }
+.geSprite-endblocktrans { background-position: 0 -1702px; }
+.geSprite-endovaltrans { background-position: 0 -1748px; }
+.geSprite-enddiamondtrans { background-position: 0 -1794px; }
+.geSprite-endthindiamondtrans { background-position: 0 -1840px; }
+.geSprite-startclassic { background-position: 0 -1886px; }
+.geSprite-startopen { background-position: 0 -1932px; }
+.geSprite-startblock { background-position: 0 -1978px; }
+.geSprite-startoval { background-position: 0 -2024px; }
+.geSprite-startdiamond { background-position: 0 -2070px; }
+.geSprite-startthindiamond { background-position: 0 -2116px; }
+.geSprite-startclassictrans { background-position: 0 -2162px; }
+.geSprite-startblocktrans { background-position: 0 -2208px; }
+.geSprite-startovaltrans { background-position: 0 -2254px; }
+.geSprite-startdiamondtrans { background-position: 0 -2300px; }
+.geSprite-startthindiamondtrans { background-position: 0 -2346px; }
+.geSprite-globe { background-position: 0 -2392px; }
+.geSprite-orderedlist { background-position: 0 -2438px; }
+.geSprite-unorderedlist { background-position: 0 -2484px; }
+.geSprite-horizontalrule { background-position: 0 -2530px; }
+.geSprite-link { background-position: 0 -2576px; }
+.geSprite-indent { background-position: 0 -2622px; }
+.geSprite-outdent { background-position: 0 -2668px; }
+.geSprite-code { background-position: 0 -2714px; }
+.geSprite-fontbackground { background-position: 0 -2760px; }
+.geSprite-removeformat { background-position: 0 -2806px; }
+.geSprite-superscript { background-position: 0 -2852px; }
+.geSprite-subscript { background-position: 0 -2898px; }
+.geSprite-table { background-position: 0 -2944px; }
+.geSprite-deletecolumn { background-position: 0 -2990px; }
+.geSprite-deleterow { background-position: 0 -3036px; }
+.geSprite-insertcolumnafter { background-position: 0 -3082px; }
+.geSprite-insertcolumnbefore { background-position: 0 -3128px; }
+.geSprite-insertrowafter { background-position: 0 -3174px; }
+.geSprite-insertrowbefore { background-position: 0 -3220px; }
+.geSprite-grid { background-position: 0 -3272px; }
+.geSprite-guides { background-position: 0 -3324px; }
+.geSprite-dots { background-position: 0 -3370px; }
+.geSprite-alignleft { background-position: 0 -3416px; }
+.geSprite-alignright { background-position: 0 -3462px; }
+.geSprite-aligncenter { background-position: 0 -3508px; }
+.geSprite-aligntop { background-position: 0 -3554px; }
+.geSprite-alignbottom { background-position: 0 -3600px; }
+.geSprite-alignmiddle { background-position: 0 -3646px; }
+.geSprite-justifyfull { background-position: 0 -3692px; }
+.geSprite-formatpanel { background-position: 0 -3738px; }
+.geSprite-connection { background-position: 0 -3784px; }
+.geSprite-vertical { background-position: 0 -3830px; }
+.geSprite-simplearrow { background-position: 0 -3876px; }
+.geSprite-plus { background-position: 0 -3922px; }
+.geSprite-rounded { background-position: 0 -3968px; }
+.geSprite-toback { background-position: 0 -4014px; }
+.geSprite-tofront { background-position: 0 -4060px; }
+.geSprite-duplicate { background-position: 0 -4106px; }
+.geSprite-insert { background-position: 0 -4152px; }
+.geSprite-endblockthin { background-position: 0 -4201px; }
+.geSprite-endblockthintrans { background-position: 0 -4247px; }
+.geSprite-enderone { background-position: 0 -4293px; }
+.geSprite-enderonetoone { background-position: 0 -4339px; }
+.geSprite-enderonetomany { background-position: 0 -4385px; }
+.geSprite-endermany { background-position: 0 -4431px; }
+.geSprite-enderoneopt { background-position: 0 -4477px; }
+.geSprite-endermanyopt { background-position: 0 -4523px; }
+.geSprite-endclassicthin { background-position: 0 -4938px; }
+.geSprite-endclassicthintrans { background-position: 0 -4984px; }
+.geSprite-enddash { background-position: 0 -5029px; }
+.geSprite-endcircleplus { background-position: 0 -5075px; }
+.geSprite-endcircle { background-position: 0 -5121px; }
+.geSprite-endasync { background-position: 0 -5167px; }
+.geSprite-endasynctrans { background-position: 0 -5213px; }
+.geSprite-startblockthin { background-position: 0 -4569px; }
+.geSprite-startblockthintrans { background-position: 0 -4615px; }
+.geSprite-starterone { background-position: 0 -4661px; }
+.geSprite-starteronetoone { background-position: 0 -4707px; }
+.geSprite-starteronetomany { background-position: 0 -4753px; }
+.geSprite-startermany { background-position: 0 -4799px; }
+.geSprite-starteroneopt { background-position: 0 -4845px; }
+.geSprite-startermanyopt { background-position: 0 -4891px; }
+.geSprite-startclassicthin { background-position: 0 -5259px; }
+.geSprite-startclassicthintrans { background-position: 0 -5305px; }
+.geSprite-startdash { background-position: 0 -5351px; }
+.geSprite-startcircleplus { background-position: 0 -5397px; }
+.geSprite-startcircle { background-position: 0 -5443px; }
+.geSprite-startasync { background-position: 0 -5489px; }
+.geSprite-startasynctrans { background-position: 0 -5535px; }
+.geSprite-startcross { background-position: 0 -5581px; }
+.geSprite-startopenthin { background-position: 0 -5627px; }
+.geSprite-startopenasync { background-position: 0 -5673px; }
+.geSprite-endcross { background-position: 0 -5719px; }
+.geSprite-endopenthin { background-position: 0 -5765px; }
+.geSprite-endopenasync { background-position: 0 -5811px; }
+.geSprite-verticalelbow { background-position: 0 -5857px; }
+.geSprite-horizontalelbow { background-position: 0 -5903px; }
+.geSprite-horizontalisometric { background-position: 0 -5949px; }
+.geSprite-verticalisometric { background-position: 0 -5995px; }
+.geSvgSprite {
+ background-position: center center;
+}
+.geFlipSprite {
+ transform:scaleX(-1);
+}
+.geSprite-box {
+ background-image: url("data:image/svg+xml;utf8,");
+}
+.geSprite-halfCircle {
+ background-image: url("data:image/svg+xml;utf8,");
+}
+html div.mxRubberband {
+ border-color:#0000DD;
+ background:#99ccff;
+}
+td.mxPopupMenuIcon div {
+ width:16px;
+ height:16px;
+}
+.geEditor div.mxPopupMenu {
+ box-shadow: 0px 0px 2px #C0C0C0;
+ background:var(--panel-color);
+ border-radius:4px;
+ border-style:solid;
+ border-width:1px;
+ border-color:lightgray;
+ padding:3px;
+}
+.geSearchSidebar {
+ padding: 14px 8px 0px 8px;
+ box-sizing: border-box;
+ min-height: 60px;
+ overflow: hidden;
+ width: 100%;
+}
+.geSearchSidebar input {
+ font-size: 12px;
+ box-sizing: border-box;
+ border: 1px solid #d5d5d5;
+ border-radius: 4px;
+ width: 100%;
+ outline: none;
+ padding: 6px 20px 6px 6px
+}
+html table.mxPopupMenu {
+ border-collapse:collapse;
+ margin:0px;
+}
+html td.mxPopupMenuItem {
+ padding:7px 30px 7px 30px;
+ font-family:-apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", system-ui, ui-sans-serif, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+ font-size:10pt;
+}
+html td.mxPopupMenuIcon {
+ background-color:transparent;
+ padding:0px;
+}
+td.mxPopupMenuIcon .geIcon {
+ padding:2px;
+ padding-bottom:4px;
+ margin:2px;
+ border:1px solid transparent;
+ opacity:0.5;
+}
+html tr.mxPopupMenuItemHover {
+ background-color: #e0e0e0;
+ color: black;
+}
+table.mxPopupMenu hr {
+ color:#cccccc;
+ background-color:#cccccc;
+ border:none;
+ height:1px;
+}
+table.mxPopupMenu tr {
+ font-size:4pt;
+}
+html td.mxWindowTitle {
+ color:rgb(112, 112, 112);
+ background:#f1f3f4;
+ padding:4px;
+}
+table.geProperties {
+ table-layout:fixed;
+}
+table.geProperties tr td {
+ height:21px;
+}
+.gePropHeader, .gePropRow {
+ border: 1px solid #e9e9e9;
+}
+.gePropRowDark {
+ border: 1px solid #4472C4;
+}
+.gePropHeader>.gePropHeaderCell {
+ border-top: 0;
+ border-bottom: 0;
+ text-align: left;
+ width: 50%;
+}
+.gePropHeader>.gePropHeaderCell:first-child {
+ border-left: none;
+}
+.gePropHeader>.gePropHeaderCell:last-child {
+ border-right: none;
+}
+.gePropHeader {
+ background: #e5e5e5;
+ color: black;
+}
+.gePropRowCell {
+ border-left: 1px solid #f3f3f3;
+ white-space:nowrap;
+ text-overflow:ellipsis;
+ overflow:hidden;
+ max-width: 50%;
+}
+.gePropRow>.gePropRowCell {
+ background: #fff;
+}
+.gePropRowAlt>.gePropRowCell {
+ background: #fcfcfc;
+}
+.gePropRowDark>.gePropRowCell {
+ background: #fff;
+ color: #305496;
+ font-weight: bold;
+}
+.gePropRowDarkAlt>.gePropRowCell {
+ background: #D9E1F2;
+ color: #305496;
+ font-weight: bold;
+}
+.gePropEditor input:invalid {
+ border: 1px solid red;
+}
+/* Templates dialog css */
+.geTemplateDlg {
+ width: 100%;
+ height: 100%;
+}
+.geTemplateDlg ::-webkit-scrollbar {
+ width:12px;
+ height:12px;
+}
+.geTemplateDlg ::-webkit-scrollbar-track {
+ background:whiteSmoke;
+ box-shadow:inset 0 0 4px rgba(0,0,0,0.1);
+}
+.geTemplateDlg ::-webkit-scrollbar-thumb {
+ background:#c5c5c5;
+ border-radius:10px;
+ border:whiteSmoke solid 3px;
+}
+.geTemplateDlg ::-webkit-scrollbar-thumb:hover {
+ background:#b5b5b5;
+}
+
+.geTempDlgHeader {
+ box-sizing: border-box;
+ height: 62px;
+ width: 100%;
+ border: 1px solid #CCCCCC;
+ border-radius: 5px 5px 0 0;
+ background-color: #F5F5F5;
+}
+.geTempDlgHeaderLogo {
+ height: 34px;
+ margin: 14px 14px 14px 20px;
+}
+.geTempDlgSearchBox {
+ color:#888888;
+ background:url("/images/icon-search.svg") no-repeat;
+ background-color: #FFFFFF;
+ background-position: 15px;
+ height: 40px;
+ width: 40%;
+ max-width: 400px;
+ border: 1px solid #CCCCCC;
+ border-radius: 3px;
+ float:right;
+ font-family:Arial,Helvetica,sans-serif;
+ font-size:15px;
+ line-height:36px;
+ margin: 11px 36px 0 0;
+ outline:medium none;
+ padding:0 0 0 36px;
+ text-shadow:1px 1px 0 white;
+}
+.geTemplatesList {
+ box-sizing: border-box;
+ float: left;
+ height: calc(100% - 118px);
+ width: 20%;
+ border: 1px solid #CCCCCC;
+ background-color: #FFFFFF;
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: auto;
+}
+.geTempDlgContent {
+ box-sizing: border-box;
+ float: right;
+ height: calc(100% - 118px);
+ width: 80%;
+ border: 1px solid #CCCCCC;
+ background-color: #FFFFFF;
+ display: inline-block;
+ overflow-x: hidden;
+ overflow-y: auto;
+ position: relative;
+}
+.geTempDlgFooter {
+ box-sizing: border-box;
+ height: 52px;
+ width: 100%;
+ border: 1px solid #CCCCCC;
+ border-radius: 0 0 5px 5px;
+ background-color: #F5F5F5;
+ text-align: right;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ padding-top: 11px;
+}
+.geTempDlgCreateBtn, .geTempDlgOpenBtn {
+ display: inline-block;
+ width: 67px;
+ border-radius: 3px;
+ background-color: #3D72AD;
+ padding: 6px;
+ text-align: center;
+ color: #fff;
+ cursor: pointer;
+ margin-left: 5px;
+}
+.geTempDlgCancelBtn {
+ display: inline-block;
+ width: 67px;
+ padding: 6px;
+ text-align: center;
+ color: #3D72AD;
+ cursor: pointer;
+}
+.geTempDlgCancelBtn:active, .geTempDlgCreateBtn:active,
+.geTempDlgOpenBtn:active, .geTempDlgShowAllBtn:active {
+ transform: translateY(2px);
+}
+.geTempDlgBtnDisabled {
+ background-color: #9fbddd;
+}
+.geTempDlgBtnDisabled:active {
+ transform: translateY(0px);
+}
+
+.geTempDlgBtnBusy {
+ background-image: url(/images/aui-wait.gif);
+ background-repeat: no-repeat;
+ background-position: 62px 7px;
+}
+
+.geTempDlgBack {
+ height: 17px;
+ color: #333333;
+ font-family: Helvetica;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 17px;
+ padding: 25px 0 0 20px;
+ cursor: pointer;
+}
+.geTempDlgHLine {
+ height: 1px;
+ width: calc(100% - 22px);
+ background-color: #CCCCCC;
+ margin: 20px 0 0 11px;
+}
+.geTemplatesLbl {
+ height: 17px;
+ color: #6D6D6D;
+ font-family: Helvetica;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 17px;
+ text-transform: uppercase;
+ margin: 20px 0 3px 20px;
+}
+.geTemplateCatLink {
+ height: 17px;
+ color: #3D72AD;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ margin: 12px 0 0 20px;
+ cursor: pointer;
+}
+.geTempDlgNewDiagramCat {
+ height: 280px;
+ width: 100%;
+ background-color: #555555;
+}
+.geTempDlgNewDiagramCatLbl {
+ height: 17px;
+ color: #FFFFFF;
+ font-family: Helvetica;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 17px;
+ padding: 25px 0 0 20px;
+ text-transform: uppercase;
+}
+.geTempDlgNewDiagramCatList {
+ width: 100%;
+ height: 190px;
+ padding-left: 9px;
+ box-sizing: border-box;
+ overflow-y: auto;
+ overflow-x: hidden;
+}
+.geTempDlgNewDiagramCatFooter {
+ width: 100%;
+}
+.geTempDlgShowAllBtn {
+ width: 78px;
+ border: 1px solid #777777;
+ border-radius: 3px;
+ cursor: pointer;
+ text-align: center;
+ color: #DDDDDD;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ padding: 4px;
+ float: right;
+ margin-right: 30px;
+}
+.geTempDlgNewDiagramCatItem {
+ height: 155px;
+ width: 134px;
+ padding: 18px 6px 0 9px;
+ display: inline-block;
+}
+
+.geTempDlgNewDiagramCatItemImg {
+ box-sizing: border-box;
+ height: 134px;
+ width: 134px;
+ border: 1px solid #CCCCCC;
+ border-radius: 3px;
+ background-color: #FFFFFF;
+ display:table-cell;
+ vertical-align:middle;
+ text-align:center;
+ cursor: pointer;
+}
+
+.geTempDlgNewDiagramCatItemActive > .geTempDlgNewDiagramCatItemImg {
+ border: 4px solid #3D72AD;
+}
+
+.geTempDlgNewDiagramCatItemLbl {
+ height: 17px;
+ width: 100%;
+ color: #FFFFFF;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ text-align: center;
+ padding-top: 4px;
+ cursor: pointer;
+}
+
+.geTempDlgDiagramsList {
+ box-sizing: border-box;
+ width: 100%;
+ min-height: calc(100% - 280px);
+ padding-left: 9px;
+ box-sizing: border-box;
+ background-color: #E5E5E5;
+}
+
+.geTempDlgDiagramsListHeader {
+ width: 100%;
+ height: 45px;
+ padding: 18px 20px 0 11px;
+ box-sizing: border-box;
+}
+.geTempDlgDiagramsListTitle {
+ box-sizing: border-box;
+ height: 17px;
+ color: #666666;
+ font-family: Helvetica;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 17px;
+ text-transform: uppercase;
+ padding-top: 5px;
+ display: inline-block;
+}
+.geTempDlgDiagramsListBtns {
+ float: right;
+ margin-top: -9px;
+}
+.geTempDlgRadioBtn {
+ box-sizing: border-box;
+ border: 1px solid #CCCCCC;
+ border-radius: 3px;
+ background-color: #FFFFFF;
+ color: #333333;
+ display: inline-block;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ text-align: center;
+ padding: 4px;
+ cursor: pointer;
+}
+.geTempDlgRadioBtnActive {
+ background-color: #555555;
+ color: #FFFFFF;
+}
+.geTempDlgRadioBtnLarge {
+ height: 27px;
+ width: 120px;
+}
+/* TODO is there a better way for these buttons */
+.geTempDlgRadioBtnSmall {
+ position: relative;
+ top: 9px;
+ height: 27px;
+ width: 27px;
+}
+.geTempDlgRadioBtnSmall img {
+ position: absolute;
+ top: 6px;
+ left: 6px;
+ height: 13px;
+ width: 13px;
+}
+.geTempDlgSpacer {
+ display: inline-block;
+ width: 10px;
+}
+
+.geTempDlgDiagramsListGrid {
+ width: 100%;
+ white-space: nowrap;
+ font-size: 13px;
+ padding: 0px 20px 20px 10px;
+ box-sizing: border-box;
+ border-spacing: 0;
+}
+
+.geTempDlgDiagramsListGrid tr {
+ height: 40px;
+}
+
+.geTempDlgDiagramsListGrid th {
+ background-color: #E5E5E5;
+ color: #8E8E8E;
+ font-weight: bold;
+ text-align: left;
+ padding: 5px;
+ border-bottom: 1px solid #CCCCCC;
+ font-size: 14px;
+}
+
+.geTempDlgDiagramsListGrid td {
+ background-color: #FFFFFF;
+ color: #888888;
+ padding: 5px;
+ border-bottom: 1px solid #CCCCCC;
+ overflow: hidden;
+}
+
+.geTempDlgDiagramsListGridActive td {
+ border-bottom: 2px solid #3D72AD;
+ border-top: 2px solid #3D72AD;
+}
+
+.geTempDlgDiagramsListGridActive td:first-child {
+ border-left: 2px solid #3D72AD;
+}
+
+.geTempDlgDiagramsListGridActive td:last-child {
+ border-right: 2px solid #3D72AD;
+}
+
+.geTempDlgDiagramTitle {
+ font-weight: bold;
+ color: #666666 !important;
+}
+
+.geTempDlgDiagramsTiles {
+ position: relative;
+ min-height: 100px;
+}
+
+.geTempDlgDiagramTile {
+ height: 152px;
+ width: 130px;
+ padding: 20px 7px 0 10px;
+ display: inline-block;
+ position: relative;
+}
+
+.geTempDlgDiagramTileImg {
+ box-sizing: border-box;
+ height: 130px;
+ width: 130px;
+ border: 1px solid #CCCCCC;
+ border-radius: 3px;
+ background-color: #FFFFFF;
+ display:table-cell;
+ vertical-align:middle;
+ text-align:center;
+}
+
+.geTempDlgDiagramTileImgLoading {
+ background-image: url(/images/aui-wait.gif);
+ background-repeat: no-repeat;
+ background-position: center;
+}
+
+.geTempDlgDiagramTileImgError {
+ background-image: url(/images/broken.png);
+ background-repeat: no-repeat;
+ background-position: center;
+ background-color: #be3730;
+}
+
+.geTempDlgDiagramTileImg img{
+ max-width: 117px;
+ max-height: 117px;
+ cursor: pointer;
+}
+
+.geTempDlgDiagramTileActive > .geTempDlgDiagramTileImg{
+ border: 4px solid #3D72AD;
+}
+
+.geTempDlgDiagramTileLbl {
+ height: 17px;
+ width: 100%;
+ color: #333333;
+ font-family: Helvetica;
+ font-size: 14px;
+ line-height: 17px;
+ text-align: center;
+ padding-top: 5px;
+ cursor: pointer;
+}
+
+.geTempDlgDiagramPreviewBtn {
+ position: absolute;
+ top: 28px;
+ right: 15px;
+ cursor: pointer;
+}
+
+.geTempDlgDiagramListPreviewBtn {
+ cursor: pointer;
+ padding-left: 5px;
+ padding-right: 15px;
+}
+
+.geTempDlgDiagramPreviewBox {
+ position: absolute;
+ top: 3%;
+ left: 10%;
+ width: 80%;
+ height: 94%;
+ background: white;
+ border: 4px solid #3D72AD;
+ border-radius: 6px;
+ box-sizing: border-box;
+ display:table-cell;
+ vertical-align:middle;
+ text-align:center;
+ z-index: 2;
+}
+
+.geTempDlgDialogMask {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 1;
+}
+
+.geTempDlgDiagramPreviewBox img {
+ max-width: 95%;
+ max-height: 95%;
+ vertical-align: middle;
+}
+
+.geTempDlgPreviewCloseBtn {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ cursor: pointer;
+}
+
+.geTempDlgLinkToDiagramHint {
+ color: #555;
+}
+
+.geTempDlgLinkToDiagramBtn {
+ color: #555;
+ margin: 0 10px 0 10px;
+ height: 27px;
+ font-size: 14px;
+}
+
+.geTempDlgErrMsg {
+ display: none;
+ color: red;
+ position: absolute;
+ width: 100%;
+ text-align: center;
+}
+
+.geTempDlgImportCat {
+ font-weight: bold;
+ background: #f9f9f9;
+ padding: 5px 0px;
+ padding: 10px;
+ margin: 10px 10px 0px 0px;
+}
+/* Comments CSS */
+.geCommentsWin {
+ user-select: none;
+ border: 1px solid whiteSmoke;
+ height: 100%;
+ margin-bottom: 10px;
+ overflow: auto;
+}
+
+.geCommentsToolbar {
+ position: absolute;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ overflow: hidden;
+ border-width: 1px 0px 0px 0px;
+ border-color: #c3c3c3;
+ border-style: solid;
+ display: block;
+ white-space: nowrap;
+}
+
+.geCommentsList {
+ position: absolute;
+ overflow: auto;
+ left: 0px;
+ right: 0px;
+ top: 0px;
+}
+
+.geCommentContainer {
+ position: relative;
+ padding: 12px;
+ margin: 5px;
+ min-height: 50px;
+ display: block;
+ background-color: white;
+ border-width: 0px 0px 1px 0px;
+ border-color: #c3c3c3;
+ border-style: solid;
+ border-radius: 10px;
+ white-space: nowrap;
+ box-shadow: 2px 2px 6px rgba(60,64,67,.15);
+ color: #3C4043;
+}
+
+.geCommentHeader {
+ width: 100%;
+ height: 32px;
+}
+
+.geCommentUserImg {
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ float: left;
+ background-color: whitesmoke;
+}
+
+.geCommentHeaderTxt {
+ overflow: hidden;
+ height: 32px;
+ padding-left: 5px;
+}
+
+.geCommentUsername {
+ overflow: hidden;
+ height: 18px;
+ font-size: 15px;
+ font-weight: bold;
+ text-overflow: ellipsis;
+}
+
+.geCommentDate {
+ color: #707070;
+ overflow: hidden;
+ height: 14px;
+ font-size: 11px;
+ text-overflow: ellipsis;
+}
+
+.geCommentDate::first-letter {
+ text-transform: uppercase;
+}
+
+.geCommentTxt {
+ font-size: 14px;
+ padding-top: 5px;
+ white-space: normal;
+ min-height: 12px;
+}
+
+.geCommentEditTxtArea {
+ margin-top: 5px;
+ font-size: 14px !important;
+ min-height: 12px;
+ max-width: 100%;
+ min-width: 100%;
+ width: 100%;
+ box-sizing: border-box;
+}
+
+.geCommentEditBtns {
+ width: 100%;
+ box-sizing: border-box;
+ padding-top: 5px;
+ height: 20px;
+}
+
+.geCommentEditBtn {
+ padding: 3px 8px 3px 8px !important;
+ float: right !important;
+ margin-left: 5px;
+}
+
+.geCommentActions {
+ color: #707070;
+ font-size: 12px;
+}
+
+.geCommentActionsList {
+ list-style-type: disc;
+ margin: 0px;
+ padding: 10px 0 0 0;
+}
+
+.geCommentAction {
+ display: inline-block;
+ padding: 0;
+}
+
+.geCommentAction:before {
+ content: "\2022";
+ padding: 5px;
+}
+
+.geCommentAction:first-child:before {
+ content: "";
+ padding: 0;
+}
+
+.geCommentActionLnk {
+ cursor: pointer;
+ color: #707070;
+ text-decoration: none;
+}
+
+.geCommentActionLnk:hover {
+ text-decoration: underline;
+}
+
+.geCheckedBtn {
+ background-color: #ccc;
+ border-top: 1px solid black !important;
+ border-left: 1px solid black !important;
+}
+
+.geCommentBusyImg {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+}
+
+.geAspectDlgListItem
+{
+ width : 120px;
+ height : 120px;
+ display : inline-block;
+ border: 3px solid #F0F0F0;
+ border-radius: 5px;
+ padding: 5px;
+ margin : 2px 2px 20px 2px;
+}
+
+.geAspectDlgListItem:hover
+{
+ border: 3px solid #c5c5c5;
+}
+
+.geAspectDlgListItemSelected
+{
+ border: 3px solid #3b73af;
+}
+
+.geAspectDlgListItemSelected:hover
+{
+ border: 3px solid #405a86;
+}
+
+.geAspectDlgListItemText
+{
+ text-overflow: ellipsis;
+ max-width: 100%;
+ min-height : 2em;
+ overflow : hidden;
+ text-align : center;
+ margin-top : 10px;
+}
+
+.geAspectDlgList
+{
+ min-height: 184px;
+ white-space: nowrap;
+}
+
+.geStripedTable
+{
+ border-collapse: collapse;
+ width: 100%;
+ table-layout: fixed;
+}
+
+.geStripedTable td, .geStripedTable th
+{
+ border: 1px solid #ddd;
+ text-align: left;
+ padding: 2px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.geStripedTable tr:nth-child(odd){background-color: #f2f2f2;}
+
+.geStripedTable tr:hover {background-color: #ddd;}
+
+.geStripedTable th {
+ padding-top: 4px;
+ padding-bottom: 4px;
+ background-color: #bbb;
+}
+
+.geNotification-box {
+ display:flex;
+ text-align: center;
+ position: relative;
+ cursor: pointer;
+ width: 20px;
+}
+.geNotification-bell {
+ animation: geBellAnim 1s 1s both;
+}
+.geNotification-bell * {
+ display: block;
+ margin: 0 auto;
+ background-color: #656565;
+}
+
+.geBell-top {
+ width: 2px;
+ height: 2px;
+ border-radius: 1px 1px 0 0;
+}
+.geBell-middle {
+ width: 12px;
+ height: 12px;
+ margin-top: -1px;
+ border-radius: 7px 7px 0 0;
+}
+.geBell-bottom {
+ position: relative;
+ z-index: 0;
+ width: 16px;
+ height: 1px;
+}
+.geBell-bottom::before,
+.geBell-bottom::after {
+ content: '';
+ position: absolute;
+ top: -4px;
+}
+.geBell-bottom::before {
+ left: 1px;
+ border-bottom-width: 4px;
+ border-right: 0 solid transparent;
+ border-left: 4px solid transparent;
+}
+.geBell-bottom::after {
+ right: 1px;
+ border-bottom-width: 4px;
+ border-right: 4px solid transparent;
+ border-left: 0 solid transparent;
+}
+.geBell-rad {
+ width: 3px;
+ height: 2px;
+ margin-top: 0.5px;
+ border-radius: 0 0 2px 2px;
+ animation: geRadAnim 1s 2s both;
+}
+.geNotification-count {
+ position: absolute;
+ z-index: 1;
+ top: -5px;
+ right: -4px;
+ width: 13px;
+ height: 13px;
+ line-height: 13px;
+ font-size: 8px;
+ border-radius: 50%;
+ background-color: #ff4927;
+ color: #FFF;
+ animation: geZoomAnim 1s 1s both;
+}
+@keyframes geBellAnim {
+ 0% { transform: rotate(0); }
+ 10% { transform: rotate(30deg); }
+ 20% { transform: rotate(0); }
+ 80% { transform: rotate(0); }
+ 90% { transform: rotate(-30deg); }
+ 100% { transform: rotate(0); }
+}
+@keyframes geRadAnim {
+ 0% { transform: translateX(0); }
+ 10% { transform: translateX(5px); }
+ 20% { transform: translateX(0); }
+ 80% { transform: translateX(0); }
+ 90% { transform: translateX(-5px); }
+ 100% { transform: translateX(0); }
+}
+@keyframes geZoomAnim {
+ 0% { opacity: 0; transform: scale(0); }
+ 50% { opacity: 1; transform: scale(1); }
+ 100% { opacity: 1; }
+}
+
+.geNotifPanel {
+ height: 300px;
+ width: 300px;
+ background: #fff;
+ border-radius: 3px;
+ overflow: hidden;
+ -webkit-box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3);
+ box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3);
+ -webkit-transition: all .5s ease-in-out;
+ transition: all .5s ease-in-out;
+ position: absolute;
+ right: 100px;
+ top: 42px;
+ z-index: 150;
+}
+.geNotifPanel .header {
+ background: #cecece;
+ color: #707070;
+ font-size: 15px;
+}
+.geNotifPanel .header .title {
+ display: block;
+ text-align: center;
+ line-height: 30px;
+ font-weight: 600;
+}
+.geNotifPanel .header .closeBtn {
+ position: absolute;
+ line-height: 30px;
+ cursor: pointer;
+ right: 15px;
+ top: 0;
+}
+.geNotifPanel .notifications {
+ position: relative;
+ height: 270px;
+ overflow-x: hidden;
+ overflow-y: auto;
+}
+.geNotifPanel .notifications .line {
+ position: absolute;
+ top: 0;
+ left: 27px;
+ height: 100%;
+ width: 3px;
+ background: #EBEBEB;
+}
+.geNotifPanel .notifications .notification {
+ position: relative;
+ z-index: 2;
+ margin: 25px 20px 25px 43px;
+}
+.geNotifPanel .notifications .notification:nth-child(n+1) {
+ animation: geHere-am-i 0.5s ease-out 0.4s;
+ animation-fill-mode: both;
+}
+.geNotifPanel .notifications .notification:hover {
+ color: #1B95E0;
+ cursor: pointer;
+}
+.geNotifPanel .notifications .notification .circle {
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ position: absolute;
+ height: 11px;
+ width: 11px;
+ background: #fff;
+ border: 2px solid #1B95E0;
+ -webkit-box-shadow: 0 0 0 3px #fff;
+ box-shadow: 0 0 0 3px #fff;
+ border-radius: 6px;
+ top: 0;
+ left: -20px;
+}
+
+.geNotifPanel .notifications .notification .circle.active {
+ background: #1B95E0;
+}
+
+.geNotifPanel .notifications .notification .time {
+ display: block;
+ font-size: 11px;
+ line-height: 11px;
+ margin-bottom: 2px;
+}
+.geNotifPanel .notifications .notification p {
+ font-size: 15px;
+ line-height: 20px;
+ margin: 0;
+}
+.geNotifPanel .notifications .notification p b {
+ font-weight: 600;
+}
+@-webkit-keyframes geHere-am-i {
+ from {
+ -webkit-transform: translate3d(0, 50px, 0);
+ transform: translate3d(0, 50px, 0);
+ opacity: 0;
+ }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0);
+ opacity: 1;
+ }
+}
+
+@keyframes geHere-am-i {
+ from {
+ -webkit-transform: translate3d(0, 50px, 0);
+ transform: translate3d(0, 50px, 0);
+ opacity: 0;
+ }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0);
+ opacity: 1;
+ }
+}
+
+.geTempTree {
+ margin: 0;
+ padding: 0;
+}
+
+.geTempTree, .geTempTreeActive, .geTempTreeNested {
+ list-style-type: none;
+ transition: all 0.5s;
+}
+
+.geTempTreeCaret {
+ box-sizing: border-box;
+ cursor: pointer;
+ user-select: none;
+ padding: 6px;
+ width: 100%;
+ transition: all 0.5s;
+}
+
+.geTempTreeCaret::before {
+ content: "\25B6";
+ display: inline-block;
+ font-size: 10px;
+ margin-right: 6px;
+}
+
+.geTempTreeCaret-down::before {
+ transform: rotate(90deg);
+}
+
+.geTempTreeNested {
+ height: 0;
+ opacity: 0;
+}
+
+.geTempTreeActive {
+ height: 100%;
+ opacity: 1;
+}
+
+.geTempTreeActive, .geTempTreeNested {
+ padding-left: 15px;
+}
+
+.geTempTreeActive > li, .geTempTreeNested > li {
+ box-sizing: border-box;
+ padding: 3px;
+ width: 100%;
+ cursor: pointer;
+ user-select: none;
+ transition: all 0.5s;
+}
+
+/*Electron Window Controls*/
+#geWindow-controls {
+ display: grid;
+ grid-template-columns: repeat(3, 30px);
+ position: absolute;
+ top: 2px;
+ right: 3px;
+ height: 22px;
+ -webkit-app-region: no-drag;
+}
+
+#geWindow-controls .button {
+ grid-row: 1 / span 1;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: 100%;
+ user-select: none;
+}
+#min-button {
+ grid-column: 1;
+}
+#max-button, #restore-button {
+ grid-column: 2;
+}
+#close-button {
+ grid-column: 3;
+}
+#geWindow-controls .button.dark:hover {
+ background: rgba(255,255,255,0.1);
+}
+#geWindow-controls .button.dark:active {
+ background: rgba(255,255,255,0.2);
+}
+
+#geWindow-controls .button.white:hover {
+ background: rgba(0,0,0,0.1);
+}
+#geWindow-controls .button.white:active {
+ background: rgba(0,0,0,0.2);
+}
+
+#close-button:hover {
+ background: #E81123 !important;
+}
+#close-button:active {
+ background: #F1707A !important;
+}
+
+#restore-button {
+ display: none !important;
+}
+/*
+.geMaximized #titlebar {
+ width: 100%;
+ padding: 0;
+}
+*/
+.geMaximized #restore-button {
+ display: flex !important;
+}
+
+.geMaximized #max-button {
+ display: none;
+}
+[draggable="true"] {
+ transform: translate(0, 0);
+ z-index: 0;
+}
diff --git a/oaweb/public/cherry/drawio/image/checkmark.gif b/oaweb/public/cherry/drawio/image/checkmark.gif
new file mode 100644
index 0000000..b757a42
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/checkmark.gif differ
diff --git a/oaweb/public/cherry/drawio/image/clear.gif b/oaweb/public/cherry/drawio/image/clear.gif
new file mode 100644
index 0000000..e137972
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/clear.gif differ
diff --git a/oaweb/public/cherry/drawio/image/close.png b/oaweb/public/cherry/drawio/image/close.png
new file mode 100644
index 0000000..d319efb
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/close.png differ
diff --git a/oaweb/public/cherry/drawio/image/collapsed.gif b/oaweb/public/cherry/drawio/image/collapsed.gif
new file mode 100644
index 0000000..8442c35
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/collapsed.gif differ
diff --git a/oaweb/public/cherry/drawio/image/dropdown.gif b/oaweb/public/cherry/drawio/image/dropdown.gif
new file mode 100644
index 0000000..ea03c29
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/dropdown.gif differ
diff --git a/oaweb/public/cherry/drawio/image/dropdown.png b/oaweb/public/cherry/drawio/image/dropdown.png
new file mode 100644
index 0000000..53668d8
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/dropdown.png differ
diff --git a/oaweb/public/cherry/drawio/image/edit.gif b/oaweb/public/cherry/drawio/image/edit.gif
new file mode 100644
index 0000000..3c07607
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/edit.gif differ
diff --git a/oaweb/public/cherry/drawio/image/expanded.gif b/oaweb/public/cherry/drawio/image/expanded.gif
new file mode 100644
index 0000000..aece761
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/expanded.gif differ
diff --git a/oaweb/public/cherry/drawio/image/grid.gif b/oaweb/public/cherry/drawio/image/grid.gif
new file mode 100644
index 0000000..da699f8
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/grid.gif differ
diff --git a/oaweb/public/cherry/drawio/image/handle-fixed.png b/oaweb/public/cherry/drawio/image/handle-fixed.png
new file mode 100644
index 0000000..aed1cbe
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/handle-fixed.png differ
diff --git a/oaweb/public/cherry/drawio/image/handle-main.png b/oaweb/public/cherry/drawio/image/handle-main.png
new file mode 100644
index 0000000..e9a9962
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/handle-main.png differ
diff --git a/oaweb/public/cherry/drawio/image/handle-rotate.png b/oaweb/public/cherry/drawio/image/handle-rotate.png
new file mode 100644
index 0000000..4347ec0
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/handle-rotate.png differ
diff --git a/oaweb/public/cherry/drawio/image/handle-secondary.png b/oaweb/public/cherry/drawio/image/handle-secondary.png
new file mode 100644
index 0000000..b0626ef
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/handle-secondary.png differ
diff --git a/oaweb/public/cherry/drawio/image/handle-terminal.png b/oaweb/public/cherry/drawio/image/handle-terminal.png
new file mode 100644
index 0000000..c07c67e
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/handle-terminal.png differ
diff --git a/oaweb/public/cherry/drawio/image/help.png b/oaweb/public/cherry/drawio/image/help.png
new file mode 100644
index 0000000..c5dba91
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/help.png differ
diff --git a/oaweb/public/cherry/drawio/image/hs.png b/oaweb/public/cherry/drawio/image/hs.png
new file mode 100644
index 0000000..3d94486
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/hs.png differ
diff --git a/oaweb/public/cherry/drawio/image/hv.png b/oaweb/public/cherry/drawio/image/hv.png
new file mode 100644
index 0000000..1c5e01f
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/hv.png differ
diff --git a/oaweb/public/cherry/drawio/image/locked.png b/oaweb/public/cherry/drawio/image/locked.png
new file mode 100644
index 0000000..cfe371f
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/locked.png differ
diff --git a/oaweb/public/cherry/drawio/image/logo.png b/oaweb/public/cherry/drawio/image/logo.png
new file mode 100644
index 0000000..04fa132
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/logo.png differ
diff --git a/oaweb/public/cherry/drawio/image/nocolor.png b/oaweb/public/cherry/drawio/image/nocolor.png
new file mode 100644
index 0000000..697007b
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/nocolor.png differ
diff --git a/oaweb/public/cherry/drawio/image/refresh.png b/oaweb/public/cherry/drawio/image/refresh.png
new file mode 100644
index 0000000..e184a2c
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/refresh.png differ
diff --git a/oaweb/public/cherry/drawio/image/round-drop.png b/oaweb/public/cherry/drawio/image/round-drop.png
new file mode 100644
index 0000000..c78d5ab
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/round-drop.png differ
diff --git a/oaweb/public/cherry/drawio/image/search.png b/oaweb/public/cherry/drawio/image/search.png
new file mode 100644
index 0000000..251e345
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/search.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/arrows.xml b/oaweb/public/cherry/drawio/image/stencils/arrows.xml
new file mode 100644
index 0000000..5e39b3c
--- /dev/null
+++ b/oaweb/public/cherry/drawio/image/stencils/arrows.xml
@@ -0,0 +1,849 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/image/stencils/basic.xml b/oaweb/public/cherry/drawio/image/stencils/basic.xml
new file mode 100644
index 0000000..fe866c8
--- /dev/null
+++ b/oaweb/public/cherry/drawio/image/stencils/basic.xml
@@ -0,0 +1,895 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/image/stencils/bpmn.xml b/oaweb/public/cherry/drawio/image/stencils/bpmn.xml
new file mode 100644
index 0000000..af8918d
--- /dev/null
+++ b/oaweb/public/cherry/drawio/image/stencils/bpmn.xml
@@ -0,0 +1,1162 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Credit_Card_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Credit_Card_128x128.png
new file mode 100644
index 0000000..33207ee
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Credit_Card_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Database_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Database_128x128.png
new file mode 100644
index 0000000..8343951
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Database_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Doctor1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Doctor1_128x128.png
new file mode 100644
index 0000000..8a01fed
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Doctor1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Earth_globe_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Earth_globe_128x128.png
new file mode 100644
index 0000000..6ce1524
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Earth_globe_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Email_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Email_128x128.png
new file mode 100644
index 0000000..f0daa2a
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Email_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Empty_Folder_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Empty_Folder_128x128.png
new file mode 100644
index 0000000..dde142d
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Empty_Folder_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Firewall_02_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Firewall_02_128x128.png
new file mode 100644
index 0000000..546232b
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Firewall_02_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Full_Folder_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Full_Folder_128x128.png
new file mode 100644
index 0000000..12cd97e
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Full_Folder_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Gear_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Gear_128x128.png
new file mode 100644
index 0000000..95f5f62
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Gear_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Graph_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Graph_128x128.png
new file mode 100644
index 0000000..aa0af98
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Graph_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Laptop_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Laptop_128x128.png
new file mode 100644
index 0000000..b750c70
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Laptop_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Lock_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Lock_128x128.png
new file mode 100644
index 0000000..a4edcdd
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Lock_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/MacBook_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/MacBook_128x128.png
new file mode 100644
index 0000000..6ec2ab2
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/MacBook_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Monitor_Tower_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Monitor_Tower_128x128.png
new file mode 100644
index 0000000..de667f7
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Monitor_Tower_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Piggy_Bank_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Piggy_Bank_128x128.png
new file mode 100644
index 0000000..b53aec1
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Piggy_Bank_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Pilot1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Pilot1_128x128.png
new file mode 100644
index 0000000..0e94003
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Pilot1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Printer_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Printer_128x128.png
new file mode 100644
index 0000000..3ba0f3c
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Printer_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Router_Icon_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Router_Icon_128x128.png
new file mode 100644
index 0000000..66c5f2d
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Router_Icon_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Safe_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Safe_128x128.png
new file mode 100644
index 0000000..85a3541
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Safe_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Security1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Security1_128x128.png
new file mode 100644
index 0000000..76d7a22
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Security1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Server_Tower_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Server_Tower_128x128.png
new file mode 100644
index 0000000..ebaa7a0
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Server_Tower_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Shopping_Cart_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Shopping_Cart_128x128.png
new file mode 100644
index 0000000..6b0aa4d
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Shopping_Cart_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Software_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Software_128x128.png
new file mode 100644
index 0000000..0e27a69
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Software_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Soldier1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Soldier1_128x128.png
new file mode 100644
index 0000000..c864949
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Soldier1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Suit1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit1_128x128.png
new file mode 100644
index 0000000..87f28b6
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Suit2_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit2_128x128.png
new file mode 100644
index 0000000..6126db7
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit2_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Suit3_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit3_128x128.png
new file mode 100644
index 0000000..feaa45a
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Suit3_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Tech1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Tech1_128x128.png
new file mode 100644
index 0000000..74f1f2d
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Tech1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Telesales1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Telesales1_128x128.png
new file mode 100644
index 0000000..18344b9
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Telesales1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Virtual_Machine_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Virtual_Machine_128x128.png
new file mode 100644
index 0000000..5698a79
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Virtual_Machine_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Virus_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Virus_128x128.png
new file mode 100644
index 0000000..5516af7
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Virus_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Wireless_Router_N_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Wireless_Router_N_128x128.png
new file mode 100644
index 0000000..469e662
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Wireless_Router_N_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Worker1_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Worker1_128x128.png
new file mode 100644
index 0000000..60048eb
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Worker1_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/Workstation_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/Workstation_128x128.png
new file mode 100644
index 0000000..c1a594a
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/Workstation_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/iMac_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/iMac_128x128.png
new file mode 100644
index 0000000..4f7c4ef
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/iMac_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/clipart/iPad_128x128.png b/oaweb/public/cherry/drawio/image/stencils/clipart/iPad_128x128.png
new file mode 100644
index 0000000..145d34b
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/stencils/clipart/iPad_128x128.png differ
diff --git a/oaweb/public/cherry/drawio/image/stencils/flowchart.xml b/oaweb/public/cherry/drawio/image/stencils/flowchart.xml
new file mode 100644
index 0000000..e6ec9d2
--- /dev/null
+++ b/oaweb/public/cherry/drawio/image/stencils/flowchart.xml
@@ -0,0 +1,920 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/image/tooltip.png b/oaweb/public/cherry/drawio/image/tooltip.png
new file mode 100644
index 0000000..bbe6e16
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/tooltip.png differ
diff --git a/oaweb/public/cherry/drawio/image/transparent.gif b/oaweb/public/cherry/drawio/image/transparent.gif
new file mode 100644
index 0000000..76040f2
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/transparent.gif differ
diff --git a/oaweb/public/cherry/drawio/image/triangle-down.png b/oaweb/public/cherry/drawio/image/triangle-down.png
new file mode 100644
index 0000000..b527b19
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/triangle-down.png differ
diff --git a/oaweb/public/cherry/drawio/image/triangle-left.png b/oaweb/public/cherry/drawio/image/triangle-left.png
new file mode 100644
index 0000000..dc8a3cb
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/triangle-left.png differ
diff --git a/oaweb/public/cherry/drawio/image/triangle-right.png b/oaweb/public/cherry/drawio/image/triangle-right.png
new file mode 100644
index 0000000..4c83b2c
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/triangle-right.png differ
diff --git a/oaweb/public/cherry/drawio/image/triangle-up.png b/oaweb/public/cherry/drawio/image/triangle-up.png
new file mode 100644
index 0000000..7975d05
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/triangle-up.png differ
diff --git a/oaweb/public/cherry/drawio/image/unlocked.png b/oaweb/public/cherry/drawio/image/unlocked.png
new file mode 100644
index 0000000..707010a
Binary files /dev/null and b/oaweb/public/cherry/drawio/image/unlocked.png differ
diff --git a/oaweb/public/cherry/drawio/jscolor/arrow.gif b/oaweb/public/cherry/drawio/jscolor/arrow.gif
new file mode 100644
index 0000000..246478a
Binary files /dev/null and b/oaweb/public/cherry/drawio/jscolor/arrow.gif differ
diff --git a/oaweb/public/cherry/drawio/jscolor/cross.gif b/oaweb/public/cherry/drawio/jscolor/cross.gif
new file mode 100644
index 0000000..0ee9c7a
Binary files /dev/null and b/oaweb/public/cherry/drawio/jscolor/cross.gif differ
diff --git a/oaweb/public/cherry/drawio/jscolor/hs.png b/oaweb/public/cherry/drawio/jscolor/hs.png
new file mode 100644
index 0000000..3d94486
Binary files /dev/null and b/oaweb/public/cherry/drawio/jscolor/hs.png differ
diff --git a/oaweb/public/cherry/drawio/jscolor/hv.png b/oaweb/public/cherry/drawio/jscolor/hv.png
new file mode 100644
index 0000000..1c5e01f
Binary files /dev/null and b/oaweb/public/cherry/drawio/jscolor/hv.png differ
diff --git a/oaweb/public/cherry/drawio/jscolor/jscolor.js b/oaweb/public/cherry/drawio/jscolor/jscolor.js
new file mode 100644
index 0000000..7a7a54b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/jscolor/jscolor.js
@@ -0,0 +1,905 @@
+/**
+ * jscolor, JavaScript Color Picker (name changed to mxJSColor to avoid conflicts)
+ *
+ * @version 1.3.13
+ * @license GNU Lesser General Public License, http://www.gnu.org/copyleft/lesser.html
+ * @author Jan Odvarko, http://odvarko.cz
+ * @created 2008-06-15
+ * @updated 2012-01-19
+ * @link http://jscolor.com
+ */
+
+
+var mxJSColor = {
+
+ bindClass : 'color', // class name
+ binding : true, // automatic binding via
+ preloading : true, // use image preloading?
+
+
+ install : function() {
+ //mxJSColor.addEvent(window, 'load', mxJSColor.init);
+ },
+
+
+ init : function() {
+ if(mxJSColor.preloading) {
+ mxJSColor.preload();
+ }
+ },
+
+
+ getDir : function() {
+ return IMAGE_PATH + '/';
+ },
+
+
+ detectDir : function() {
+ var base = location.href;
+
+ var e = document.getElementsByTagName('base');
+ for(var i=0; i vs[a] ?
+ (-vp[a]+tp[a]+ts[a]/2 > vs[a]/2 && tp[a]+ts[a]-ps[a] >= 0 ? tp[a]+ts[a]-ps[a] : tp[a]) :
+ tp[a],
+ -vp[b]+tp[b]+ts[b]+ps[b]-l+l*c > vs[b] ?
+ (-vp[b]+tp[b]+ts[b]/2 > vs[b]/2 && tp[b]+ts[b]-l-l*c >= 0 ? tp[b]+ts[b]-l-l*c : tp[b]+ts[b]-l+l*c) :
+ (tp[b]+ts[b]-l+l*c >= 0 ? tp[b]+ts[b]-l+l*c : tp[b]+ts[b]-l-l*c)
+ ];
+ }
+ drawPicker(0, 0);
+ }
+ };
+
+
+ this.importColor = function() {
+ if(!valueElement) {
+ this.exportColor();
+ } else {
+ if(!this.adjust) {
+ if(!this.fromString(valueElement.value, leaveValue)) {
+ styleElement.style.backgroundImage = styleElement.jscStyle.backgroundImage;
+ styleElement.style.backgroundColor = styleElement.jscStyle.backgroundColor;
+ styleElement.style.color = styleElement.jscStyle.color;
+ this.exportColor(leaveValue | leaveStyle);
+ }
+ } else if(!this.required && /^\s*$/.test(valueElement.value)) {
+ valueElement.value = '';
+ styleElement.style.backgroundImage = styleElement.jscStyle.backgroundImage;
+ styleElement.style.backgroundColor = styleElement.jscStyle.backgroundColor;
+ styleElement.style.color = styleElement.jscStyle.color;
+ this.exportColor(leaveValue | leaveStyle);
+
+ } else if(this.fromString(valueElement.value)) {
+ // OK
+ } else {
+ this.exportColor();
+ }
+ }
+ };
+
+
+ this.exportColor = function(flags) {
+ if(!(flags & leaveValue) && valueElement) {
+ var value = this.toString();
+ if(this.caps) { value = value.toUpperCase(); }
+ if(this.hash) { value = '#'+value; }
+ valueElement.value = value;
+ }
+ if(!(flags & leaveStyle) && styleElement) {
+ styleElement.style.backgroundImage = "none";
+ styleElement.style.backgroundColor =
+ '#'+this.toString();
+ styleElement.style.color =
+ 0.213 * this.rgb[0] +
+ 0.715 * this.rgb[1] +
+ 0.072 * this.rgb[2]
+ < 0.5 ? '#FFF' : '#000';
+ }
+ if(!(flags & leavePad) && isPickerOwner()) {
+ redrawPad();
+ }
+ if(!(flags & leaveSld) && isPickerOwner()) {
+ redrawSld();
+ }
+ };
+
+
+ this.fromHSV = function(h, s, v, flags) { // null = don't change
+ h<0 && (h=0) || h>6 && (h=6);
+ s<0 && (s=0) || s>1 && (s=1);
+ v<0 && (v=0) || v>1 && (v=1);
+ this.rgb = HSV_RGB(
+ h===null ? this.hsv[0] : (this.hsv[0]=h),
+ s===null ? this.hsv[1] : (this.hsv[1]=s),
+ v===null ? this.hsv[2] : (this.hsv[2]=v)
+ );
+ this.exportColor(flags);
+ };
+
+
+ this.fromRGB = function(r, g, b, flags) { // null = don't change
+ r<0 && (r=0) || r>1 && (r=1);
+ g<0 && (g=0) || g>1 && (g=1);
+ b<0 && (b=0) || b>1 && (b=1);
+ var hsv = RGB_HSV(
+ r===null ? this.rgb[0] : (this.rgb[0]=r),
+ g===null ? this.rgb[1] : (this.rgb[1]=g),
+ b===null ? this.rgb[2] : (this.rgb[2]=b)
+ );
+ if(hsv[0] !== null) {
+ this.hsv[0] = hsv[0];
+ }
+ if(hsv[2] !== 0) {
+ this.hsv[1] = hsv[1];
+ }
+ this.hsv[2] = hsv[2];
+ this.exportColor(flags);
+ };
+
+
+ this.fromString = function(hex, flags) {
+ var m = hex.match(/^\W*([0-9A-F]{3}([0-9A-F]{3})?)\W*$/i);
+ if(!m) {
+ return false;
+ } else {
+ if(m[1].length === 6) { // 6-char notation
+ this.fromRGB(
+ parseInt(m[1].substr(0,2),16) / 255,
+ parseInt(m[1].substr(2,2),16) / 255,
+ parseInt(m[1].substr(4,2),16) / 255,
+ flags
+ );
+ } else { // 3-char notation
+ this.fromRGB(
+ parseInt(m[1].charAt(0)+m[1].charAt(0),16) / 255,
+ parseInt(m[1].charAt(1)+m[1].charAt(1),16) / 255,
+ parseInt(m[1].charAt(2)+m[1].charAt(2),16) / 255,
+ flags
+ );
+ }
+ return true;
+ }
+ };
+
+
+ this.toString = function() {
+ return (
+ (0x100 | Math.round(255*this.rgb[0])).toString(16).substr(1) +
+ (0x100 | Math.round(255*this.rgb[1])).toString(16).substr(1) +
+ (0x100 | Math.round(255*this.rgb[2])).toString(16).substr(1)
+ );
+ };
+
+
+ function RGB_HSV(r, g, b) {
+ var n = Math.min(Math.min(r,g),b);
+ var v = Math.max(Math.max(r,g),b);
+ var m = v - n;
+ if(m === 0) { return [ null, 0, v ]; }
+ var h = r===n ? 3+(b-g)/m : (g===n ? 5+(r-b)/m : 1+(g-r)/m);
+ return [ h===6?0:h, m/v, v ];
+ }
+
+
+ function HSV_RGB(h, s, v) {
+ if(h === null) { return [ v, v, v ]; }
+ var i = Math.floor(h);
+ var f = i%2 ? h-i : 1-(h-i);
+ var m = v * (1 - s);
+ var n = v * (1 - s*f);
+ switch(i) {
+ case 6:
+ case 0: return [v,n,m];
+ case 1: return [n,v,m];
+ case 2: return [m,v,n];
+ case 3: return [m,n,v];
+ case 4: return [n,m,v];
+ case 5: return [v,m,n];
+ }
+ }
+
+
+ function removePicker() {
+ delete mxJSColor.picker.owner;
+ document.getElementsByTagName('body')[0].removeChild(mxJSColor.picker.boxB);
+ }
+
+
+ function drawPicker(x, y) {
+ if(!mxJSColor.picker) {
+ mxJSColor.picker = {
+ box : document.createElement('div'),
+ boxB : document.createElement('div'),
+ pad : document.createElement('div'),
+ padB : document.createElement('div'),
+ padM : document.createElement('div'),
+ sld : document.createElement('div'),
+ sldB : document.createElement('div'),
+ sldM : document.createElement('div'),
+ btn : document.createElement('div'),
+ btnS : document.createElement('span'),
+ btnT : document.createTextNode(THIS.pickerCloseText)
+ };
+ for(var i=0,segSize=4; i{2}，然后返回此标签以尝试再次保存。
+errorSendingFeedback=发送反馈出错。
+errorUpdatingPreview=更新预览出错。
+exit=退出
+exitGroup=退出编辑组
+expand=展开
+export=导出
+exporting=导出中
+exportAs=导出为
+exportAsPng=导出为png
+exportAsXml=导出为xml
+exportOptionsDisabled=已禁止导出
+exportOptionsDisabledDetails=所有者已禁止评论者及浏览者下载、打印或复制该文件。
+externalChanges=External Changes
+extras=其它
+facebook=Facebook
+failedToSaveTryReconnect=保存失败，正在尝试重新连接
+featureRequest=增加功能请求
+feedback=反馈
+feedbackSent=反馈发送成功
+floorplans=平面图
+file=文件
+fileChangedOverwriteDialog=文件已更改。是否覆盖更改？
+fileChangedSyncDialog=The file has been modified. Do you want to synchronize those changes?
+fileChangedSync=The file has been modified. Click here to synchronize.
+overwrite=覆盖
+synchronize=Synchronize
+filename=文件名
+fileExists=文件已存在
+fileNearlyFullSeeFaq=文件即将达到上限，请参阅常见问题一栏
+fileNotFound=未找到文件
+repositoryNotFound=未找到资源库
+fileNotFoundOrDenied=文件未找到。其不存在或您没有查阅权限。
+fileNotLoaded=文件无法加载
+fileNotSaved=文件无法保存
+fileOpenLocation=你想如何打开这些文件？
+filetypeHtml=.html causes file to save as HTML with redirect to cloud URL
+filetypePng=.png causes file to save as PNG with embedded data
+filetypeSvg=.svg causes file to save as SVG with embedded data
+fileWillBeSavedInAppFolder={1}将保存至应用软件文件夹
+fill=填充
+fillColor=填充色
+filterCards=Filter Cards
+find=查找
+fit=适应大小
+fitContainer=调整容器尺寸
+fitIntoContainer=适应容器尺寸
+fitPage=整页显示
+fitPageWidth=适应页面宽度
+fitTo=适应
+fitToSheetsAcross=横向页面
+fitToBy=按
+fitToSheetsDown=纵向页面
+fitTwoPages=双页
+fitWindow=适应视窗大小
+flip=翻转
+flipH=水平翻转
+flipV=垂直翻转
+flowchart=流程图
+folder=文件夹
+font=字体
+fontColor=字体颜色
+fontFamily=字体
+fontSize=字体大小
+forbidden=您没有该文件的访问权限
+format=格式
+formatPanel=格式面板
+formatted=已格式化
+formattedText=已格式化文本
+formatPng=PNG
+formatGif=GIF
+formatJpg=JPEG
+formatPdf=PDF
+formatSql=SQL
+formatSvg=SVG
+formatHtmlEmbedded=HTML
+formatSvgEmbedded=SVG（含XML）
+formatVsdx=VSDX
+formatVssx=VSSX
+formatXmlPlain=XML（普通）
+formatXml=XML
+forum=讨论组/帮助论坛
+fromTemplate=从模板
+fromTemplateUrl=从模板URL地址
+fromText=从文本
+fromUrl=从URL地址
+fromThisPage=从当前页
+fullscreen=全屏
+gap=Gap
+gcp=GCP
+general=通用
+github=GitHub
+gliffy=Gliffy
+global=全局
+googleDocs=Google Docs
+googleDrive=Google Drive
+googleGadget=Google Gadget
+googlePlus=Google+
+googleSharingNotAvailable=Sharing is only available via Google Drive. Please click Open below and share from the more actions menu:
+googleSlides=Google Slides
+googleSites=Google Sites
+gradient=渐变
+gradientColor=颜色
+grid=网格
+gridColor=网格线颜色
+gridSize=网格大小
+group=组合
+guides=参考线
+hateApp=我讨厌draw.io
+heading=标题
+height=高
+help=帮助
+helpTranslate=帮助我们翻译此应用
+hide=隐藏
+hideIt=隐藏{1}
+hidden=已隐藏
+home=首页
+horizontal=水平
+horizontalFlow=水平流动
+horizontalTree=水平树状
+howTranslate=按您的母语水平评判，该翻译如何？
+html=HTML
+htmlText=HTML文本
+id=ID
+iframe=IFrame
+ignore=忽略
+image=图片
+imageUrl=图片URL地址
+images=图片
+imagePreviewError=无法预览图片。请检查URL地址。
+imageTooBig=图片太大
+imgur=Imgur
+import=导入
+importFrom=从...导入
+includeCopyOfMyDiagram=包含图表副本
+increaseIndent=增加缩进
+decreaseIndent=减少缩进
+insert=插入
+insertColumnBefore=左边插入列
+insertColumnAfter=右边插入列
+insertEllipse=插入椭圆
+insertImage=插入图片
+insertHorizontalRule=插入水平标尺
+insertLink=插入链接
+insertPage=插入页面
+insertRectangle=插入矩形
+insertRhombus=Insert Rhombus
+insertRowBefore=上方插入行
+insertRowAfter=下方插入行
+insertText=插入文本
+inserting=正在插入
+invalidFilename=图表名称不能包含以下特殊字符： \ / | : ; { } < > & + ? = "
+invalidLicenseSeeThisPage=您的许可无效，请参阅此页面。
+invalidName=无效名称
+invalidOrMissingFile=无效或丢失的文件
+invalidPublicUrl=无效的公开URL地址
+isometric=等尺寸
+ios=iOS
+italic=斜体
+kennedy=Kennedy
+keyboardShortcuts=快捷键
+layers=图层
+landscape=横向
+language=语言
+leanMapping=价值流图
+lastChange={1}以前最新更改
+lessThanAMinute=一分钟以内
+licensingError=授权出错
+licenseHasExpired={1} 的许可证已于 {2} 过期。请点击此处。
+licenseWillExpire={1} 的许可证将于 {2} 过期。请点击此处。
+lineJumps=Line jumps
+linkAccountRequired=如果图表未公开，则需要提供谷歌账户才能查看该链接。
+linkText=链接文本
+list=列表
+minute=分钟
+minutes=分钟
+hours=小时
+days=天
+months=月
+years=年
+restartForChangeRequired=更改将在页面刷新后生效。
+laneColor=泳道颜色
+lastModified=最近修改
+layout=布局
+left=左
+leftAlign=左对齐
+leftToRight=右对齐
+libraryTooltip=将图形拖放至此或单击+以插入。双击进行编辑。
+lightbox=光箱特效
+line=边框
+lineend=线末端
+lineheight=行距
+linestart=线始端
+linewidth=线宽
+link=链接
+links=链接
+loading=加载中
+lockUnlock=加锁/解锁
+loggedOut=登出
+logIn=登入
+loveIt=我爱{1}
+lucidchart=Lucidchart
+maps=Maps
+mathematicalTypesetting=数学排版
+makeCopy=创建副本
+manual=手册
+microsoftExcel=Microsoft Excel
+microsoftPowerPoint=Microsoft PowerPoint
+microsoftWord=Microsoft Word
+middle=垂直居中
+minimal=Minimal
+misc=杂项
+mockups=实体模型
+modificationDate=修改日期
+modifiedBy=修改者
+more=更多
+moreResults=更多结果
+moreShapes=更多图形
+move=移动
+moveToFolder=移动至文件夹
+moving=移动中
+moveSelectionTo=将所选移至{1}
+name=名称
+navigation=导航
+network=Network
+networking=网络
+new=新增
+newLibrary=新增图库
+nextPage=下一页
+no=没有
+noPickFolder=No, pick folder
+noAttachments=未找到附件
+noColor=无颜色
+noFiles=无文件
+noFileSelected=未选择文件
+noLibraries=未找到图库
+noMoreResults=无其他结果
+none=无
+noOtherViewers=无其他查阅者
+noPlugins=无插件
+noPreview=无预览
+noResponse=服务器无响应
+noResultsFor=未找到'{1}'的相关结果
+noRevisions=无修订
+noSearchResults=查询无结果
+noPageContentOrNotSaved=此页面上找不到锚点，或尚未保存
+normal=正常
+north=向上
+notADiagramFile=非图表文件
+notALibraryFile=非图库文件
+notAvailable=不可用
+notAUtf8File=非 UTF-8 格式文件
+notConnected=未连接
+note=备注
+notUsingService=未使用{1}?
+numberedList=编号列表
+offline=离线
+ok=确定
+oneDrive=OneDrive
+online=线上
+opacity=不透明度
+open=打开
+openArrow=开放的箭头
+openExistingDiagram=打开现有图表
+openFile=打开文件
+openFrom=从...打开
+openLibrary=打开图库
+openLibraryFrom=从...打开图库
+openLink=打开链接
+openInNewWindow=在新窗口打开
+openInThisWindow=在当前窗口打开
+openIt=打开{1}
+openRecent=打开最近使用的文件
+openSupported=此软件支持的格式为从本软件(.xml), .vsdx 及 .gliffy存储的文件
+options=选项
+organic=力导向布局图
+orthogonal=正交
+otherViewer=其他查阅者
+otherViewers=其他查阅者
+outline=缩略图
+oval=椭圆形
+page=页面
+pageContent=页面内容
+pageNotFound=未找到页面
+pageWithNumber=第 {1} 页
+pages=页面
+pageView=页面视图
+pageSetup=页面设置
+pageScale=页面比例
+pan=移动画布
+panTooltip=按住空格键并拖拽以移动画布
+paperSize=页面尺寸
+pattern=样式
+paste=粘贴
+pasteHere=贴于此处
+pasteSize=Paste Size
+pasteStyle=粘贴样式
+perimeter=周长
+permissionAnyone=任何人均可编辑
+permissionAuthor=只有本人可编辑
+pickFolder=选择文件夹
+pickLibraryDialogTitle=选择图库
+publicDiagramUrl=图表的公共URL地址
+placeholders=占位符
+plantUml=PlantUML
+plugins=插件
+pluginUrl=插件URL地址
+pluginWarning=本页面已要求载入以下插件：\n \n {1}\n \n 是否现在载入这些插件？\n \n 备注：确保在完全理解与此相关的安全问题的情况下再允许这些插件运行。\n
+plusTooltip=单击进行连接与复制（ctrl+单击进行复制，shift+单击进行连接）。拖拽进行连接（xtrl+拖拽进行复制）。
+portrait=竖向
+position=位置
+posterPrint=海报样式
+preferences=喜好
+preview=预览
+previousPage=上一页
+print=打印
+printAllPages=打印所有页
+procEng=工艺流程
+project=方案
+priority=优先级
+properties=属性
+publish=发布
+quickStart=快速入门视频
+rack=机架
+radialTree=径向树
+readOnly=只读
+reconnecting=重新连接
+recentlyUpdated=最近更新
+recentlyViewed=最近阅览
+rectangle=Rectangle
+redirectToNewApp=该文件是在此应用软件的新版本中所创建或修改的。正在重新定向。
+realtimeTimeout=似乎您在离线状态下做过更改。对不起，这些更改不予保存。
+redo=重做
+refresh=刷新
+regularExpression=正则表达式
+relative=Relative
+relativeUrlNotAllowed=Relative URL not allowed
+rememberMe=记住我
+rememberThisSetting=记住此设置
+removeFormat=清除格式
+removeFromGroup=移出组
+removeIt=删除{1}
+removeWaypoint=删除航点
+rename=重命名
+renamed=已重命名
+renameIt=重命名{1}
+renaming=正在重命名
+replace=替换
+replaceIt={1}已经存在了。要替换它吗？
+replaceExistingDrawing=替换当前图形
+required=必填
+reset=重置
+resetView=重置视图
+resize=调整大小
+resizeLargeImages=Do you want to resize large images to make the application run faster?
+retina=Retina
+responsive=响应式
+restore=恢复
+restoring=恢复中
+retryingIn={1}秒后重试
+retryingLoad=载入失败，正在重试...
+retryingLogin=登录超时，正在重试...
+reverse=翻转
+revision=修订
+revisionHistory=修订历史
+rhombus=Rhombus
+right=右
+rightAlign=右对齐
+rightToLeft=从右至左
+rotate=旋转
+rotateTooltip=点选拖拽旋转，或点击选择90度
+rotation=旋转
+rounded=圆角
+save=保存
+saveAndExit=储存并退出
+saveAs=另存为
+saveAsXmlFile=另存为XML文件？
+saved=已保存
+saveDiagramsTo=把图表存至
+saveLibrary403=没有足够的权限编辑此图库
+saveLibrary500=保存图库时出错
+saving=保存中
+scratchpad=便笺本
+scrollbars=滚动条
+search=搜索
+searchShapes=搜索图形
+selectAll=全选
+selectionOnly=仅所选内容
+selectCard=Select Card
+selectEdges=选择边线
+selectFile=选择文件
+selectFolder=选择文件夹
+selectFont=选择字体
+selectNone=全不选
+selectTemplate=Select Template
+selectVertices=选择顶点
+sendMessage=发送
+sendYourFeedbackToDrawIo=将您的反馈发送至draw.io
+serviceUnavailableOrBlocked=服务无法使用或已被屏蔽
+sessionExpired=会话已过期，请刷新浏览器窗口。
+sessionTimeoutOnSave=会话已超时，您的Google Drive的连接已断开。按OK键登录并保存。
+setAsDefaultStyle=设置为默认样式
+shadow=阴影
+shape=形状
+shapes=形状
+share=共享
+shareLink=共享编辑的链接
+sharp=尖角
+show=显示
+showStartScreen=显示开始画面
+sidebarTooltip=单击以展开。将图形拖拽至图表中。Shift+单击以改变所选内容。Alt+单击以插入及连接。
+signs=标识
+signOut=登出
+simple=简单
+simpleArrow=简单箭头
+simpleViewer=Simple Viewer
+size=大小
+solid=实线
+sourceSpacing=源距
+south=向下
+software=软件
+space=空间
+spacing=间距
+specialLink=特殊链接
+standard=标准
+starting=开启中
+straight=直线
+strikethrough=Strikethrough
+strokeColor=线条颜色
+style=样式
+subscript=下标
+summary=概要
+superscript=上标
+support=支持
+sysml=SysML
+tags=标签
+table=表格
+tables=Tables
+takeOver=Take Over
+targetSpacing=目标间距
+template=模板
+templates=模板
+text=文本
+textAlignment=文本对齐
+textOpacity=字体不透明度
+theme=主题
+timeout=超时
+title=标题
+to=至
+toBack=移至最后
+toFront=移至最前
+toolbar=Toolbar
+tooltips=提示
+top=顶
+topAlign=向上对齐
+topLeft=左上
+topRight=右上
+transparent=透明
+transparentBackground=透明背景
+trello=Trello
+tryAgain=重试
+tryOpeningViaThisPage=尝试通过此页面开启
+turn=旋转90°
+type=类型
+twitter=Twitter
+uml=UML
+underline=下划线
+undo=取消操作
+ungroup=取消群组
+unsavedChanges=未保存的更改
+unsavedChangesClickHereToSave=修改未保存。点击此处保存。
+untitled=未命名
+untitledDiagram=未命名表单
+untitledLayer=未命名图层
+untitledLibrary=未命名图库
+unknownError=未知错误
+updateFile=更新{1}
+updatingDocument=文件更新中。请稍候...
+updatingPreview=预览更新中。请稍候...
+updatingSelection=选择更新中。请稍候...
+upload=上传
+url=URL地址
+useOffline=Use Offline
+useRootFolder=Use root folder?
+userManual=用户手册
+vertical=垂直
+verticalFlow=垂直流
+verticalTree=垂直树状
+view=查看
+viewerSettings=Viewer Settings
+viewUrl=用于查看的链接：{1}
+voiceAssistant=语音助手（测试版）
+warning=警告
+waypoints=航点
+west=向左
+width=宽度
+wiki=Wiki
+wordWrap=自动换行
+writingDirection=书写方向
+yes=是
+yourEmailAddress=您的电子邮件地址
+zoom=缩放
+zoomIn=放大
+zoomOut=缩小
+basic=基本图形
+businessprocess=业务流程图
+charts=图表
+engineering=工程图
+flowcharts=流程图
+gmdl=材料设计
+mindmaps=思维导图
+mockups=模型图
+networkdiagrams=网络结构图
+nothingIsSelected=未选择
+other=其他
+softwaredesign=软件设计图
+venndiagrams=文氏图
+webEmailOrOther=网站、电邮或其他网络地址
+webLink=Web链接
+wireframes=线框图
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/src/css/common.css b/oaweb/public/cherry/drawio/src/css/common.css
new file mode 100644
index 0000000..37bfb0e
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/css/common.css
@@ -0,0 +1,162 @@
+div.mxRubberband {
+ position: absolute;
+ overflow: hidden;
+ border-style: solid;
+ border-width: 1px;
+ border-color: #0000FF;
+ background: #0077FF;
+}
+.mxCellEditor {
+ background: url(data:image/gif;base64,R0lGODlhMAAwAIAAAP///wAAACH5BAEAAAAALAAAAAAwADAAAAIxhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8egpAAA7);
+ _background: url('../images/transparent.gif');
+ border-color: transparent;
+ border-style: solid;
+ display: inline-block;
+ position: absolute;
+ overflow: visible;
+ word-wrap: normal;
+ border-width: 0;
+ min-width: 1px;
+ resize: none;
+ padding: 0px;
+ margin: 0px;
+}
+.mxPlainTextEditor * {
+ padding: 0px;
+ margin: 0px;
+}
+div.mxWindow {
+ -webkit-box-shadow: 3px 3px 12px #C0C0C0;
+ -moz-box-shadow: 3px 3px 12px #C0C0C0;
+ box-shadow: 3px 3px 12px #C0C0C0;
+ background: url('../images/window.gif');
+ border:1px solid #c3c3c3;
+ position: absolute;
+ overflow: hidden;
+ z-index: 1;
+}
+table.mxWindow {
+ border-collapse: collapse;
+ table-layout: fixed;
+ font-family: Arial;
+ font-size: 8pt;
+}
+td.mxWindowTitle {
+ background: url('../images/window-title.gif') repeat-x;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ text-align: center;
+ font-weight: bold;
+ overflow: hidden;
+ height: 13px;
+ padding: 2px;
+ padding-top: 4px;
+ padding-bottom: 6px;
+ color: black;
+}
+td.mxWindowPane {
+ vertical-align: top;
+ padding: 0px;
+}
+div.mxWindowPane {
+ overflow: hidden;
+ position: relative;
+}
+td.mxWindowPane td {
+ font-family: Arial;
+ font-size: 8pt;
+}
+td.mxWindowPane input, td.mxWindowPane select, td.mxWindowPane textarea, td.mxWindowPane radio {
+ border-color: #8C8C8C;
+ border-style: solid;
+ border-width: 1px;
+ font-family: Arial;
+ font-size: 8pt;
+ padding: 1px;
+}
+td.mxWindowPane button {
+ background: url('../images/button.gif') repeat-x;
+ font-family: Arial;
+ font-size: 8pt;
+ padding: 2px;
+ float: left;
+}
+img.mxToolbarItem {
+ margin-right: 6px;
+ margin-bottom: 6px;
+ border-width: 1px;
+}
+select.mxToolbarCombo {
+ vertical-align: top;
+ border-style: inset;
+ border-width: 2px;
+}
+div.mxToolbarComboContainer {
+ padding: 2px;
+}
+img.mxToolbarMode {
+ margin: 2px;
+ margin-right: 4px;
+ margin-bottom: 4px;
+ border-width: 0px;
+}
+img.mxToolbarModeSelected {
+ margin: 0px;
+ margin-right: 2px;
+ margin-bottom: 2px;
+ border-width: 2px;
+ border-style: inset;
+}
+div.mxTooltip {
+ -webkit-box-shadow: 3px 3px 12px #C0C0C0;
+ -moz-box-shadow: 3px 3px 12px #C0C0C0;
+ box-shadow: 3px 3px 12px #C0C0C0;
+ background: #FFFFCC;
+ border-style: solid;
+ border-width: 1px;
+ border-color: black;
+ font-family: Arial;
+ font-size: 8pt;
+ position: absolute;
+ cursor: default;
+ padding: 4px;
+ color: black;
+}
+div.mxPopupMenu {
+ -webkit-box-shadow: 3px 3px 12px #C0C0C0;
+ -moz-box-shadow: 3px 3px 12px #C0C0C0;
+ box-shadow: 3px 3px 12px #C0C0C0;
+ background: url('../images/window.gif');
+ position: absolute;
+ border-style: solid;
+ border-width: 1px;
+ border-color: black;
+}
+table.mxPopupMenu {
+ border-collapse: collapse;
+ margin-top: 1px;
+ margin-bottom: 1px;
+}
+tr.mxPopupMenuItem {
+ color: black;
+ cursor: pointer;
+}
+tr.mxPopupMenuItemHover {
+ background-color: #000066;
+ color: #FFFFFF;
+ cursor: pointer;
+}
+td.mxPopupMenuItem {
+ padding: 2px 30px 2px 10px;
+ white-space: nowrap;
+ font-family: Arial;
+ font-size: 8pt;
+}
+td.mxPopupMenuIcon {
+ background-color: #D0D0D0;
+ padding: 2px 4px 2px 4px;
+}
+.mxDisabled {
+ opacity: 0.2 !important;
+ cursor:default !important;
+}
diff --git a/oaweb/public/cherry/drawio/src/css/explorer.css b/oaweb/public/cherry/drawio/src/css/explorer.css
new file mode 100644
index 0000000..50e704f
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/css/explorer.css
@@ -0,0 +1,18 @@
+div.mxTooltip {
+ filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
+ Color='#A2A2A2', Positive='true');
+}
+div.mxPopupMenu {
+ filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
+ Color='#C0C0C0', Positive='true');
+}
+div.mxWindow {
+ _filter:progid:DXImageTransform.Microsoft.DropShadow(OffX=4, OffY=4,
+ Color='#C0C0C0', Positive='true');
+}
+td.mxWindowTitle {
+ _height: 23px;
+}
+.mxDisabled {
+ filter:alpha(opacity=20) !important;
+}
diff --git a/oaweb/public/cherry/drawio/src/grapheditor.less b/oaweb/public/cherry/drawio/src/grapheditor.less
new file mode 100644
index 0000000..4034008
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/grapheditor.less
@@ -0,0 +1,1530 @@
+@iconfont-path : '../../../';
+@import '../../../iconfont/graph.iconfont.less';
+
+.msgbox {
+ z-index: 100;
+}
+
+.geEditor {
+ font-family: Helvetica Neue, Helvetica, Arial Unicode MS, Arial;
+ font-size: 10pt;
+ border: none;
+ margin: 0px;
+}
+
+.geEditor input[type=text]::-ms-clear {
+ display: none;
+}
+
+.geItem,
+.geToolbar .geButton,
+.geToolbar .geLabel,
+.geSidebarContainer .geTitle {
+ cursor: pointer !important;
+}
+
+.geBackgroundPage {
+ -webkit-box-shadow: 0px 0px 3px 0px #d9d9d9;
+ -moz-box-shadow: 0px 0px 3px 0px #d9d9d9;
+ box-shadow: 0px 0px 3px 0px #d9d9d9;
+}
+
+.geSidebarContainer a,
+a,
+.geToolbar a {
+ color: #182b50;
+ text-decoration: none;
+}
+
+.geMenubarContainer,
+.geToolbarContainer,
+.geDiagramContainer,
+.geSidebarContainer,
+.geFooterContainer,
+.geHsplit,
+.geVsplit {
+ overflow: hidden;
+ position: absolute;
+ cursor: default;
+}
+.geMenubarContainer {
+ background-color:#fbfbfb !important;
+ height: 32px;
+}
+.geFormatContainer {
+ background-color: whiteSmoke !important;
+ overflow-x: hidden !important;
+ overflow-y: auto !important;
+ font-size: 12px;
+}
+div.geFormatContainer .geColorBtn.geButton>.geSprite{
+ padding-left: 2.5px;
+ padding-top: 1.5px;
+}
+div.geFormatContainer button{
+ background-color: #f3f4f6;
+ color:#3582fb;
+ border: 1px solid #e8eaee;
+ height: 30px;
+}
+div.geFormatContainer button{
+ background: #f3f4f6;
+}
+div.geFormatContainer input{
+ border-top: 1px solid #e8eaee;
+ border-bottom: 1px solid #e8eaee;
+ border-left: 1px solid #e8eaee;
+ color: #8c95a8;
+}
+div.geFormatContainer {
+ span{
+ position: absolute;
+ margin-top: -2px;
+ }
+ input[value="landscape"]{
+ margin-left: 35px!important;
+ }
+ div[style="margin-left: 4px; width: 210px; height: 24px;"]{
+ span{
+ margin-top: 1px;
+ }
+ }
+}
+div[style="right: 0px; z-index: 1; top: 35px; width: 240px; bottom: 28px;"]{
+ background: #fff!important;
+}
+button[title="Copy Size (Alt+Shit+X)"]{
+ background: red;
+}
+div[style="display: inline; z-index: 10006; left: 898px; top: 130px;"],div[style="display: inline; z-index: 10006; left: 77.6719px; top: 29px;"],div[style="display: inline; z-index: 10006; left: 1696px; top: 130px;"],div[style="display: inline; z-index: 10006; left: 898px; top: 158px;"]{
+ table.mxPopupMenu{
+ tr:nth-last-child(1){
+ display: none
+ }
+ tr:nth-last-child(2){
+ display: none
+ }
+ }
+
+}
+.geDiagramContainer::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+}
+
+.geDiagramContainer::-webkit-scrollbar-thumb {
+ border-radius: 10px;
+ background: #bac0cb;
+}
+
+.geDiagramContainer::-webkit-scrollbar-track {
+ border-radius: 10px;
+ background: #fff
+}
+div[style="text-align: center; font-weight: bold; overflow: hidden; display: inline-block; padding-top: 8px; height: 25px; width: 100%;"]{
+ text-indent: 18px;
+ font-size: 14px;
+ text-align: left!important;
+}
+div.geToolbar{
+ a[title="字体"]{
+ div{
+ margin-top: 2px
+ }
+ }
+ a[title="插入"]{
+ div{
+ margin-top: -1px!important;
+ }
+ }
+}
+div[style="white-space: nowrap; color: rgb(63, 74, 86); text-align: left; cursor: default; border-bottom: none;"]{
+ div[style="padding: 2px 0px 4px 18px; border-bottom: 1px solid rgb(223, 230, 238);"]{
+ div{
+ margin: 5px 0;
+ }
+ }
+}
+div[tietle="自动调整 (Ctrl+Shift+Y)"]{
+ margin-top: -1px;
+}
+div[style="border: 20px; position: absolute; margin-top: 2px; right: 20px;"]{
+ div.geBtnUp,div.geBtnDown{
+ width: 12px;
+ height: 12px;
+ }
+}
+button[title="设置为默认样式 (Ctrl+Shift+D)"]{
+ display: none;
+}
+div[style="padding: 10px 0px 10px 18px; border-bottom: 1px solid rgb(223, 230, 238);"]{
+ button{
+ cursor: pointer;
+ }
+}
+button[style="line-height: normal; margin-top: 4px; margin-bottom: 8px;"]{
+ line-height: normal;
+ margin-top: 20px;
+ margin-bottom: 8px;
+ height: 30px;
+ width: 120px;
+ font-size: 12px;
+ background-color: #f3f4f6;
+ color: #3582fb;
+ border: 1px solid #e8eaee;
+ cursor: pointer;
+}
+// div[style="white-space: nowrap; color: rgb(63, 74, 86); text-align: left; cursor: default;"]{
+// a[class="geButton geColorBtn"]{
+// position: relative;
+// width: 50px!important;
+// div:first-child{
+// position: absolute;
+// left: 0;
+// }
+// div:last-child{
+// position: absolute;
+// right: 0;
+// }
+
+// }
+// }
+div[class="geSidebarContainer geFormatContainer"]{
+ button{
+ cursor: pointer;
+ }
+}
+.geDiagramContainer {
+ background-color: #ebebeb;
+ border: 1px solid #e5e5e5;
+ font-size: 0px;
+ outline: none;
+ min-width: 100px;
+ table{
+ min-width: 100px;
+ }
+}
+
+.geMenubar,
+.geToolbar {
+ white-space: nowrap;
+ display: block;
+ width: 100%;
+}
+
+.geItem,
+.geToolbar .geButton,
+.geToolbar .geLabel,
+.geSidebar,
+.geSidebarContainer .geTitle,
+.geSidebar .geItem,
+.mxPopupMenuItem {
+ -webkit-transition: all 0.1s ease-in-out;
+ -moz-transition: all 0.1s ease-in-out;
+ -o-transition: all 0.1s ease-in-out;
+ -ms-transition: all 0.1s ease-in-out;
+ transition: all 0.1s ease-in-out;
+}
+
+.geHint {
+ background-color: #ffffff;
+ border: 1px solid gray;
+ padding: 4px 16px 4px 16px;
+ border-radius: 3px;
+ -webkit-box-shadow: 1px 1px 2px 0px #ddd;
+ -moz-box-shadow: 1px 1px 2px 0px #ddd;
+ box-shadow: 1px 1px 2px 0px #ddd;
+ opacity: 0.8;
+ filter: alpha(opacity=80);
+ font-size: 9pt;
+}
+
+.geStatusAlert {
+ white-space: nowrap;
+ margin-top: -5px;
+ font-size: 12px;
+ padding: 4px 6px 4px 6px;
+ background-color: #f2dede;
+ border: 1px solid #ebccd1;
+ color: #a94442 !important;
+ border-radius: 3px;
+}
+
+.geStatusAlert:hover {
+ background-color: #f1d8d8;
+ border-color: #d6b2b8;
+}
+
+.geStatusMessage {
+ white-space: nowrap;
+ margin-top: -5px;
+ padding: 4px 6px 4px 6px;
+ font-size: 12px;
+ background-image: -webkit-linear-gradient(top, #dff0d8 0, #c8e5bc 100%);
+ background-image: -o-linear-gradient(top, #dff0d8 0, #c8e5bc 100%);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
+ background-image: linear-gradient(to bottom, #dff0d8 0, #c8e5bc 100%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
+ background-repeat: repeat-x;
+ border: 1px solid #b2dba1;
+ border-radius: 3px;
+ color: #3c763d !important;
+}
+
+.geStatusMessage:hover {
+ background: #c8e5bc;
+ border-color: #b2dba1;
+}
+
+.geAlert {
+ position: absolute;
+ white-space: nowrap;
+ padding: 14px;
+ background-color: #f2dede;
+ border: 1px solid #ebccd1;
+ color: #a94442;
+ border-radius: 3px;
+ -webkit-box-shadow: 2px 2px 3px 0px #ddd;
+ -moz-box-shadow: 2px 2px 3px 0px #ddd;
+ box-shadow: 2px 2px 3px 0px #ddd;
+}
+
+.geBtn,
+.mxWindow .geBtn {
+ background-image: none;
+ background-color: #fff;
+ border-radius: 2px;
+ border: 1px solid #d8d8d8;
+ color: #333;
+ font-size: 11px;
+ font-weight: bold;
+ height: 29px;
+ line-height: 27px;
+ margin: 0 0 0 8px;
+ min-width: 72px;
+ outline: 0;
+ padding: 0 8px;
+ cursor: pointer;
+}
+
+.geBtn:hover,
+.geBtn:focus {
+ -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
+ -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
+ box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
+ border: 1px solid #c6c6c6;
+ background-color: #f3f4f6;
+ background-image: linear-gradient(#f3f4f6 0px, #f1f1f1 100%);
+ color: #111;
+}
+
+.geBtn:disabled {
+ opacity: .5;
+}
+
+.geBtnUp {//上箭头
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAGCAYAAAD68A/GAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkQ2RDQyMEMzQkYzQzExRTlCNzY1RkIxNzk1N0NBRTIxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkQ2RDQyMEM0QkYzQzExRTlCNzY1RkIxNzk1N0NBRTIxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RDZENDIwQzFCRjNDMTFFOUI3NjVGQjE3OTU3Q0FFMjEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RDZENDIwQzJCRjNDMTFFOUI3NjVGQjE3OTU3Q0FFMjEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5GWB76AAAAS0lEQVR42mL8//8/AzGABcbYuPsYjNkKpatBhL+rFapCKAgA4ioo+zQQb4BJMCEpUgfiRUj8RVAxDIXrgJgXic8LFQMDRmI9AxBgAHIsD1ZPQxaeAAAAAElFTkSuQmCC);
+ background-position: center center;
+ background-repeat: no-repeat;
+}
+
+.geBtnUp:active {
+ background-color: #4d90fe;
+ background-image: linear-gradient(#4d90fe 0px, #357ae8 100%);
+}
+
+.geBtnDown {//下箭头
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAGCAYAAAD68A/GAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkM1RjQ1RDYzQkYzQzExRTk5QUUxOTk1NzhDMkFFNTkzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkM1RjQ1RDY0QkYzQzExRTk5QUUxOTk1NzhDMkFFNTkzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QzVGNDVENjFCRjNDMTFFOTlBRTE5OTU3OEMyQUU1OTMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QzVGNDVENjJCRjNDMTFFOTlBRTE5OTU3OEMyQUU1OTMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz51P1COAAAASklEQVR42mL8//8/AzGABcbYuPvYVSClhSZ/zd/VShvEYEISDALiz0j8z1AxBnSFN4E4DokfBxVDtRoKNgBxGxIbDhiJ9QxAgAEAyjMR5zuovT4AAAAASUVORK5CYII=);
+ background-position: center center;
+ background-repeat: no-repeat;
+}
+
+.geBtnDown:active {
+ background-color: #4d90fe;
+ background-image: linear-gradient(#4d90fe 0px, #357ae8 100%);
+}
+
+.geColorBtn {
+ background-color: #f3f4f6!important;
+ border-radius: 4px;
+ border: 1px solid rgba(0, 0, 0, 0.5);
+ color: #333;
+ margin: 0px;
+ outline: 0;
+ padding: 0px;
+ cursor: pointer;
+}
+div.geToolbarContainer{
+ a[class="geButton geColorBtn"]:hover {
+ background-color: #eaf2ff!important;
+ color: #3582fb;
+ }
+ .geColorBtn:checked {
+ background-color: #3582fb!important;
+ }
+
+ a[class="geButton geColorBtn"]:active {
+ background-color: #3582fb!important;
+ }
+
+ .geColorBtn:disabled {
+ opacity: .5;
+ }
+}
+
+
+.gePrimaryBtn,
+.mxWindow .gePrimaryBtn {
+ background-color: #3582fb;
+ background-image: linear-gradient(#3582fb 0px, #3582fb 100%);
+ border: 1px solid #3582fb;
+ color: #fff;
+ font-weight: normal;
+}
+
+.gePrimaryBtn:hover,
+.gePrimaryBtn:focus {
+ background-color: #5d9bfc;
+ background-image: linear-gradient(#5d9bfc 0px, #5d9bfc 100%);
+ border: 1px solid #5d9bfc;
+ color: #fff;
+ font-weight: normal;
+}
+
+.gePrimaryBtn:disabled {
+ opacity: .5;
+}
+
+.geAlertLink {
+ color: #843534;
+ font-weight: 700;
+ text-decoration: none;
+}
+
+.geMenubar {
+ padding: 0px 2px 0px 2px;
+ vertical-align: middle;
+}
+
+.geItem,
+.geToolbar .geItem {
+ padding: 6px 8px 6px 8px;
+ cursor: default;
+}
+
+.geItem:hover {
+ background: #eeeeee;
+}
+
+.mxDisabled:hover {
+ background: inherit !important;
+}
+
+.geMenubar a.geStatus {
+ color: #b3b3b3;
+ padding-left: 6px;
+ display: inline-block;
+ cursor: default !important;
+}
+
+.geMenubar a.geStatus:hover {
+ background: transparent;
+}
+
+.geMenubarMenu {
+ border: 1px solid #d5d5d5 !important;
+}
+
+.geToolbarContainer {
+ background: #fff!important;
+ border-bottom: 1px solid #e0e0e0;
+}
+
+.geSidebarContainer .geToolbarContainer {
+ background: transparent;
+ border-bottom: none;
+}
+
+.geSidebarContainer button {
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
+.geToolbar {
+ padding: 1px 0px 0px 6px;
+ border-top: 1px solid #e0e0e0;
+ -webkit-box-shadow: inset 0 1px 0 0 #fff;
+ -moz-box-shadow: inset 0 1px 0 0 #fff;
+ box-shadow: inset 0 1px 0 0 #fff;
+}
+
+.geToolbarContainer .geSeparator {
+ float: left;
+ width: 1px;
+ height: 40px;
+ background: #e5e5e5;
+ margin-left: 6px;
+ margin-right: 6px;
+ margin-top: -2px;
+}
+
+.geToolbarContainer .geButton {
+ float: left;
+ width: 20px;
+ height: 20px;
+ padding: 5px 0px 3px 6px;
+ margin: 2px;
+ border: 1px solid transparent;
+ cursor: pointer;
+ opacity: 0.6;
+ filter: alpha(opacity=60);
+}
+
+.geToolbarContainer .geButton:hover {
+ border-radius: 2px;
+ opacity: 1;
+ filter: none !important;
+}
+
+.geToolbarContainer .geButton:active {
+ border: 1px solid black;
+}
+
+div.mxWindow .geButton {
+ margin: -1px 2px 2px 2px;
+ padding: 1px 2px 2px 1px;
+}
+
+.geToolbarContainer .geLabel {
+ float: left;
+ cursor: pointer;
+ // padding:7px 5px 3px 6px;
+ padding: 2px 5px 0px 6px;
+ border: 1px solid transparent;
+ opacity: 0.6;
+ filter: alpha(opacity=60);
+ margin: 2px;
+ margin-top: 3px;
+}
+
+.geToolbarContainer .geLabel:hover {
+ border: 1px solid gray;
+ border-radius: 2px;
+ opacity: 0.9;
+ filter: alpha(opacity=90) !important;
+}
+
+.geToolbarContainer .geLabel:active {
+ border: 1px solid black;
+ opacity: 1;
+ filter: none !important;
+}
+
+.geToolbarContainer .mxDisabled:hover {
+ border: 1px solid transparent !important;
+ opacity: 0.2 !important;
+ filter: alpha(opacity=20) !important;
+}
+
+.geToolbarMenu {
+ border: 1px solid #DFDFDF !important;
+ -webkit-box-shadow: none !important;
+ -moz-box-shadow: none !important;
+ box-shadow: #DFDFDF 5px 5px 10px 1px !important;
+ filter: none !important;
+}
+
+.geDiagramBackdrop {
+ background-color: #ebebeb;
+}
+
+.geSidebarContainer {
+ background: #ffffff;
+ overflow: hidden;
+ position: absolute;
+ border-top: 1px solid #e5e5e5;
+ overflow: auto;
+}
+input[type=checkbox] {
+ position: relative;
+ width: 12px;
+ height: 12px;
+ -webkit-apprarence: none;
+}
+input[type=checkbox]::before{
+ content: '';
+ position: absolute;
+ top: -11px;
+ width: 12px;
+ height: 0;
+ text-align: center;
+ font-size: 16px;
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDg1MC40IDg1MC40IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA4NTAuNCA4NTAuNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6I0IwQkFDNTt9DQo8L3N0eWxlPg0KPGc+DQoJPHBhdGggY2xhc3M9InN0MCIgZD0iTTgwOC40LDg1MC40SDQyYy0yMy4yLDAtNDItMTguOC00Mi00MlY0MkMwLDE4LjgsMTguOCwwLDQyLDBoNzY2LjRjMjMuMiwwLDQyLDE4LjgsNDIsNDJ2NzY2LjQNCgkJQzg1MC40LDgzMS42LDgzMS42LDg1MC40LDgwOC40LDg1MC40eiBNNjAsNzkwLjRoNzMwLjRWNjBINjBWNzkwLjR6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==);
+ border-radius: 2px;
+ background-repeat: no-repeat;
+ overflow: hidden;
+}
+input[type=checkbox]:checked::before {
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDg1MC40IDg1MC40IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA4NTAuNCA4NTAuNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6IzM1ODJGQjt9DQo8L3N0eWxlPg0KPHBhdGggY2xhc3M9InN0MCIgZD0iTTc5My43LDBoLTczN0MyNS41LDAsMCwyNS41LDAsNTYuN3Y3MzdjMCwzMS4yLDI1LjUsNTYuNyw1Ni43LDU2LjdoNzM3YzMxLjIsMCw1Ni43LTI1LjUsNTYuNy01Ni43di03MzcNCglDODUwLjQsMjUuNSw4MjQuOSwwLDc5My43LDB6IE03MDAsMjgzLjZMMzc3LjQsNjA5Yy01LjYsNS43LTEzLjMsOC45LTIxLjMsOC45cy0xNS43LTMuMi0yMS4zLTguOWwtMTg0LjMtMTg2DQoJYy0xMS43LTExLjgtMTEuNi0zMC44LDAuMi00Mi40YzExLjgtMTEuNywzMC44LTExLjYsNDIuNCwwLjJsMTYzLDE2NC41bDMwMS4zLTMwMy45YzExLjctMTEuOCwzMC43LTExLjksNDIuNC0wLjINCglDNzExLjUsMjUyLjgsNzExLjYsMjcxLjgsNzAwLDI4My42eiIvPg0KPC9zdmc+DQo=);
+ background-repeat: no-repeat;
+}
+
+input[type=radio] {
+ position: relative;
+ width: 10px;
+ height: 0px;
+}
+input[type=radio]::before{
+ content: '';
+ position: absolute;
+ top: -9px;
+ width: 14px;
+ height: 14px;
+ text-align: center;
+ font-size: 16px;
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZmlsbD0iI0IwQkFDNSIgZD0iTTUxNS40ODUsOTA3LjA4NmMtNTcuMzY4LDAtMTEzLjAzOC0xMS4xODMtMTY1LjQ2Mi0zMy4yMzdjLTUwLjYzMS0yMS4zMDEtOTYuMDk5LTUxLjc5MS0xMzUuMTQxLTkwLjYyMw0KCQljLTM5LjA1My0zOC44NDQtNjkuNzE4LTg0LjA4OC05MS4xNDYtMTM0LjQ3NmMtMjIuMTk1LTUyLjE5NC0zMy40NDktMTA3LjYyMi0zMy40NDktMTY0Ljc0NQ0KCQljMC01Ny4xMjIsMTEuMjU0LTExMi41NSwzMy40NDktMTY0Ljc0NGMyMS40MjctNTAuMzg4LDUyLjA5My05NS42MzIsOTEuMTQ2LTEzNC40NzZjMzkuMDQyLTM4LjgzMiw4NC41MDktNjkuMzIyLDEzNS4xNDEtOTAuNjIzDQoJCWM1Mi40MjQtMjIuMDU1LDEwOC4wOTQtMzMuMjM4LDE2NS40NjItMzMuMjM4czExMy4wMzgsMTEuMTgzLDE2NS40NjIsMzMuMjM4YzUwLjYzMiwyMS4zLDk2LjEsNTEuNzkxLDEzNS4xNDEsOTAuNjIzDQoJCWMzOS4wNTMsMzguODQzLDY5LjcxOSw4NC4wODgsOTEuMTQ2LDEzNC40NzZjMjIuMTk1LDUyLjE5NCwzMy40NDksMTA3LjYyMiwzMy40NDksMTY0Ljc0NGMwLDU3LjEyMy0xMS4yNTQsMTEyLjU1LTMzLjQ0OSwxNjQuNzQ1DQoJCWMtMjEuNDI3LDUwLjM4OC01Mi4wOTMsOTUuNjMyLTkxLjE0NiwxMzQuNDc2Yy0zOS4wNDEsMzguODMyLTg0LjUwOSw2OS4zMjItMTM1LjE0MSw5MC42MjMNCgkJQzYyOC41MjMsODk1LjkwNCw1NzIuODUzLDkwNy4wODYsNTE1LjQ4NSw5MDcuMDg2eiBNNTE1LjQ4NSwxMjAuOTI2Yy0yMDEuMzcsMC0zNjUuMTk3LDE2Mi44NzctMzY1LjE5NywzNjMuMDgNCgkJYzAsMjAwLjIwNCwxNjMuODI3LDM2My4wODEsMzY1LjE5NywzNjMuMDgxczM2NS4xOTctMTYyLjg3NywzNjUuMTk3LTM2My4wODFDODgwLjY4MiwyODMuODAzLDcxNi44NTUsMTIwLjkyNiw1MTUuNDg1LDEyMC45MjZ6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==);
+ border-radius: 2px;
+ background-repeat: no-repeat;
+}
+input[type=radio]:checked::before {
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iIzM1ODJGQiIgZD0iTTUxNS40ODUsNTguODA5Yy0yMzQuODMsMC00MjUuMTk3LDE5MC4zNjctNDI1LjE5Nyw0MjUuMTk3czE5MC4zNjcsNDI1LjE5Nyw0MjUuMTk3LDQyNS4xOTcNCglzNDI1LjE5Ny0xOTAuMzY3LDQyNS4xOTctNDI1LjE5N1M3NTAuMzE1LDU4LjgwOSw1MTUuNDg1LDU4LjgwOXogTTUxNS40ODUsNjgyLjQzMWMtMTA5LjU4NywwLTE5OC40MjUtODguODM4LTE5OC40MjUtMTk4LjQyNQ0KCXM4OC44MzgtMTk4LjQyNSwxOTguNDI1LTE5OC40MjVTNzEzLjkxLDM3NC40MTksNzEzLjkxLDQ4NC4wMDZTNjI1LjA3Miw2ODIuNDMxLDUxNS40ODUsNjgyLjQzMXoiLz4NCjwvc3ZnPg0K);
+ background-repeat: no-repeat;
+}
+input[type=radio]:hover::before {
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZmlsbD0iIzM1ODJGQiIgZD0iTTUxNS40ODUsOTA3LjA4NmMtNTcuMzY4LDAtMTEzLjAzOC0xMS4xODMtMTY1LjQ2Mi0zMy4yMzdjLTUwLjYzMS0yMS4zMDEtOTYuMDk5LTUxLjc5MS0xMzUuMTQxLTkwLjYyMw0KCQljLTM5LjA1My0zOC44NDQtNjkuNzE4LTg0LjA4OC05MS4xNDYtMTM0LjQ3NmMtMjIuMTk1LTUyLjE5NC0zMy40NDktMTA3LjYyMi0zMy40NDktMTY0Ljc0NQ0KCQljMC01Ny4xMjIsMTEuMjU0LTExMi41NSwzMy40NDktMTY0Ljc0NGMyMS40MjctNTAuMzg4LDUyLjA5My05NS42MzIsOTEuMTQ2LTEzNC40NzZjMzkuMDQyLTM4LjgzMiw4NC41MDktNjkuMzIyLDEzNS4xNDEtOTAuNjIzDQoJCWM1Mi40MjQtMjIuMDU1LDEwOC4wOTQtMzMuMjM4LDE2NS40NjItMzMuMjM4czExMy4wMzgsMTEuMTgzLDE2NS40NjIsMzMuMjM4YzUwLjYzMiwyMS4zLDk2LjEsNTEuNzkxLDEzNS4xNDEsOTAuNjIzDQoJCWMzOS4wNTMsMzguODQzLDY5LjcxOSw4NC4wODgsOTEuMTQ2LDEzNC40NzZjMjIuMTk1LDUyLjE5NCwzMy40NDksMTA3LjYyMiwzMy40NDksMTY0Ljc0NGMwLDU3LjEyMy0xMS4yNTQsMTEyLjU1LTMzLjQ0OSwxNjQuNzQ1DQoJCWMtMjEuNDI3LDUwLjM4OC01Mi4wOTMsOTUuNjMyLTkxLjE0NiwxMzQuNDc2Yy0zOS4wNDEsMzguODMyLTg0LjUwOSw2OS4zMjItMTM1LjE0MSw5MC42MjMNCgkJQzYyOC41MjMsODk1LjkwNCw1NzIuODUzLDkwNy4wODYsNTE1LjQ4NSw5MDcuMDg2eiBNNTE1LjQ4NSwxMjAuOTI2Yy0yMDEuMzcsMC0zNjUuMTk3LDE2Mi44NzctMzY1LjE5NywzNjMuMDgNCgkJYzAsMjAwLjIwNCwxNjMuODI3LDM2My4wODEsMzY1LjE5NywzNjMuMDgxczM2NS4xOTctMTYyLjg3NywzNjUuMTk3LTM2My4wODFDODgwLjY4MiwyODMuODAzLDcxNi44NTUsMTIwLjkyNiw1MTUuNDg1LDEyMC45MjZ6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==);
+ background-repeat: no-repeat;
+}
+input[type=radio]:checked:hover::before {
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5b2iIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgOTAuMjg4IDU4LjgwOSA4NTAuMzk0IDg1MC4zOTQiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iIzM1ODJGQiIgZD0iTTUxNS40ODUsNTguODA5Yy0yMzQuODMsMC00MjUuMTk3LDE5MC4zNjctNDI1LjE5Nyw0MjUuMTk3czE5MC4zNjcsNDI1LjE5Nyw0MjUuMTk3LDQyNS4xOTcNCglzNDI1LjE5Ny0xOTAuMzY3LDQyNS4xOTctNDI1LjE5N1M3NTAuMzE1LDU4LjgwOSw1MTUuNDg1LDU4LjgwOXogTTUxNS40ODUsNjgyLjQzMWMtMTA5LjU4NywwLTE5OC40MjUtODguODM4LTE5OC40MjUtMTk4LjQyNQ0KCXM4OC44MzgtMTk4LjQyNSwxOTguNDI1LTE5OC40MjVTNzEzLjkxLDM3NC40MTksNzEzLjkxLDQ4NC4wMDZTNjI1LjA3Miw2ODIuNDMxLDUxNS40ODUsNjgyLjQzMXoiLz4NCjwvc3ZnPg0K);
+ background-repeat: no-repeat;
+}
+.geSidebar {
+ background: #fff!important;
+ border-bottom: 1px solid #e5e5e5;
+ padding: 5px;
+ _padding: 1px;
+ padding-bottom: 12px;
+ overflow: hidden;
+}
+
+.geSidebarContainer .geTitle {
+ display: block;
+ font-size: 9pt;
+ border-bottom: 1px solid #e5e5e5;
+ font-weight: normal;
+ padding: 6px 0px 6px 14px;
+ margin: 0px;
+ cursor: default;
+ background: #eeeeee;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ line-height: 1.4em;
+ text-indent: 18px;
+ background-position: 6% 50%!important;
+ color:#182b50;
+}
+div[style="position: relative; cursor: pointer; margin-top: -3px; border: 0px; left: 52px; opacity: 0.5;"]{
+ margin-top: -1px;
+}
+.geSidebarContainer .geTitle:hover {
+ background: #e5e5e5;
+}
+
+.geTitle img {
+ opacity: 0.5;
+ _filter: alpha(opacity=50);
+}
+
+.geTitle img:hover {
+ opacity: 1;
+ _filter: alpha(opacity=100);
+}
+
+.geTitle .geButton {
+ border: 1px solid transparent;
+ padding: 3px;
+ border-radius: 2px;
+}
+
+.geTitle .geButton:hover {
+ border: 1px solid gray;
+}
+
+.geSidebar .geItem {
+ display: inline-block;
+ background-repeat: no-repeat;
+ background-position: 50% 50%;
+ border: 1px solid transparent;
+ border-radius: 2px;
+ cursor: move;
+}
+
+.geSidebar .geItem:hover {
+ border: 1px solid gray !important;
+}
+
+.geItem {
+ vertical-align: top;
+ display: inline-block;
+}
+
+.geSidebarTooltip {
+ position: absolute;
+ background: white;
+ overflow: hidden;
+ border: 1px solid gray;
+ border-radius: 8px;
+ -webkit-box-shadow: 0px 0px 2px 2px #d5d5d5;
+ -moz-box-shadow: 0px 0px 2px 2px #d5d5d5;
+ box-shadow: 0px 0px 2px 2px #d5d5d5;
+ _filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color='#d5d5d5', Positive='true');
+}
+
+.geFooterContainer {
+ background: #e5e5e5;
+ border-top: 1px solid #c0c0c0;
+}
+
+.geFooterContainer a {
+ display: inline-block;
+ box-sizing: border-box;
+ width: 100%;
+ white-space: nowrap;
+ font-size: 14px;
+ color: #235695;
+ font-weight: bold;
+ text-decoration: none;
+}
+
+.geFooterContainer table {
+ border-collapse: collapse;
+ margin: 0 auto;
+}
+
+.geFooterContainer td {
+ border-left: 1px solid #c0c0c0;
+ border-right: 1px solid #c0c0c0;
+}
+
+.geFooterContainer td:hover {
+ background-color: #b3b3b3;
+}
+
+.geHsplit {
+ cursor: col-resize;
+ background-color: #e8eaee;
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAHBAMAAADdS/HjAAAAGFBMVEUzMzP///9tbW1QUFCKiopBQUF8fHxfX1/IXlmXAAAAHUlEQVQImWMQEGAQFWUQFmYQF2cQEmIQE2MQEQEACy4BF67hpEwAAAAASUVORK5CYII=);
+ background-repeat: no-repeat;
+ background-position: center center;
+}
+
+.geVsplit {
+ font-size: 1pt;
+ cursor: row-resize;
+ background-color: #e5e5e5;
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAEBAMAAACw6DhOAAAAGFBMVEUzMzP///9tbW1QUFCKiopBQUF8fHxfX1/IXlmXAAAAFElEQVQImWNgNVdzYBAUFBRggLMAEzYBy29kEPgAAAAASUVORK5CYII=);
+ background-repeat: no-repeat;
+ background-position: center center;
+}
+
+.geHsplit:hover,
+.geVsplit:hover {
+ background-color: #d5d5d5;
+}
+
+.geDialog {
+ position: absolute;
+ background: white;
+ line-height: 1em;
+ overflow: hidden;
+ padding: 30px;
+ border: 1px solid #acacac;
+ -webkit-box-shadow: 0px 0px 2px 2px #d5d5d5;
+ -moz-box-shadow: 0px 0px 2px 2px #d5d5d5;
+ box-shadow: 0px 0px 2px 2px #d5d5d5;
+ _filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color='#d5d5d5', Positive='true');
+ z-index: 2;
+}
+
+.geDialogClose {
+ position: absolute;
+ width: 9px;
+ height: 9px;
+ opacity: 0.5;
+ cursor: pointer;
+ _filter: alpha(opacity=50);
+}
+
+.geDialogClose:hover {
+ opacity: 1;
+}
+
+.geDialogTitle {
+ box-sizing: border-box;
+ white-space: nowrap;
+ background: rgb(229, 229, 229);
+ border-bottom: 1px solid rgb(192, 192, 192);
+ font-size: 15px;
+ font-weight: bold;
+ text-align: center;
+ color: rgb(35, 86, 149);
+}
+
+.geDialogFooter {
+ background: whiteSmoke;
+ white-space: nowrap;
+ text-align: right;
+ box-sizing: border-box;
+ border-top: 1px solid #e5e5e5;
+ color: darkGray;
+}
+
+.geBaseButton {
+ padding: 10px;
+ border-radius: 6px;
+ border: 1px solid #c0c0c0;
+ cursor: pointer;
+ background-color: #ececec;
+ background-image: linear-gradient(#ececec 0%, #fcfcfc 100%);
+}
+
+.geBaseButton:hover {
+ background: #ececec;
+}
+
+.geBigButton {
+ color: #ffffff;
+ border: none;
+ padding: 10px;
+ font-size: 14pt;
+ white-space: nowrap;
+ border-radius: 6px;
+ text-shadow: rgb(41, 89, 137) 0px 1px 0px;
+ background-color: #428bca;
+ background-image: linear-gradient(rgb(70, 135, 206) 0px, rgb(48, 104, 162) 100%);
+ -webkit-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
+ -moz-box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
+ box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 1px 0px;
+}
+
+.geBigButton:hover {
+ background-color: #2d6ca2;
+ background-image: linear-gradient(rgb(90, 148, 211) 0px, rgb(54, 115, 181) 100%);
+}
+
+.geBigButton:active {
+ background-color: rgb(54, 115, 181);
+ background-image: none;
+}
+
+@media print {
+ div.geNoPrint {
+ display: none !important;
+ }
+}
+
+.font-graph-geSprite-actualsize {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 0;
+}
+
+.font-graph-geSprite-fillcolor {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -229px;
+ margin-top: -3px;
+}
+
+.font-graph-geSprite-gradientcolor {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -368px;
+}
+
+.font-graph-geSprite-image {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -414px;
+}
+
+.font-graph-geSprite-print {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -598px;
+}
+
+.font-graph-geSprite-noarrow {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1334px;
+}
+
+.font-graph-geSprite-endclassic {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1380px;
+}
+
+.font-graph-geSprite-endopen {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1426px;
+}
+
+.font-graph-geSprite-endblock {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1472px;
+}
+
+.font-graph-geSprite-endoval {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1518px;
+}
+
+.font-graph-geSprite-enddiamond {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1564px;
+}
+
+.font-graph-geSprite-endthindiamond {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1610px;
+}
+
+.font-graph-geSprite-endclassictrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1656px;
+}
+
+.font-graph-geSprite-endblocktrans {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1702px;
+}
+
+.font-graph-geSprite-endovaltrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1748px;
+}
+
+.font-graph-geSprite-enddiamondtrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1794px;
+}
+
+.font-graph-geSprite-endthindiamondtrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1840px;
+}
+
+.font-graph-geSprite-startclassic {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1886px;
+}
+
+.font-graph-geSprite-startopen {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1932px;
+}
+
+.font-graph-geSprite-startblock {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -1978px;
+}
+
+.font-graph-geSprite-startoval {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2024px;
+}
+
+.font-graph-geSprite-startdiamond {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2070px;
+}
+
+.font-graph-geSprite-startthindiamond {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2116px;
+}
+
+.font-graph-geSprite-startclassictrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2162px;
+}
+
+.font-graph-geSprite-startblocktrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2208px;
+}
+
+.font-graph-geSprite-startovaltrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2254px;
+}
+
+.font-graph-geSprite-startdiamondtrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2300px;
+}
+
+.font-graph-geSprite-startthindiamondtrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2346px;
+}
+
+.font-graph-geSprite-globe {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2392px;
+}
+
+.font-graph-geSprite-deletecolumn {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -2990px;
+}
+
+.font-graph-geSprite-deleterow {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3036px;
+}
+
+.font-graph-geSprite-insertcolumnafter {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3082px;
+}
+
+.font-graph-geSprite-insertcolumnbefore {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3128px;
+}
+
+.font-graph-geSprite-insertrowafter {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3174px;
+}
+
+.font-graph-geSprite-insertrowbefore {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3220px;
+}
+
+.font-graph-geSprite-grid {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3272px;
+}
+
+.font-graph-geSprite-guides {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3324px;
+}
+
+.font-graph-geSprite-alignleft {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3416px;
+}
+
+.font-graph-geSprite-alignright {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3462px;
+}
+
+.font-graph-geSprite-aligncenter {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3508px;
+}
+.font-graph-geSprite-aligntop {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3554px;
+}
+
+.font-graph-geSprite-alignbottom {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3600px;
+}
+
+.font-graph-geSprite-alignmiddle {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3646px;
+}
+
+
+.font-graph-geSprite-rounded {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3968px;
+}
+
+.font-graph-geSprite-duplicate {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4106px;
+}
+
+.font-graph-geSprite-insert {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4152px;
+}
+
+.font-graph-geSprite-endblockthin {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4201px;
+}
+
+.font-graph-geSprite-endblockthintrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4247px;
+}
+
+.font-graph-geSprite-enderone {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4293px;
+}
+
+.font-graph-geSprite-enderonetoone {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4339px;
+}
+
+.font-graph-geSprite-enderonetomany {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4385px;
+}
+
+.font-graph-geSprite-endermany {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4431px;
+}
+
+.font-graph-geSprite-enderoneopt {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4477px;
+}
+
+.font-graph-geSprite-endermanyopt {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4523px;
+}
+
+.font-graph-geSprite-endclassicthin {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4938px;
+}
+
+.font-graph-geSprite-endclassicthintrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4984px;
+}
+
+.font-graph-geSprite-enddash {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5029px;
+}
+
+.font-graph-geSprite-endcircleplus {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5075px;
+}
+
+.font-graph-geSprite-endcircle {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5121px;
+}
+
+.font-graph-geSprite-endasync {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5167px;
+}
+
+.font-graph-geSprite-endasynctrans {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5213px;
+}
+
+.font-graph-geSprite-startblockthin {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4569px;
+}
+
+.font-graph-geSprite-startblockthintrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4615px;
+}
+
+.font-graph-geSprite-starterone {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4661px;
+}
+
+.font-graph-geSprite-starteronetoone {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4707px;
+}
+
+.font-graph-geSprite-starteronetomany {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4753px;
+}
+
+.font-graph-geSprite-startermany {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4799px;
+}
+
+.font-graph-geSprite-starteroneopt {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4845px;
+}
+
+.font-graph-geSprite-startermanyopt {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4891px;
+}
+
+.font-graph-geSprite-startclassicthin {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5259px;
+}
+
+.font-graph-geSprite-startclassicthintrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5305px;
+}
+
+.font-graph-geSprite-startdash {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5351px;
+}
+
+.font-graph-geSprite-startcircleplus {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5397px;
+}
+
+.font-graph-geSprite-startcircle {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5443px;
+}
+
+.font-graph-geSprite-startasync {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5489px;
+}
+
+.font-graph-geSprite-startasynctrans {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5535px;
+}
+
+.font-graph-geSprite-startcross {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5581px;
+}
+
+.font-graph-geSprite-startopenthin {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5627px;
+}
+
+.font-graph-geSprite-startopenasync {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5673px;
+}
+
+.font-graph-geSprite-endcross {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5719px;
+}
+
+.font-graph-geSprite-endopenthin {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5765px;
+}
+
+.font-graph-geSprite-endopenasync {
+ background: url('data:image/png;base64,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') no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -5811px;
+}
+
+
+.geSprite-delete {
+ background: url(data:image/png;base64,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) no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -184px;
+}
+
+.geSprite-insert {
+ background: url(data:image/png;base64,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) no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4152px;
+}
+
+.geSprite-dots {
+ background: url(data:image/png;base64,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) no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3370px;
+}
+
+.geSprite-duplicate {
+ background: url(data:image/png;base64,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) no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -4106px;
+}
+
+.geSprite-plus {
+ background: url(data:image/png;base64,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) no-repeat;
+ width: 21px;
+ height: 21px;
+ background-position: 0 -3922px;
+}
+
+html div.mxRubberband {
+ border-color: #0000DD;
+ background: #99ccff;
+}
+
+html div.mxPopupMenu {
+ -webkit-box-shadow: 2px 2px 3px #d5d5d5;
+ -moz-box-shadow: 2px 2px 3px #d5d5d5;
+ box-shadow: 2px 2px 3px #d5d5d5;
+ _filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color='#d0d0d0', Positive='true');
+ background: white;
+ position: absolute;
+ border: 3px solid #e7e7e7;
+}
+
+html table.mxPopupMenu {
+ border-collapse: collapse;
+ margin: 0px;
+ width: 100%;
+}
+
+html td.mxPopupMenuItem {
+ padding: 7px 30px 7px 30px;
+ font-family: Helvetica Neue, Helvetica, Arial Unicode MS, Arial;
+ font-size: 10pt;
+}
+
+html td.mxPopupMenuIcon {
+ background-color: white;
+ padding: 2px;
+}
+
+td.mxPopupMenuIcon .geIcon {
+ border: 1px solid transparent;
+ opacity: 0.5;
+ display: inline-block;
+ padding: 5px 12px;
+ font-size: 16px;
+}
+
+td.mxPopupMenuIcon .geIcon:hover {
+ border-radius: 2px;
+ opacity: 0.9;
+}
+
+html tr.mxPopupMenuItem {
+ color: #182b50;
+
+ td {
+ color: #182b50;
+
+ span {
+ color: gray
+ }
+ }
+}
+
+html tr.mxPopupMenuItemHover {
+ background-color: #FFF;
+ color: black;
+}
+
+html tr.mxPopupMenuItemHover {
+ td {
+ // color:#5382FB;
+ color: #5382FB;
+ background: #d7e6fe;
+
+ span {
+ color: #5382FB;
+ background: #d7e6fe;
+ }
+ }
+}
+
+table.mxPopupMenu hr {
+ color: #d1d5dc;
+ background-color: #d1d5dc;
+ border: none;
+ height: 1px;
+}
+
+table.mxPopupMenu tr {
+ font-size: 4pt;
+}
+
+html td.mxWindowTitle {
+ font-family: Helvetica Neue, Helvetica, Arial Unicode MS, Arial;
+ text-align: left;
+ font-size: 12px;
+ color: rgb(112, 112, 112);
+ padding: 4px;
+}
\ No newline at end of file
diff --git a/oaweb/public/cherry/drawio/src/images/button.gif b/oaweb/public/cherry/drawio/src/images/button.gif
new file mode 100644
index 0000000..ad55cab
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/button.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/close.gif b/oaweb/public/cherry/drawio/src/images/close.gif
new file mode 100644
index 0000000..1069e94
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/close.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/collapsed.gif b/oaweb/public/cherry/drawio/src/images/collapsed.gif
new file mode 100644
index 0000000..0276444
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/collapsed.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/error.gif b/oaweb/public/cherry/drawio/src/images/error.gif
new file mode 100644
index 0000000..14e1aee
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/error.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/expanded.gif b/oaweb/public/cherry/drawio/src/images/expanded.gif
new file mode 100644
index 0000000..3767b0b
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/expanded.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/maximize.gif b/oaweb/public/cherry/drawio/src/images/maximize.gif
new file mode 100644
index 0000000..e27cf3e
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/maximize.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/minimize.gif b/oaweb/public/cherry/drawio/src/images/minimize.gif
new file mode 100644
index 0000000..1e95e7c
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/minimize.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/normalize.gif b/oaweb/public/cherry/drawio/src/images/normalize.gif
new file mode 100644
index 0000000..34a8d30
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/normalize.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/point.gif b/oaweb/public/cherry/drawio/src/images/point.gif
new file mode 100644
index 0000000..9074c39
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/point.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/resize.gif b/oaweb/public/cherry/drawio/src/images/resize.gif
new file mode 100644
index 0000000..ff558db
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/resize.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/separator.gif b/oaweb/public/cherry/drawio/src/images/separator.gif
new file mode 100644
index 0000000..5c1b895
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/separator.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/submenu.gif b/oaweb/public/cherry/drawio/src/images/submenu.gif
new file mode 100644
index 0000000..ffe7617
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/submenu.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/transparent.gif b/oaweb/public/cherry/drawio/src/images/transparent.gif
new file mode 100644
index 0000000..76040f2
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/transparent.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/warning.gif b/oaweb/public/cherry/drawio/src/images/warning.gif
new file mode 100644
index 0000000..705235f
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/warning.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/warning.png b/oaweb/public/cherry/drawio/src/images/warning.png
new file mode 100644
index 0000000..2f78789
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/warning.png differ
diff --git a/oaweb/public/cherry/drawio/src/images/window-title.gif b/oaweb/public/cherry/drawio/src/images/window-title.gif
new file mode 100644
index 0000000..231def8
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/window-title.gif differ
diff --git a/oaweb/public/cherry/drawio/src/images/window.gif b/oaweb/public/cherry/drawio/src/images/window.gif
new file mode 100644
index 0000000..6631c4f
Binary files /dev/null and b/oaweb/public/cherry/drawio/src/images/window.gif differ
diff --git a/oaweb/public/cherry/drawio/src/js/editor/mxDefaultKeyHandler.js b/oaweb/public/cherry/drawio/src/js/editor/mxDefaultKeyHandler.js
new file mode 100644
index 0000000..237dea4
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/js/editor/mxDefaultKeyHandler.js
@@ -0,0 +1,126 @@
+/**
+ * Copyright (c) 2006-2015, JGraph Ltd
+ * Copyright (c) 2006-2015, Gaudenz Alder
+ */
+/**
+ * Class: mxDefaultKeyHandler
+ *
+ * Binds keycodes to actionnames in an editor. This aggregates an internal
+ * and extends the implementation of to not
+ * only cancel the editing, but also hide the properties dialog and fire an
+ * event via . An instance of this class is created
+ * by and stored in .
+ *
+ * Example:
+ *
+ * Bind the delete key to the delete action in an existing editor.
+ *
+ * (code)
+ * var keyHandler = new mxDefaultKeyHandler(editor);
+ * keyHandler.bindAction(46, 'delete');
+ * (end)
+ *
+ * Codec:
+ *
+ * This class uses the to read configuration
+ * data into an existing instance. See for a
+ * description of the configuration format.
+ *
+ * Keycodes:
+ *
+ * See .
+ *
+ * An event is fired via the editor if the escape key is
+ * pressed.
+ *
+ * Constructor: mxDefaultKeyHandler
+ *
+ * Constructs a new default key handler for the in the
+ * given . (The editor may be null if a prototypical instance for
+ * a is created.)
+ *
+ * Parameters:
+ *
+ * editor - Reference to the enclosing .
+ */
+function mxDefaultKeyHandler(editor)
+{
+ if (editor != null)
+ {
+ this.editor = editor;
+ this.handler = new mxKeyHandler(editor.graph);
+
+ // Extends the escape function of the internal key
+ // handle to hide the properties dialog and fire
+ // the escape event via the editor instance
+ var old = this.handler.escape;
+
+ this.handler.escape = function(evt)
+ {
+ old.apply(this, arguments);
+ editor.hideProperties();
+ editor.fireEvent(new mxEventObject(mxEvent.ESCAPE, 'event', evt));
+ };
+ }
+};
+
+/**
+ * Variable: editor
+ *
+ * Reference to the enclosing .
+ */
+mxDefaultKeyHandler.prototype.editor = null;
+
+/**
+ * Variable: handler
+ *
+ * Holds the for key event handling.
+ */
+mxDefaultKeyHandler.prototype.handler = null;
+
+/**
+ * Function: bindAction
+ *
+ * Binds the specified keycode to the given action in . The
+ * optional control flag specifies if the control key must be pressed
+ * to trigger the action.
+ *
+ * Parameters:
+ *
+ * code - Integer that specifies the keycode.
+ * action - Name of the action to execute in .
+ * control - Optional boolean that specifies if control must be pressed.
+ * Default is false.
+ */
+mxDefaultKeyHandler.prototype.bindAction = function (code, action, control)
+{
+ var keyHandler = mxUtils.bind(this, function()
+ {
+ this.editor.execute(action);
+ });
+
+ // Binds the function to control-down keycode
+ if (control)
+ {
+ this.handler.bindControlKey(code, keyHandler);
+ }
+
+ // Binds the function to the normal keycode
+ else
+ {
+ this.handler.bindKey(code, keyHandler);
+ }
+};
+
+/**
+ * Function: destroy
+ *
+ * Destroys the associated with this object. This does normally
+ * not need to be called, the is destroyed automatically when the
+ * window unloads (in IE) by .
+ */
+mxDefaultKeyHandler.prototype.destroy = function ()
+{
+ this.handler.destroy();
+ this.handler = null;
+};
diff --git a/oaweb/public/cherry/drawio/src/js/editor/mxDefaultPopupMenu.js b/oaweb/public/cherry/drawio/src/js/editor/mxDefaultPopupMenu.js
new file mode 100644
index 0000000..2f2e6e7
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/js/editor/mxDefaultPopupMenu.js
@@ -0,0 +1,306 @@
+/**
+ * Copyright (c) 2006-2015, JGraph Ltd
+ * Copyright (c) 2006-2015, Gaudenz Alder
+ */
+/**
+ * Class: mxDefaultPopupMenu
+ *
+ * Creates popupmenus for mouse events. This object holds an XML node
+ * which is a description of the popup menu to be created. In
+ * , the configuration is applied to the context and
+ * the resulting menu items are added to the menu dynamically. See
+ * for a description of the configuration format.
+ *
+ * This class does not create the DOM nodes required for the popup menu, it
+ * only parses an XML description to invoke the respective methods on an
+ * each time the menu is displayed.
+ *
+ * Codec:
+ *
+ * This class uses the to read configuration
+ * data into an existing instance, however, the actual parsing is done
+ * by this class during program execution, so the format is described
+ * below.
+ *
+ * Constructor: mxDefaultPopupMenu
+ *
+ * Constructs a new popupmenu-factory based on given configuration.
+ *
+ * Paramaters:
+ *
+ * config - XML node that contains the configuration data.
+ */
+function mxDefaultPopupMenu(config)
+{
+ this.config = config;
+};
+
+/**
+ * Variable: imageBasePath
+ *
+ * Base path for all icon attributes in the config. Default is null.
+ */
+mxDefaultPopupMenu.prototype.imageBasePath = null;
+
+/**
+ * Variable: config
+ *
+ * XML node used as the description of new menu items. This node is
+ * used in to dynamically create the menu items if their
+ * respective conditions evaluate to true for the given arguments.
+ */
+mxDefaultPopupMenu.prototype.config = null;
+
+/**
+ * Function: createMenu
+ *
+ * This function is called from to add items to the
+ * given menu based on . The config is a sequence of
+ * the following nodes and attributes.
+ *
+ * Child Nodes:
+ *
+ * add - Adds a new menu item. See below for attributes.
+ * separator - Adds a separator. No attributes.
+ * condition - Adds a custom condition. Name attribute.
+ *
+ * The add-node may have a child node that defines a function to be invoked
+ * before the action is executed (or instead of an action to be executed).
+ *
+ * Attributes:
+ *
+ * as - Resource key for the label (needs entry in property file).
+ * action - Name of the action to execute in enclosing editor.
+ * icon - Optional icon (relative/absolute URL).
+ * iconCls - Optional CSS class for the icon.
+ * if - Optional name of condition that must be true (see below).
+ * enabled-if - Optional name of condition that specifies if the menu item
+ * should be enabled.
+ * name - Name of custom condition. Only for condition nodes.
+ *
+ * Conditions:
+ *
+ * nocell - No cell under the mouse.
+ * ncells - More than one cell selected.
+ * notRoot - Drilling position is other than home.
+ * cell - Cell under the mouse.
+ * notEmpty - Exactly one cell with children under mouse.
+ * expandable - Exactly one expandable cell under mouse.
+ * collapsable - Exactly one collapsable cell under mouse.
+ * validRoot - Exactly one cell which is a possible root under mouse.
+ * swimlane - Exactly one cell which is a swimlane under mouse.
+ *
+ * Example:
+ *
+ * To add a new item for a given action to the popupmenu:
+ *
+ * (code)
+ *
+ *
+ *
+ * (end)
+ *
+ * To add a new item for a custom function:
+ *
+ * (code)
+ *
+ *
+ *
+ * (end)
+ *
+ * The above example invokes action1 with an additional third argument via
+ * the editor instance. The third argument is passed to the function that
+ * defines action1. If the add-node has no action-attribute, then only the
+ * function defined in the text content is executed, otherwise first the
+ * function and then the action defined in the action-attribute is
+ * executed. The function in the text content has 3 arguments, namely the
+ * instance, the instance under the mouse, and the
+ * native mouse event.
+ *
+ * Custom Conditions:
+ *
+ * To add a new condition for popupmenu items:
+ *
+ * (code)
+ *
+ * (end)
+ *
+ * The new condition can then be used in any item as follows:
+ *
+ * (code)
+ *
+ * (end)
+ *
+ * The order in which the items and conditions appear is not significant as
+ * all connditions are evaluated before any items are created.
+ *
+ * Parameters:
+ *
+ * editor - Enclosing instance.
+ * menu - that is used for adding items and separators.
+ * cell - Optional which is under the mousepointer.
+ * evt - Optional mouse event which triggered the menu.
+ */
+mxDefaultPopupMenu.prototype.createMenu = function(editor, menu, cell, evt)
+{
+ if (this.config != null)
+ {
+ var conditions = this.createConditions(editor, cell, evt);
+ var item = this.config.firstChild;
+
+ this.addItems(editor, menu, cell, evt, conditions, item, null);
+ }
+};
+
+/**
+ * Function: addItems
+ *
+ * Recursively adds the given items and all of its children into the given menu.
+ *
+ * Parameters:
+ *
+ * editor - Enclosing instance.
+ * menu - that is used for adding items and separators.
+ * cell - Optional which is under the mousepointer.
+ * evt - Optional mouse event which triggered the menu.
+ * conditions - Array of names boolean conditions.
+ * item - XML node that represents the current menu item.
+ * parent - DOM node that represents the parent menu item.
+ */
+mxDefaultPopupMenu.prototype.addItems = function(editor, menu, cell, evt, conditions, item, parent)
+{
+ var addSeparator = false;
+
+ while (item != null)
+ {
+ if (item.nodeName == 'add')
+ {
+ var condition = item.getAttribute('if');
+
+ if (condition == null || conditions[condition])
+ {
+ var as = item.getAttribute('as');
+ as = mxResources.get(as) || as;
+ var funct = mxUtils.eval(mxUtils.getTextContent(item));
+ var action = item.getAttribute('action');
+ var icon = item.getAttribute('icon');
+ var iconCls = item.getAttribute('iconCls');
+ var enabledCond = item.getAttribute('enabled-if');
+ var enabled = enabledCond == null || conditions[enabledCond];
+
+ if (addSeparator)
+ {
+ menu.addSeparator(parent);
+ addSeparator = false;
+ }
+
+ if (icon != null && this.imageBasePath)
+ {
+ icon = this.imageBasePath + icon;
+ }
+
+ var row = this.addAction(menu, editor, as, icon, funct, action, cell, parent, iconCls, enabled);
+ this.addItems(editor, menu, cell, evt, conditions, item.firstChild, row);
+ }
+ }
+ else if (item.nodeName == 'separator')
+ {
+ addSeparator = true;
+ }
+
+ item = item.nextSibling;
+ }
+};
+
+/**
+ * Function: addAction
+ *
+ * Helper method to bind an action to a new menu item.
+ *
+ * Parameters:
+ *
+ * menu - that is used for adding items and separators.
+ * editor - Enclosing instance.
+ * lab - String that represents the label of the menu item.
+ * icon - Optional URL that represents the icon of the menu item.
+ * action - Optional name of the action to execute in the given editor.
+ * funct - Optional function to execute before the optional action. The
+ * function takes an , the under the mouse and the
+ * mouse event that triggered the call.
+ * cell - Optional to use as an argument for the action.
+ * parent - DOM node that represents the parent menu item.
+ * iconCls - Optional CSS class for the menu icon.
+ * enabled - Optional boolean that specifies if the menu item is enabled.
+ * Default is true.
+ */
+mxDefaultPopupMenu.prototype.addAction = function(menu, editor, lab, icon, funct, action, cell, parent, iconCls, enabled)
+{
+ var clickHandler = function(evt)
+ {
+ if (typeof(funct) == 'function')
+ {
+ funct.call(editor, editor, cell, evt);
+ }
+
+ if (action != null)
+ {
+ editor.execute(action, cell, evt);
+ }
+ };
+
+ return menu.addItem(lab, icon, clickHandler, parent, iconCls, enabled);
+};
+
+/**
+ * Function: createConditions
+ *
+ * Evaluates the default conditions for the given context.
+ */
+mxDefaultPopupMenu.prototype.createConditions = function(editor, cell, evt)
+{
+ // Creates array with conditions
+ var model = editor.graph.getModel();
+ var childCount = model.getChildCount(cell);
+
+ // Adds some frequently used conditions
+ var conditions = [];
+ conditions['nocell'] = cell == null;
+ conditions['ncells'] = editor.graph.getSelectionCount() > 1;
+ conditions['notRoot'] = model.getRoot() !=
+ model.getParent(editor.graph.getDefaultParent());
+ conditions['cell'] = cell != null;
+
+ var isCell = cell != null && editor.graph.getSelectionCount() == 1;
+ conditions['nonEmpty'] = isCell && childCount > 0;
+ conditions['expandable'] = isCell && editor.graph.isCellFoldable(cell, false);
+ conditions['collapsable'] = isCell && editor.graph.isCellFoldable(cell, true);
+ conditions['validRoot'] = isCell && editor.graph.isValidRoot(cell);
+ conditions['emptyValidRoot'] = conditions['validRoot'] && childCount == 0;
+ conditions['swimlane'] = isCell && editor.graph.isSwimlane(cell);
+
+ // Evaluates dynamic conditions from config file
+ var condNodes = this.config.getElementsByTagName('condition');
+
+ for (var i=0; i to read configuration
+ * data into an existing instance. See for a
+ * description of the configuration format.
+ *
+ * Constructor: mxDefaultToolbar
+ *
+ * Constructs a new toolbar for the given container and editor. The
+ * container and editor may be null if a prototypical instance for a
+ * is created.
+ *
+ * Parameters:
+ *
+ * container - DOM node that contains the toolbar.
+ * editor - Reference to the enclosing .
+ */
+function mxDefaultToolbar(container, editor)
+{
+ this.editor = editor;
+
+ if (container != null && editor != null)
+ {
+ this.init(container);
+ }
+};
+
+/**
+ * Variable: editor
+ *
+ * Reference to the enclosing .
+ */
+mxDefaultToolbar.prototype.editor = null;
+
+/**
+ * Variable: toolbar
+ *
+ * Holds the internal .
+ */
+mxDefaultToolbar.prototype.toolbar = null;
+
+/**
+ * Variable: resetHandler
+ *
+ * Reference to the function used to reset the .
+ */
+mxDefaultToolbar.prototype.resetHandler = null;
+
+/**
+ * Variable: spacing
+ *
+ * Defines the spacing between existing and new vertices in
+ * gridSize units when a new vertex is dropped on an existing
+ * cell. Default is 4 (40 pixels).
+ */
+mxDefaultToolbar.prototype.spacing = 4;
+
+/**
+ * Variable: connectOnDrop
+ *
+ * Specifies if elements should be connected if new cells are dropped onto
+ * connectable elements. Default is false.
+ */
+mxDefaultToolbar.prototype.connectOnDrop = false;
+
+/**
+ * Variable: init
+ *
+ * Constructs the for the given container and installs a listener
+ * that updates the on if an item is
+ * selected in the toolbar. This assumes that is not null.
+ *
+ * Parameters:
+ *
+ * container - DOM node that contains the toolbar.
+ */
+mxDefaultToolbar.prototype.init = function(container)
+{
+ if (container != null)
+ {
+ this.toolbar = new mxToolbar(container);
+
+ // Installs the insert function in the editor if an item is
+ // selected in the toolbar
+ this.toolbar.addListener(mxEvent.SELECT, mxUtils.bind(this, function(sender, evt)
+ {
+ var funct = evt.getProperty('function');
+
+ if (funct != null)
+ {
+ this.editor.insertFunction = mxUtils.bind(this, function()
+ {
+ funct.apply(this, arguments);
+ this.toolbar.resetMode();
+ });
+ }
+ else
+ {
+ this.editor.insertFunction = null;
+ }
+ }));
+
+ // Resets the selected tool after a doubleclick or escape keystroke
+ this.resetHandler = mxUtils.bind(this, function()
+ {
+ if (this.toolbar != null)
+ {
+ this.toolbar.resetMode(true);
+ }
+ });
+
+ this.editor.graph.addListener(mxEvent.DOUBLE_CLICK, this.resetHandler);
+ this.editor.addListener(mxEvent.ESCAPE, this.resetHandler);
+ }
+};
+
+/**
+ * Function: addItem
+ *
+ * Adds a new item that executes the given action in . The title,
+ * icon and pressedIcon are used to display the toolbar item.
+ *
+ * Parameters:
+ *
+ * title - String that represents the title (tooltip) for the item.
+ * icon - URL of the icon to be used for displaying the item.
+ * action - Name of the action to execute when the item is clicked.
+ * pressed - Optional URL of the icon for the pressed state.
+ */
+mxDefaultToolbar.prototype.addItem = function(title, icon, action, pressed)
+{
+ var clickHandler = mxUtils.bind(this, function()
+ {
+ if (action != null && action.length > 0)
+ {
+ this.editor.execute(action);
+ }
+ });
+
+ return this.toolbar.addItem(title, icon, clickHandler, pressed);
+};
+
+/**
+ * Function: addSeparator
+ *
+ * Adds a vertical separator using the optional icon.
+ *
+ * Parameters:
+ *
+ * icon - Optional URL of the icon that represents the vertical separator.
+ * Default is + '/separator.gif'.
+ */
+mxDefaultToolbar.prototype.addSeparator = function(icon)
+{
+ icon = icon || mxClient.imageBasePath + '/separator.gif';
+ this.toolbar.addSeparator(icon);
+};
+
+/**
+ * Function: addCombo
+ *
+ * Helper method to invoke on and return the
+ * resulting DOM node.
+ */
+mxDefaultToolbar.prototype.addCombo = function()
+{
+ return this.toolbar.addCombo();
+};
+
+/**
+ * Function: addActionCombo
+ *
+ * Helper method to invoke on using
+ * the given title and return the resulting DOM node.
+ *
+ * Parameters:
+ *
+ * title - String that represents the title of the combo.
+ */
+mxDefaultToolbar.prototype.addActionCombo = function(title)
+{
+ return this.toolbar.addActionCombo(title);
+};
+
+/**
+ * Function: addActionOption
+ *
+ * Binds the given action to a option with the specified label in the
+ * given combo. Combo is an object returned from an earlier call to
+ * or .
+ *
+ * Parameters:
+ *
+ * combo - DOM node that represents the combo box.
+ * title - String that represents the title of the combo.
+ * action - Name of the action to execute in .
+ */
+mxDefaultToolbar.prototype.addActionOption = function(combo, title, action)
+{
+ var clickHandler = mxUtils.bind(this, function()
+ {
+ this.editor.execute(action);
+ });
+
+ this.addOption(combo, title, clickHandler);
+};
+
+/**
+ * Function: addOption
+ *
+ * Helper method to invoke on and return
+ * the resulting DOM node that represents the option.
+ *
+ * Parameters:
+ *
+ * combo - DOM node that represents the combo box.
+ * title - String that represents the title of the combo.
+ * value - Object that represents the value of the option.
+ */
+mxDefaultToolbar.prototype.addOption = function(combo, title, value)
+{
+ return this.toolbar.addOption(combo, title, value);
+};
+
+/**
+ * Function: addMode
+ *
+ * Creates an item for selecting the given mode in the 's graph.
+ * Supported modenames are select, connect and pan.
+ *
+ * Parameters:
+ *
+ * title - String that represents the title of the item.
+ * icon - URL of the icon that represents the item.
+ * mode - String that represents the mode name to be used in
+ * .
+ * pressed - Optional URL of the icon that represents the pressed state.
+ * funct - Optional JavaScript function that takes the as the
+ * first and only argument that is executed after the mode has been
+ * selected.
+ */
+mxDefaultToolbar.prototype.addMode = function(title, icon, mode, pressed, funct)
+{
+ var clickHandler = mxUtils.bind(this, function()
+ {
+ this.editor.setMode(mode);
+
+ if (funct != null)
+ {
+ funct(this.editor);
+ }
+ });
+
+ return this.toolbar.addSwitchMode(title, icon, clickHandler, pressed);
+};
+
+/**
+ * Function: addPrototype
+ *
+ * Creates an item for inserting a clone of the specified prototype cell into
+ * the 's graph. The ptype may either be a cell or a function that
+ * returns a cell.
+ *
+ * Parameters:
+ *
+ * title - String that represents the title of the item.
+ * icon - URL of the icon that represents the item.
+ * ptype - Function or object that represents the prototype cell. If ptype
+ * is a function then it is invoked with no arguments to create new
+ * instances.
+ * pressed - Optional URL of the icon that represents the pressed state.
+ * insert - Optional JavaScript function that handles an insert of the new
+ * cell. This function takes the , new cell to be inserted, mouse
+ * event and optional under the mouse pointer as arguments.
+ * toggle - Optional boolean that specifies if the item can be toggled.
+ * Default is true.
+ */
+mxDefaultToolbar.prototype.addPrototype = function(title, icon, ptype, pressed, insert, toggle)
+{
+ // Creates a wrapper function that is in charge of constructing
+ // the new cell instance to be inserted into the graph
+ var factory = mxUtils.bind(this, function()
+ {
+ if (typeof(ptype) == 'function')
+ {
+ return ptype();
+ }
+ else if (ptype != null)
+ {
+ return this.editor.graph.cloneCell(ptype);
+ }
+
+ return null;
+ });
+
+ // Defines the function for a click event on the graph
+ // after this item has been selected in the toolbar
+ var clickHandler = mxUtils.bind(this, function(evt, cell)
+ {
+ if (typeof(insert) == 'function')
+ {
+ insert(this.editor, factory(), evt, cell);
+ }
+ else
+ {
+ this.drop(factory(), evt, cell);
+ }
+
+ this.toolbar.resetMode();
+ mxEvent.consume(evt);
+ });
+
+ var img = this.toolbar.addMode(title, icon, clickHandler, pressed, null, toggle);
+
+ // Creates a wrapper function that calls the click handler without
+ // the graph argument
+ var dropHandler = function(graph, evt, cell)
+ {
+ clickHandler(evt, cell);
+ };
+
+ this.installDropHandler(img, dropHandler);
+
+ return img;
+};
+
+/**
+ * Function: drop
+ *
+ * Handles a drop from a toolbar item to the graph. The given vertex
+ * represents the new cell to be inserted. This invokes or
+ * depending on the given target cell.
+ *
+ * Parameters:
+ *
+ * vertex - to be inserted.
+ * evt - Mouse event that represents the drop.
+ * target - Optional that represents the drop target.
+ */
+mxDefaultToolbar.prototype.drop = function(vertex, evt, target)
+{
+ var graph = this.editor.graph;
+ var model = graph.getModel();
+
+ if (target == null ||
+ model.isEdge(target) ||
+ !this.connectOnDrop ||
+ !graph.isCellConnectable(target))
+ {
+ while (target != null &&
+ !graph.isValidDropTarget(target, [vertex], evt))
+ {
+ target = model.getParent(target);
+ }
+
+ this.insert(vertex, evt, target);
+ }
+ else
+ {
+ this.connect(vertex, evt, target);
+ }
+};
+
+/**
+ * Function: insert
+ *
+ * Handles a drop by inserting the given vertex into the given parent cell
+ * or the default parent if no parent is specified.
+ *
+ * Parameters:
+ *
+ * vertex - to be inserted.
+ * evt - Mouse event that represents the drop.
+ * parent - Optional that represents the parent.
+ */
+mxDefaultToolbar.prototype.insert = function(vertex, evt, target)
+{
+ var graph = this.editor.graph;
+
+ if (graph.canImportCell(vertex))
+ {
+ var x = mxEvent.getClientX(evt);
+ var y = mxEvent.getClientY(evt);
+ var pt = mxUtils.convertPoint(graph.container, x, y);
+
+ // Splits the target edge or inserts into target group
+ if (graph.isSplitEnabled() &&
+ graph.isSplitTarget(target, [vertex], evt))
+ {
+ return graph.splitEdge(target, [vertex], null, pt.x, pt.y);
+ }
+ else
+ {
+ return this.editor.addVertex(target, vertex, pt.x, pt.y);
+ }
+ }
+
+ return null;
+};
+
+/**
+ * Function: connect
+ *
+ * Handles a drop by connecting the given vertex to the given source cell.
+ *
+ * vertex - to be inserted.
+ * evt - Mouse event that represents the drop.
+ * source - Optional that represents the source terminal.
+ */
+mxDefaultToolbar.prototype.connect = function(vertex, evt, source)
+{
+ var graph = this.editor.graph;
+ var model = graph.getModel();
+
+ if (source != null &&
+ graph.isCellConnectable(vertex) &&
+ graph.isEdgeValid(null, source, vertex))
+ {
+ var edge = null;
+
+ model.beginUpdate();
+ try
+ {
+ var geo = model.getGeometry(source);
+ var g = model.getGeometry(vertex).clone();
+
+ // Moves the vertex away from the drop target that will
+ // be used as the source for the new connection
+ g.x = geo.x + (geo.width - g.width) / 2;
+ g.y = geo.y + (geo.height - g.height) / 2;
+
+ var step = this.spacing * graph.gridSize;
+ var dist = model.getDirectedEdgeCount(source, true) * 20;
+
+ if (this.editor.horizontalFlow)
+ {
+ g.x += (g.width + geo.width) / 2 + step + dist;
+ }
+ else
+ {
+ g.y += (g.height + geo.height) / 2 + step + dist;
+ }
+
+ vertex.setGeometry(g);
+
+ // Fires two add-events with the code below - should be fixed
+ // to only fire one add event for both inserts
+ var parent = model.getParent(source);
+ graph.addCell(vertex, parent);
+ graph.constrainChild(vertex);
+
+ // Creates the edge using the editor instance and calls
+ // the second function that fires an add event
+ edge = this.editor.createEdge(source, vertex);
+
+ if (model.getGeometry(edge) == null)
+ {
+ var edgeGeometry = new mxGeometry();
+ edgeGeometry.relative = true;
+
+ model.setGeometry(edge, edgeGeometry);
+ }
+
+ graph.addEdge(edge, parent, source, vertex);
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+
+ graph.setSelectionCells([vertex, edge]);
+ graph.scrollCellToVisible(vertex);
+ }
+};
+
+/**
+ * Function: installDropHandler
+ *
+ * Makes the given img draggable using the given function for handling a
+ * drop event.
+ *
+ * Parameters:
+ *
+ * img - DOM node that represents the image.
+ * dropHandler - Function that handles a drop of the image.
+ */
+mxDefaultToolbar.prototype.installDropHandler = function (img, dropHandler)
+{
+ var sprite = document.createElement('img');
+ sprite.setAttribute('src', img.getAttribute('src'));
+
+ // Handles delayed loading of the images
+ var loader = mxUtils.bind(this, function(evt)
+ {
+ // Preview uses the image node with double size. Later this can be
+ // changed to use a separate preview and guides, but for this the
+ // dropHandler must use the additional x- and y-arguments and the
+ // dragsource which makeDraggable returns much be configured to
+ // use guides via mxDragSource.isGuidesEnabled.
+ sprite.style.width = (2 * img.offsetWidth) + 'px';
+ sprite.style.height = (2 * img.offsetHeight) + 'px';
+
+ mxUtils.makeDraggable(img, this.editor.graph, dropHandler,
+ sprite);
+ mxEvent.removeListener(sprite, 'load', loader);
+ });
+
+ if (mxClient.IS_IE)
+ {
+ loader();
+ }
+ else
+ {
+ mxEvent.addListener(sprite, 'load', loader);
+ }
+};
+
+/**
+ * Function: destroy
+ *
+ * Destroys the associated with this object and removes all
+ * installed listeners. This does normally not need to be called, the
+ * is destroyed automatically when the window unloads (in IE) by
+ * .
+ */
+mxDefaultToolbar.prototype.destroy = function ()
+{
+ if (this.resetHandler != null)
+ {
+ this.editor.graph.removeListener('dblclick', this.resetHandler);
+ this.editor.removeListener('escape', this.resetHandler);
+ this.resetHandler = null;
+ }
+
+ if (this.toolbar != null)
+ {
+ this.toolbar.destroy();
+ this.toolbar = null;
+ }
+};
diff --git a/oaweb/public/cherry/drawio/src/js/editor/mxEditor.js b/oaweb/public/cherry/drawio/src/js/editor/mxEditor.js
new file mode 100644
index 0000000..9f7330b
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/js/editor/mxEditor.js
@@ -0,0 +1,3118 @@
+/**
+ * Copyright (c) 2006-2015, JGraph Ltd
+ * Copyright (c) 2006-2015, Gaudenz Alder
+ */
+/**
+ * Class: mxEditor
+ *
+ * Extends to implement a application wrapper for a graph that
+ * adds , I/O using , auto-layout using ,
+ * command history using , and standard dialogs and widgets, eg.
+ * properties, help, outline, toolbar, and popupmenu. It also adds
+ * to be used as cells in toolbars, auto-validation using the
+ * flag, attribute cycling using , higher-level events
+ * such as , and backend integration using and .
+ *
+ * Actions:
+ *
+ * Actions are functions stored in the array under their names. The
+ * functions take the as the first, and an optional as the
+ * second argument and are invoked using . Any additional arguments
+ * passed to execute are passed on to the action as-is.
+ *
+ * A list of built-in actions is available in the description.
+ *
+ * Read/write Diagrams:
+ *
+ * To read a diagram from an XML string, for example from a textfield within the
+ * page, the following code is used:
+ *
+ * (code)
+ * var doc = mxUtils.parseXML(xmlString);
+ * var node = doc.documentElement;
+ * editor.readGraphModel(node);
+ * (end)
+ *
+ * For reading a diagram from a remote location, use the method.
+ *
+ * To save diagrams in XML on a server, you can set the variable.
+ * This variable will be used in to construct a URL for the post
+ * request that is issued in the method. The post request contains the
+ * XML representation of the diagram as returned by in the
+ * xml parameter.
+ *
+ * On the server side, the post request is processed using standard
+ * technologies such as Java Servlets, CGI, .NET or ASP.
+ *
+ * Here are some examples of processing a post request in various languages.
+ *
+ * - Java: URLDecoder.decode(request.getParameter("xml"), "UTF-8").replace("\n", "
")
+ *
+ * Note that the linefeeds should only be replaced if the XML is
+ * processed in Java, for example when creating an image, but not
+ * if the XML is passed back to the client-side.
+ *
+ * - .NET: HttpUtility.UrlDecode(context.Request.Params["xml"])
+ * - PHP: urldecode($_POST["xml"])
+ *
+ * Creating images:
+ *
+ * A backend (Java, PHP or C#) is required for creating images. The
+ * distribution contains an example for each backend (ImageHandler.java,
+ * ImageHandler.cs and graph.php). More information about using a backend
+ * to create images can be found in the readme.html files. Note that the
+ * preview is implemented using VML/SVG in the browser and does not require
+ * a backend. The backend is only required to creates images (bitmaps).
+ *
+ * Special characters:
+ *
+ * Note There are five characters that should always appear in XML content as
+ * escapes, so that they do not interact with the syntax of the markup. These
+ * are part of the language for all documents based on XML and for HTML.
+ *
+ * - < (<)
+ * - > (>)
+ * - & (&)
+ * - " (")
+ * - ' (')
+ *
+ * Although it is part of the XML language, ' is not defined in HTML.
+ * For this reason the XHTML specification recommends instead the use of
+ * ' if text may be passed to a HTML user agent.
+ *
+ * If you are having problems with special characters on the server-side then
+ * you may want to try the flag.
+ *
+ * For converting decimal escape sequences inside strings, a user has provided
+ * us with the following function:
+ *
+ * (code)
+ * function html2js(text)
+ * {
+ * var entitySearch = /&#[0-9]+;/;
+ * var entity;
+ *
+ * while (entity = entitySearch.exec(text))
+ * {
+ * var charCode = entity[0].substring(2, entity[0].length -1);
+ * text = text.substring(0, entity.index)
+ * + String.fromCharCode(charCode)
+ * + text.substring(entity.index + entity[0].length);
+ * }
+ *
+ * return text;
+ * }
+ * (end)
+ *
+ * Otherwise try using hex escape sequences and the built-in unescape function
+ * for converting such strings.
+ *
+ * Local Files:
+ *
+ * For saving and opening local files, no standardized method exists that
+ * works across all browsers. The recommended way of dealing with local files
+ * is to create a backend that streams the XML data back to the browser (echo)
+ * as an attachment so that a Save-dialog is displayed on the client-side and
+ * the file can be saved to the local disk.
+ *
+ * For example, in PHP the code that does this looks as follows.
+ *
+ * (code)
+ * $xml = stripslashes($_POST["xml"]);
+ * header("Content-Disposition: attachment; filename=\"diagram.xml\"");
+ * echo($xml);
+ * (end)
+ *
+ * To open a local file, the file should be uploaded via a form in the browser
+ * and then opened from the server in the editor.
+ *
+ * Cell Properties:
+ *
+ * The properties displayed in the properties dialog are the attributes and
+ * values of the cell's user object, which is an XML node. The XML node is
+ * defined in the templates section of the config file.
+ *
+ * The templates are stored in and contain cells which
+ * are cloned at insertion time to create new vertices by use of drag and
+ * drop from the toolbar. Each entry in the toolbar for adding a new vertex
+ * must refer to an existing template.
+ *
+ * In the following example, the task node is a business object and only the
+ * mxCell node and its mxGeometry child contain graph information:
+ *
+ * (code)
+ *
+ *
+ *
+ *
+ *
+ * (end)
+ *
+ * The idea is that the XML representation is inverse from the in-memory
+ * representation: The outer XML node is the user object and the inner node is
+ * the cell. This means the user object of the cell is the Task node with no
+ * children for the above example:
+ *
+ * (code)
+ *
+ * (end)
+ *
+ * The Task node can have any tag name, attributes and child nodes. The
+ * will use the XML hierarchy as the user object, while removing the
+ * "known annotations", such as the mxCell node. At save-time the cell data
+ * will be "merged" back into the user object. The user object is only modified
+ * via the properties dialog during the lifecycle of the cell.
+ *
+ * In the default implementation of , the user object's
+ * attributes are put into a form for editing. Attributes are changed using
+ * the action in the model. The dialog can be replaced
+ * by overriding the hook or by replacing the showProperties
+ * action in . Alternatively, the entry in the config file's popupmenu
+ * section can be modified to invoke a different action.
+ *
+ * If you want to displey the properties dialog on a doubleclick, you can set
+ * to showProperties as follows:
+ *
+ * (code)
+ * editor.dblClickAction = 'showProperties';
+ * (end)
+ *
+ * Popupmenu and Toolbar:
+ *
+ * The toolbar and popupmenu are typically configured using the respective
+ * sections in the config file, that is, the popupmenu is defined as follows:
+ *
+ * (code)
+ *
+ *
+ *
+ * ...
+ * (end)
+ *
+ * New entries can be added to the toolbar by inserting an add-node into the
+ * above configuration. Existing entries may be removed and changed by
+ * modifying or removing the respective entries in the configuration.
+ * The configuration is read by the , the format of the
+ * configuration is explained in .
+ *
+ * The toolbar is defined in the mxDefaultToolbar section. Items can be added
+ * and removed in this section.
+ *
+ * (code)
+ *
+ *
+ *
+ *
+ * ...
+ * (end)
+ *
+ * The format of the configuration is described in
+ * .
+ *
+ * Ids:
+ *
+ * For the IDs, there is an implicit behaviour in : It moves the Id
+ * from the cell to the user object at encoding time and vice versa at decoding
+ * time. For example, if the Task node from above has an id attribute, then
+ * the of the corresponding cell will have this value. If there
+ * is no Id collision in the model, then the cell may be retrieved using this
+ * Id with the function. If there is a collision, a new
+ * Id will be created for the cell using . At encoding
+ * time, this new Id will replace the value previously stored under the id
+ * attribute in the Task node.
+ *
+ * See , and
+ * for information about configuring the editor and user interface.
+ *
+ * Programmatically inserting cells:
+ *
+ * For inserting a new cell, say, by clicking a button in the document,
+ * the following code can be used. This requires an reference to the editor.
+ *
+ * (code)
+ * var userObject = new Object();
+ * var parent = editor.graph.getDefaultParent();
+ * var model = editor.graph.model;
+ * model.beginUpdate();
+ * try
+ * {
+ * editor.graph.insertVertex(parent, null, userObject, 20, 20, 80, 30);
+ * }
+ * finally
+ * {
+ * model.endUpdate();
+ * }
+ * (end)
+ *
+ * If a template cell from the config file should be inserted, then a clone
+ * of the template can be created as follows. The clone is then inserted using
+ * the add function instead of addVertex.
+ *
+ * (code)
+ * var template = editor.templates['task'];
+ * var clone = editor.graph.model.cloneCell(template);
+ * (end)
+ *
+ * Resources:
+ *
+ * resources/editor - Language resources for mxEditor
+ *
+ * Callback: onInit
+ *
+ * Called from within the constructor. In the callback,
+ * "this" refers to the editor instance.
+ *
+ * Cookie: mxgraph=seen
+ *
+ * Set when the editor is started. Never expires. Use
+ * to reset this cookie. This cookie
+ * only exists if is implemented.
+ *
+ * Event: mxEvent.OPEN
+ *
+ * Fires after a file was opened in . The filename property
+ * contains the filename that was used. The same value is also available in
+ * .
+ *
+ * Event: mxEvent.SAVE
+ *
+ * Fires after the current file was saved in . The url
+ * property contains the URL that was used for saving.
+ *
+ * Event: mxEvent.POST
+ *
+ * Fires if a successful response was received in . The
+ * request property contains the , the
+ * url and data properties contain the URL and the
+ * data that were used in the post request.
+ *
+ * Event: mxEvent.ROOT
+ *
+ * Fires when the current root has changed, or when the title of the current
+ * root has changed. This event has no properties.
+ *
+ * Event: mxEvent.BEFORE_ADD_VERTEX
+ *
+ * Fires before a vertex is added in . The vertex
+ * property contains the new vertex and the parent property
+ * contains its parent.
+ *
+ * Event: mxEvent.ADD_VERTEX
+ *
+ * Fires between begin- and endUpdate in . The vertex
+ * property contains the vertex that is being inserted.
+ *
+ * Event: mxEvent.AFTER_ADD_VERTEX
+ *
+ * Fires after a vertex was inserted and selected in . The
+ * vertex property contains the new vertex.
+ *
+ * Example:
+ *
+ * For starting an in-place edit after a new vertex has been added to the
+ * graph, the following code can be used.
+ *
+ * (code)
+ * editor.addListener(mxEvent.AFTER_ADD_VERTEX, function(sender, evt)
+ * {
+ * var vertex = evt.getProperty('vertex');
+ *
+ * if (editor.graph.isCellEditable(vertex))
+ * {
+ * editor.graph.startEditingAtCell(vertex);
+ * }
+ * });
+ * (end)
+ *
+ * Event: mxEvent.ESCAPE
+ *
+ * Fires when the escape key is pressed. The event property
+ * contains the key event.
+ *
+ * Constructor: mxEditor
+ *
+ * Constructs a new editor. This function invokes the callback
+ * upon completion.
+ *
+ * Example:
+ *
+ * (code)
+ * var config = mxUtils.load('config/diagrameditor.xml').getDocumentElement();
+ * var editor = new mxEditor(config);
+ * (end)
+ *
+ * Parameters:
+ *
+ * config - Optional XML node that contains the configuration.
+ */
+function mxEditor(config)
+{
+ this.actions = [];
+ this.addActions();
+
+ // Executes the following only if a document has been instanciated.
+ // That is, don't execute when the editorcodec is setup.
+ if (document.body != null)
+ {
+ // Defines instance fields
+ this.cycleAttributeValues = [];
+ this.popupHandler = new mxDefaultPopupMenu();
+ this.undoManager = new mxUndoManager();
+
+ // Creates the graph and toolbar without the containers
+ this.graph = this.createGraph();
+ this.toolbar = this.createToolbar();
+
+ // Creates the global keyhandler (requires graph instance)
+ this.keyHandler = new mxDefaultKeyHandler(this);
+
+ // Configures the editor using the URI
+ // which was passed to the ctor
+ this.configure(config);
+
+ // Assigns the swimlaneIndicatorColorAttribute on the graph
+ this.graph.swimlaneIndicatorColorAttribute = this.cycleAttributeName;
+
+ // Checks if the hook has been set
+ if (this.onInit != null)
+ {
+ // Invokes the hook
+ this.onInit();
+ }
+
+ // Automatic deallocation of memory
+ if (mxClient.IS_IE)
+ {
+ mxEvent.addListener(window, 'unload', mxUtils.bind(this, function()
+ {
+ this.destroy();
+ }));
+ }
+ }
+};
+
+/**
+ * Installs the required language resources at class
+ * loading time.
+ */
+if (mxLoadResources)
+{
+ mxResources.add(mxClient.basePath + '/resources/editor');
+}
+else
+{
+ mxClient.defaultBundles.push(mxClient.basePath + '/resources/editor');
+}
+
+/**
+ * Extends mxEventSource.
+ */
+mxEditor.prototype = new mxEventSource();
+mxEditor.prototype.constructor = mxEditor;
+
+/**
+ * Group: Controls and Handlers
+ */
+
+/**
+ * Variable: askZoomResource
+ *
+ * Specifies the resource key for the zoom dialog. If the resource for this
+ * key does not exist then the value is used as the error message. Default
+ * is 'askZoom'.
+ */
+mxEditor.prototype.askZoomResource = (mxClient.language != 'none') ? 'askZoom' : '';
+
+/**
+ * Variable: lastSavedResource
+ *
+ * Specifies the resource key for the last saved info. If the resource for
+ * this key does not exist then the value is used as the error message.
+ * Default is 'lastSaved'.
+ */
+mxEditor.prototype.lastSavedResource = (mxClient.language != 'none') ? 'lastSaved' : '';
+
+/**
+ * Variable: currentFileResource
+ *
+ * Specifies the resource key for the current file info. If the resource for
+ * this key does not exist then the value is used as the error message.
+ * Default is 'lastSaved'.
+ */
+mxEditor.prototype.currentFileResource = (mxClient.language != 'none') ? 'currentFile' : '';
+
+/**
+ * Variable: propertiesResource
+ *
+ * Specifies the resource key for the properties window title. If the
+ * resource for this key does not exist then the value is used as the
+ * error message. Default is 'properties'.
+ */
+mxEditor.prototype.propertiesResource = (mxClient.language != 'none') ? 'properties' : '';
+
+/**
+ * Variable: tasksResource
+ *
+ * Specifies the resource key for the tasks window title. If the
+ * resource for this key does not exist then the value is used as the
+ * error message. Default is 'tasks'.
+ */
+mxEditor.prototype.tasksResource = (mxClient.language != 'none') ? 'tasks' : '';
+
+/**
+ * Variable: helpResource
+ *
+ * Specifies the resource key for the help window title. If the
+ * resource for this key does not exist then the value is used as the
+ * error message. Default is 'help'.
+ */
+mxEditor.prototype.helpResource = (mxClient.language != 'none') ? 'help' : '';
+
+/**
+ * Variable: outlineResource
+ *
+ * Specifies the resource key for the outline window title. If the
+ * resource for this key does not exist then the value is used as the
+ * error message. Default is 'outline'.
+ */
+mxEditor.prototype.outlineResource = (mxClient.language != 'none') ? 'outline' : '';
+
+/**
+ * Variable: outline
+ *
+ * Reference to the that contains the outline. The
+ * is stored in outline.outline.
+ */
+mxEditor.prototype.outline = null;
+
+/**
+ * Variable: graph
+ *
+ * Holds a for displaying the diagram. The graph
+ * is created in .
+ */
+mxEditor.prototype.graph = null;
+
+/**
+ * Variable: graphRenderHint
+ *
+ * Holds the render hint used for creating the
+ * graph in . See .
+ * Default is null.
+ */
+mxEditor.prototype.graphRenderHint = null;
+
+/**
+ * Variable: toolbar
+ *
+ * Holds a for displaying the toolbar. The
+ * toolbar is created in .
+ */
+mxEditor.prototype.toolbar = null;
+
+/**
+ * Variable: status
+ *
+ * DOM container that holds the statusbar. Default is null.
+ * Use to set this value.
+ */
+mxEditor.prototype.status = null;
+
+/**
+ * Variable: popupHandler
+ *
+ * Holds a for displaying
+ * popupmenus.
+ */
+mxEditor.prototype.popupHandler = null;
+
+/**
+ * Variable: undoManager
+ *
+ * Holds an for the command history.
+ */
+mxEditor.prototype.undoManager = null;
+
+/**
+ * Variable: keyHandler
+ *
+ * Holds a for handling keyboard events.
+ * The handler is created in .
+ */
+mxEditor.prototype.keyHandler = null;
+
+/**
+ * Group: Actions and Options
+ */
+
+/**
+ * Variable: actions
+ *
+ * Maps from actionnames to actions, which are functions taking
+ * the editor and the cell as arguments. Use
+ * to add or replace an action and to execute an action
+ * by name, passing the cell to be operated upon as the second
+ * argument.
+ */
+mxEditor.prototype.actions = null;
+
+/**
+ * Variable: dblClickAction
+ *
+ * Specifies the name of the action to be executed
+ * when a cell is double clicked. Default is edit.
+ *
+ * To handle a singleclick, use the following code.
+ *
+ * (code)
+ * editor.graph.addListener(mxEvent.CLICK, function(sender, evt)
+ * {
+ * var e = evt.getProperty('event');
+ * var cell = evt.getProperty('cell');
+ *
+ * if (cell != null && !e.isConsumed())
+ * {
+ * // Do something useful with cell...
+ * e.consume();
+ * }
+ * });
+ * (end)
+ */
+mxEditor.prototype.dblClickAction = 'edit';
+
+/**
+ * Variable: swimlaneRequired
+ *
+ * Specifies if new cells must be inserted
+ * into an existing swimlane. Otherwise, cells
+ * that are not swimlanes can be inserted as
+ * top-level cells. Default is false.
+ */
+mxEditor.prototype.swimlaneRequired = false;
+
+/**
+ * Variable: disableContextMenu
+ *
+ * Specifies if the context menu should be disabled in the graph container.
+ * Default is true.
+ */
+mxEditor.prototype.disableContextMenu = true;
+
+/**
+ * Group: Templates
+ */
+
+/**
+ * Variable: insertFunction
+ *
+ * Specifies the function to be used for inserting new
+ * cells into the graph. This is assigned from the
+ * if a vertex-tool is clicked.
+ */
+mxEditor.prototype.insertFunction = null;
+
+/**
+ * Variable: forcedInserting
+ *
+ * Specifies if a new cell should be inserted on a single
+ * click even using if there is a cell
+ * under the mousepointer, otherwise the cell under the
+ * mousepointer is selected. Default is false.
+ */
+mxEditor.prototype.forcedInserting = false;
+
+/**
+ * Variable: templates
+ *
+ * Maps from names to protoype cells to be used
+ * in the toolbar for inserting new cells into
+ * the diagram.
+ */
+mxEditor.prototype.templates = null;
+
+/**
+ * Variable: defaultEdge
+ *
+ * Prototype edge cell that is used for creating
+ * new edges.
+ */
+mxEditor.prototype.defaultEdge = null;
+
+/**
+ * Variable: defaultEdgeStyle
+ *
+ * Specifies the edge style to be returned in .
+ * Default is null.
+ */
+mxEditor.prototype.defaultEdgeStyle = null;
+
+/**
+ * Variable: defaultGroup
+ *
+ * Prototype group cell that is used for creating
+ * new groups.
+ */
+mxEditor.prototype.defaultGroup = null;
+
+/**
+ * Variable: groupBorderSize
+ *
+ * Default size for the border of new groups. If null,
+ * then then is used. Default is
+ * null.
+ */
+mxEditor.prototype.groupBorderSize = null;
+
+/**
+ * Group: Backend Integration
+ */
+
+/**
+ * Variable: filename
+ *
+ * Contains the URL of the last opened file as a string.
+ * Default is null.
+ */
+mxEditor.prototype.filename = null;
+
+/**
+ * Variable: lineFeed
+ *
+ * Character to be used for encoding linefeeds in . Default is '
'.
+ */
+mxEditor.prototype.linefeed = '
';
+
+/**
+ * Variable: postParameterName
+ *
+ * Specifies if the name of the post parameter that contains the diagram
+ * data in a post request to the server. Default is xml.
+ */
+mxEditor.prototype.postParameterName = 'xml';
+
+/**
+ * Variable: escapePostData
+ *
+ * Specifies if the data in the post request for saving a diagram
+ * should be converted using encodeURIComponent. Default is true.
+ */
+mxEditor.prototype.escapePostData = true;
+
+/**
+ * Variable: urlPost
+ *
+ * Specifies the URL to be used for posting the diagram
+ * to a backend in .
+ */
+mxEditor.prototype.urlPost = null;
+
+/**
+ * Variable: urlImage
+ *
+ * Specifies the URL to be used for creating a bitmap of
+ * the graph in the image action.
+ */
+mxEditor.prototype.urlImage = null;
+
+/**
+ * Group: Autolayout
+ */
+
+/**
+ * Variable: horizontalFlow
+ *
+ * Specifies the direction of the flow
+ * in the diagram. This is used in the
+ * layout algorithms. Default is false,
+ * ie. vertical flow.
+ */
+mxEditor.prototype.horizontalFlow = false;
+
+/**
+ * Variable: layoutDiagram
+ *
+ * Specifies if the top-level elements in the
+ * diagram should be layed out using a vertical
+ * or horizontal stack depending on the setting
+ * of . The spacing between the
+ * swimlanes is specified by .
+ * Default is false.
+ *
+ * If the top-level elements are swimlanes, then
+ * the intra-swimlane layout is activated by
+ * the switch.
+ */
+mxEditor.prototype.layoutDiagram = false;
+
+/**
+ * Variable: swimlaneSpacing
+ *
+ * Specifies the spacing between swimlanes if
+ * automatic layout is turned on in
+ * . Default is 0.
+ */
+mxEditor.prototype.swimlaneSpacing = 0;
+
+/**
+ * Variable: maintainSwimlanes
+ *
+ * Specifies if the swimlanes should be kept at the same
+ * width or height depending on the setting of
+ * . Default is false.
+ *
+ * For horizontal flows, all swimlanes
+ * have the same height and for vertical flows, all swimlanes
+ * have the same width. Furthermore, the swimlanes are
+ * automatically "stacked" if is true.
+ */
+mxEditor.prototype.maintainSwimlanes = false;
+
+/**
+ * Variable: layoutSwimlanes
+ *
+ * Specifies if the children of swimlanes should
+ * be layed out, either vertically or horizontally
+ * depending on .
+ * Default is false.
+ */
+mxEditor.prototype.layoutSwimlanes = false;
+
+/**
+ * Group: Attribute Cycling
+ */
+
+/**
+ * Variable: cycleAttributeValues
+ *
+ * Specifies the attribute values to be cycled when
+ * inserting new swimlanes. Default is an empty
+ * array.
+ */
+mxEditor.prototype.cycleAttributeValues = null;
+
+/**
+ * Variable: cycleAttributeIndex
+ *
+ * Index of the last consumed attribute index. If a new
+ * swimlane is inserted, then the
+ * at this index will be used as the value for
+ * . Default is 0.
+ */
+mxEditor.prototype.cycleAttributeIndex = 0;
+
+/**
+ * Variable: cycleAttributeName
+ *
+ * Name of the attribute to be assigned a
+ * when inserting new swimlanes. Default is fillColor.
+ */
+mxEditor.prototype.cycleAttributeName = 'fillColor';
+
+/**
+ * Group: Windows
+ */
+
+/**
+ * Variable: tasks
+ *
+ * Holds the created in .
+ */
+mxEditor.prototype.tasks = null;
+
+/**
+ * Variable: tasksWindowImage
+ *
+ * Icon for the tasks window.
+ */
+mxEditor.prototype.tasksWindowImage = null;
+
+/**
+ * Variable: tasksTop
+ *
+ * Specifies the top coordinate of the tasks window in pixels.
+ * Default is 20.
+ */
+mxEditor.prototype.tasksTop = 20;
+
+/**
+ * Variable: help
+ *
+ * Holds the created in .
+ */
+mxEditor.prototype.help = null;
+
+/**
+ * Variable: helpWindowImage
+ *
+ * Icon for the help window.
+ */
+mxEditor.prototype.helpWindowImage = null;
+
+/**
+ * Variable: urlHelp
+ *
+ * Specifies the URL to be used for the contents of the
+ * Online Help window. This is usually specified in the
+ * resources file under urlHelp for language-specific
+ * online help support.
+ */
+mxEditor.prototype.urlHelp = null;
+
+/**
+ * Variable: helpWidth
+ *
+ * Specifies the width of the help window in pixels.
+ * Default is 300.
+ */
+mxEditor.prototype.helpWidth = 300;
+
+/**
+ * Variable: helpHeight
+ *
+ * Specifies the height of the help window in pixels.
+ * Default is 260.
+ */
+mxEditor.prototype.helpHeight = 260;
+
+/**
+ * Variable: propertiesWidth
+ *
+ * Specifies the width of the properties window in pixels.
+ * Default is 240.
+ */
+mxEditor.prototype.propertiesWidth = 240;
+
+/**
+ * Variable: propertiesHeight
+ *
+ * Specifies the height of the properties window in pixels.
+ * If no height is specified then the window will be automatically
+ * sized to fit its contents. Default is null.
+ */
+mxEditor.prototype.propertiesHeight = null;
+
+/**
+ * Variable: movePropertiesDialog
+ *
+ * Specifies if the properties dialog should be automatically
+ * moved near the cell it is displayed for, otherwise the
+ * dialog is not moved. This value is only taken into
+ * account if the dialog is already visible. Default is false.
+ */
+mxEditor.prototype.movePropertiesDialog = false;
+
+/**
+ * Variable: validating
+ *
+ * Specifies if should automatically be invoked after
+ * each change. Default is false.
+ */
+mxEditor.prototype.validating = false;
+
+/**
+ * Variable: modified
+ *
+ * True if the graph has been modified since it was last saved.
+ */
+mxEditor.prototype.modified = false;
+
+/**
+ * Function: isModified
+ *
+ * Returns .
+ */
+mxEditor.prototype.isModified = function ()
+{
+ return this.modified;
+};
+
+/**
+ * Function: setModified
+ *
+ * Sets to the specified boolean value.
+ */
+mxEditor.prototype.setModified = function (value)
+{
+ this.modified = value;
+};
+
+/**
+ * Function: addActions
+ *
+ * Adds the built-in actions to the editor instance.
+ *
+ * save - Saves the graph using .
+ * print - Shows the graph in a new print preview window.
+ * show - Shows the graph in a new window.
+ * exportImage - Shows the graph as a bitmap image using .
+ * refresh - Refreshes the graph's display.
+ * cut - Copies the current selection into the clipboard
+ * and removes it from the graph.
+ * copy - Copies the current selection into the clipboard.
+ * paste - Pastes the clipboard into the graph.
+ * delete - Removes the current selection from the graph.
+ * group - Puts the current selection into a new group.
+ * ungroup - Removes the selected groups and selects the children.
+ * undo - Undoes the last change on the graph model.
+ * redo - Redoes the last change on the graph model.
+ * zoom - Sets the zoom via a dialog.
+ * zoomIn - Zooms into the graph.
+ * zoomOut - Zooms out of the graph
+ * actualSize - Resets the scale and translation on the graph.
+ * fit - Changes the scale so that the graph fits into the window.
+ * showProperties - Shows the properties dialog.
+ * selectAll - Selects all cells.
+ * selectNone - Clears the selection.
+ * selectVertices - Selects all vertices.
+ * selectEdges = Selects all edges.
+ * edit - Starts editing the current selection cell.
+ * enterGroup - Drills down into the current selection cell.
+ * exitGroup - Moves up in the drilling hierachy
+ * home - Moves to the topmost parent in the drilling hierarchy
+ * selectPrevious - Selects the previous cell.
+ * selectNext - Selects the next cell.
+ * selectParent - Selects the parent of the selection cell.
+ * selectChild - Selects the first child of the selection cell.
+ * collapse - Collapses the currently selected cells.
+ * expand - Expands the currently selected cells.
+ * bold - Toggle bold text style.
+ * italic - Toggle italic text style.
+ * underline - Toggle underline text style.
+ * alignCellsLeft - Aligns the selection cells at the left.
+ * alignCellsCenter - Aligns the selection cells in the center.
+ * alignCellsRight - Aligns the selection cells at the right.
+ * alignCellsTop - Aligns the selection cells at the top.
+ * alignCellsMiddle - Aligns the selection cells in the middle.
+ * alignCellsBottom - Aligns the selection cells at the bottom.
+ * alignFontLeft - Sets the horizontal text alignment to left.
+ * alignFontCenter - Sets the horizontal text alignment to center.
+ * alignFontRight - Sets the horizontal text alignment to right.
+ * alignFontTop - Sets the vertical text alignment to top.
+ * alignFontMiddle - Sets the vertical text alignment to middle.
+ * alignFontBottom - Sets the vertical text alignment to bottom.
+ * toggleTasks - Shows or hides the tasks window.
+ * toggleHelp - Shows or hides the help window.
+ * toggleOutline - Shows or hides the outline window.
+ * toggleConsole - Shows or hides the console window.
+ */
+mxEditor.prototype.addActions = function ()
+{
+ this.addAction('save', function(editor)
+ {
+ editor.save();
+ });
+
+ this.addAction('print', function(editor)
+ {
+ var preview = new mxPrintPreview(editor.graph, 1);
+ preview.open();
+ });
+
+ this.addAction('show', function(editor)
+ {
+ mxUtils.show(editor.graph, null, 10, 10);
+ });
+
+ this.addAction('exportImage', function(editor)
+ {
+ var url = editor.getUrlImage();
+
+ if (url == null || mxClient.IS_LOCAL)
+ {
+ editor.execute('show');
+ }
+ else
+ {
+ var node = mxUtils.getViewXml(editor.graph, 1);
+ var xml = mxUtils.getXml(node, '\n');
+
+ mxUtils.submit(url, editor.postParameterName + '=' +
+ encodeURIComponent(xml), document, '_blank');
+ }
+ });
+
+ this.addAction('refresh', function(editor)
+ {
+ editor.graph.refresh();
+ });
+
+ this.addAction('cut', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ mxClipboard.cut(editor.graph);
+ }
+ });
+
+ this.addAction('copy', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ mxClipboard.copy(editor.graph);
+ }
+ });
+
+ this.addAction('paste', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ mxClipboard.paste(editor.graph);
+ }
+ });
+
+ this.addAction('delete', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.removeCells();
+ }
+ });
+
+ this.addAction('group', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setSelectionCell(editor.groupCells());
+ }
+ });
+
+ this.addAction('ungroup', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setSelectionCells(editor.graph.ungroupCells());
+ }
+ });
+
+ this.addAction('removeFromParent', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.removeCellsFromParent();
+ }
+ });
+
+ this.addAction('undo', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.undo();
+ }
+ });
+
+ this.addAction('redo', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.redo();
+ }
+ });
+
+ this.addAction('zoomIn', function(editor)
+ {
+ editor.graph.zoomIn();
+ });
+
+ this.addAction('zoomOut', function(editor)
+ {
+ editor.graph.zoomOut();
+ });
+
+ this.addAction('actualSize', function(editor)
+ {
+ editor.graph.zoomActual();
+ });
+
+ this.addAction('fit', function(editor)
+ {
+ editor.graph.fit();
+ });
+
+ this.addAction('showProperties', function(editor, cell)
+ {
+ editor.showProperties(cell);
+ });
+
+ this.addAction('selectAll', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectAll();
+ }
+ });
+
+ this.addAction('selectNone', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.clearSelection();
+ }
+ });
+
+ this.addAction('selectVertices', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectVertices();
+ }
+ });
+
+ this.addAction('selectEdges', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectEdges();
+ }
+ });
+
+ this.addAction('edit', function(editor, cell)
+ {
+ if (editor.graph.isEnabled() &&
+ editor.graph.isCellEditable(cell))
+ {
+ editor.graph.startEditingAtCell(cell);
+ }
+ });
+
+ this.addAction('toBack', function(editor, cell)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.orderCells(true);
+ }
+ });
+
+ this.addAction('toFront', function(editor, cell)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.orderCells(false);
+ }
+ });
+
+ this.addAction('enterGroup', function(editor, cell)
+ {
+ editor.graph.enterGroup(cell);
+ });
+
+ this.addAction('exitGroup', function(editor)
+ {
+ editor.graph.exitGroup();
+ });
+
+ this.addAction('home', function(editor)
+ {
+ editor.graph.home();
+ });
+
+ this.addAction('selectPrevious', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectPreviousCell();
+ }
+ });
+
+ this.addAction('selectNext', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectNextCell();
+ }
+ });
+
+ this.addAction('selectParent', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectParentCell();
+ }
+ });
+
+ this.addAction('selectChild', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.selectChildCell();
+ }
+ });
+
+ this.addAction('collapse', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.foldCells(true);
+ }
+ });
+
+ this.addAction('collapseAll', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ var cells = editor.graph.getChildVertices();
+ editor.graph.foldCells(true, false, cells);
+ }
+ });
+
+ this.addAction('expand', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.foldCells(false);
+ }
+ });
+
+ this.addAction('expandAll', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ var cells = editor.graph.getChildVertices();
+ editor.graph.foldCells(false, false, cells);
+ }
+ });
+
+ this.addAction('bold', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.toggleCellStyleFlags(
+ mxConstants.STYLE_FONTSTYLE,
+ mxConstants.FONT_BOLD);
+ }
+ });
+
+ this.addAction('italic', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.toggleCellStyleFlags(
+ mxConstants.STYLE_FONTSTYLE,
+ mxConstants.FONT_ITALIC);
+ }
+ });
+
+ this.addAction('underline', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.toggleCellStyleFlags(
+ mxConstants.STYLE_FONTSTYLE,
+ mxConstants.FONT_UNDERLINE);
+ }
+ });
+
+ this.addAction('alignCellsLeft', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_LEFT);
+ }
+ });
+
+ this.addAction('alignCellsCenter', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_CENTER);
+ }
+ });
+
+ this.addAction('alignCellsRight', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_RIGHT);
+ }
+ });
+
+ this.addAction('alignCellsTop', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_TOP);
+ }
+ });
+
+ this.addAction('alignCellsMiddle', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_MIDDLE);
+ }
+ });
+
+ this.addAction('alignCellsBottom', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.alignCells(mxConstants.ALIGN_BOTTOM);
+ }
+ });
+
+ this.addAction('alignFontLeft', function(editor)
+ {
+
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_ALIGN,
+ mxConstants.ALIGN_LEFT);
+ });
+
+ this.addAction('alignFontCenter', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_ALIGN,
+ mxConstants.ALIGN_CENTER);
+ }
+ });
+
+ this.addAction('alignFontRight', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_ALIGN,
+ mxConstants.ALIGN_RIGHT);
+ }
+ });
+
+ this.addAction('alignFontTop', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_VERTICAL_ALIGN,
+ mxConstants.ALIGN_TOP);
+ }
+ });
+
+ this.addAction('alignFontMiddle', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_VERTICAL_ALIGN,
+ mxConstants.ALIGN_MIDDLE);
+ }
+ });
+
+ this.addAction('alignFontBottom', function(editor)
+ {
+ if (editor.graph.isEnabled())
+ {
+ editor.graph.setCellStyles(
+ mxConstants.STYLE_VERTICAL_ALIGN,
+ mxConstants.ALIGN_BOTTOM);
+ }
+ });
+
+ this.addAction('zoom', function(editor)
+ {
+ var current = editor.graph.getView().scale*100;
+ var scale = parseFloat(mxUtils.prompt(
+ mxResources.get(editor.askZoomResource) ||
+ editor.askZoomResource,
+ current))/100;
+
+ if (!isNaN(scale))
+ {
+ editor.graph.getView().setScale(scale);
+ }
+ });
+
+ this.addAction('toggleTasks', function(editor)
+ {
+ if (editor.tasks != null)
+ {
+ editor.tasks.setVisible(!editor.tasks.isVisible());
+ }
+ else
+ {
+ editor.showTasks();
+ }
+ });
+
+ this.addAction('toggleHelp', function(editor)
+ {
+ if (editor.help != null)
+ {
+ editor.help.setVisible(!editor.help.isVisible());
+ }
+ else
+ {
+ editor.showHelp();
+ }
+ });
+
+ this.addAction('toggleOutline', function(editor)
+ {
+ if (editor.outline == null)
+ {
+ editor.showOutline();
+ }
+ else
+ {
+ editor.outline.setVisible(!editor.outline.isVisible());
+ }
+ });
+
+ this.addAction('toggleConsole', function(editor)
+ {
+ mxLog.setVisible(!mxLog.isVisible());
+ });
+};
+
+/**
+ * Function: configure
+ *
+ * Configures the editor using the specified node. To load the
+ * configuration from a given URL the following code can be used to obtain
+ * the XML node.
+ *
+ * (code)
+ * var node = mxUtils.load(url).getDocumentElement();
+ * (end)
+ *
+ * Parameters:
+ *
+ * node - XML node that contains the configuration.
+ */
+mxEditor.prototype.configure = function (node)
+{
+ if (node != null)
+ {
+ // Creates a decoder for the XML data
+ // and uses it to configure the editor
+ var dec = new mxCodec(node.ownerDocument);
+ dec.decode(node, this);
+
+ // Resets the counters, modified state and
+ // command history
+ this.resetHistory();
+ }
+};
+
+/**
+ * Function: resetFirstTime
+ *
+ * Resets the cookie that is used to remember if the editor has already
+ * been used.
+ */
+mxEditor.prototype.resetFirstTime = function ()
+{
+ document.cookie =
+ 'mxgraph=seen; expires=Fri, 27 Jul 2001 02:47:11 UTC; path=/';
+};
+
+/**
+ * Function: resetHistory
+ *
+ * Resets the command history, modified state and counters.
+ */
+mxEditor.prototype.resetHistory = function ()
+{
+ this.lastSnapshot = new Date().getTime();
+ this.undoManager.clear();
+ this.ignoredChanges = 0;
+ this.setModified(false);
+};
+
+/**
+ * Function: addAction
+ *
+ * Binds the specified actionname to the specified function.
+ *
+ * Parameters:
+ *
+ * actionname - String that specifies the name of the action
+ * to be added.
+ * funct - Function that implements the new action. The first
+ * argument of the function is the editor it is used
+ * with, the second argument is the cell it operates
+ * upon.
+ *
+ * Example:
+ * (code)
+ * editor.addAction('test', function(editor, cell)
+ * {
+ * mxUtils.alert("test "+cell);
+ * });
+ * (end)
+ */
+mxEditor.prototype.addAction = function (actionname, funct)
+{
+ this.actions[actionname] = funct;
+};
+
+/**
+ * Function: execute
+ *
+ * Executes the function with the given name in passing the
+ * editor instance and given cell as the first and second argument. All
+ * additional arguments are passed to the action as well. This method
+ * contains a try-catch block and displays an error message if an action
+ * causes an exception. The exception is re-thrown after the error
+ * message was displayed.
+ *
+ * Example:
+ *
+ * (code)
+ * editor.execute("showProperties", cell);
+ * (end)
+ */
+mxEditor.prototype.execute = function (actionname, cell, evt)
+{
+ var action = this.actions[actionname];
+
+ if (action != null)
+ {
+ try
+ {
+ // Creates the array of arguments by replacing the actionname
+ // with the editor instance in the args of this function
+ var args = arguments;
+ args[0] = this;
+
+ // Invokes the function on the editor using the args
+ action.apply(this, args);
+ }
+ catch (e)
+ {
+ mxUtils.error('Cannot execute ' + actionname +
+ ': ' + e.message, 280, true);
+
+ throw e;
+ }
+ }
+ else
+ {
+ mxUtils.error('Cannot find action '+actionname, 280, true);
+ }
+};
+
+/**
+ * Function: addTemplate
+ *
+ * Adds the specified template under the given name in .
+ */
+mxEditor.prototype.addTemplate = function (name, template)
+{
+ this.templates[name] = template;
+};
+
+/**
+ * Function: getTemplate
+ *
+ * Returns the template for the given name.
+ */
+mxEditor.prototype.getTemplate = function (name)
+{
+ return this.templates[name];
+};
+
+/**
+ * Function: createGraph
+ *
+ * Creates the for the editor. The graph is created with no
+ * container and is initialized from .
+ */
+mxEditor.prototype.createGraph = function ()
+{
+ var graph = new mxGraph(null, null, this.graphRenderHint);
+
+ // Enables rubberband, tooltips, panning
+ graph.setTooltips(true);
+ graph.setPanning(true);
+
+ // Overrides the dblclick method on the graph to
+ // invoke the dblClickAction for a cell and reset
+ // the selection tool in the toolbar
+ this.installDblClickHandler(graph);
+
+ // Installs the command history
+ this.installUndoHandler(graph);
+
+ // Installs the handlers for the root event
+ this.installDrillHandler(graph);
+
+ // Installs the handler for validation
+ this.installChangeHandler(graph);
+
+ // Installs the handler for calling the
+ // insert function and consume the
+ // event if an insert function is defined
+ this.installInsertHandler(graph);
+
+ // Redirects the function for creating the
+ // popupmenu items
+ graph.popupMenuHandler.factoryMethod =
+ mxUtils.bind(this, function(menu, cell, evt)
+ {
+ return this.createPopupMenu(menu, cell, evt);
+ });
+
+ // Redirects the function for creating
+ // new connections in the diagram
+ graph.connectionHandler.factoryMethod =
+ mxUtils.bind(this, function(source, target)
+ {
+ return this.createEdge(source, target);
+ });
+
+ // Maintains swimlanes and installs autolayout
+ this.createSwimlaneManager(graph);
+ this.createLayoutManager(graph);
+
+ return graph;
+};
+
+/**
+ * Function: createSwimlaneManager
+ *
+ * Sets the graph's container using .
+ */
+mxEditor.prototype.createSwimlaneManager = function (graph)
+{
+ var swimlaneMgr = new mxSwimlaneManager(graph, false);
+
+ swimlaneMgr.isHorizontal = mxUtils.bind(this, function()
+ {
+ return this.horizontalFlow;
+ });
+
+ swimlaneMgr.isEnabled = mxUtils.bind(this, function()
+ {
+ return this.maintainSwimlanes;
+ });
+
+ return swimlaneMgr;
+};
+
+/**
+ * Function: createLayoutManager
+ *
+ * Creates a layout manager for the swimlane and diagram layouts, that
+ * is, the locally defined inter- and intraswimlane layouts.
+ */
+mxEditor.prototype.createLayoutManager = function (graph)
+{
+ var layoutMgr = new mxLayoutManager(graph);
+
+ var self = this; // closure
+ layoutMgr.getLayout = function(cell)
+ {
+ var layout = null;
+ var model = self.graph.getModel();
+
+ if (model.getParent(cell) != null)
+ {
+ // Executes the swimlane layout if a child of
+ // a swimlane has been changed. The layout is
+ // lazy created in createSwimlaneLayout.
+ if (self.layoutSwimlanes &&
+ graph.isSwimlane(cell))
+ {
+ if (self.swimlaneLayout == null)
+ {
+ self.swimlaneLayout = self.createSwimlaneLayout();
+ }
+
+ layout = self.swimlaneLayout;
+ }
+
+ // Executes the diagram layout if the modified
+ // cell is a top-level cell. The layout is
+ // lazy created in createDiagramLayout.
+ else if (self.layoutDiagram &&
+ (graph.isValidRoot(cell) ||
+ model.getParent(model.getParent(cell)) == null))
+ {
+ if (self.diagramLayout == null)
+ {
+ self.diagramLayout = self.createDiagramLayout();
+ }
+
+ layout = self.diagramLayout;
+ }
+ }
+
+ return layout;
+ };
+
+ return layoutMgr;
+};
+
+/**
+ * Function: setGraphContainer
+ *
+ * Sets the graph's container using .
+ */
+mxEditor.prototype.setGraphContainer = function (container)
+{
+ if (this.graph.container == null)
+ {
+ // Creates the graph instance inside the given container and render hint
+ //this.graph = new mxGraph(container, null, this.graphRenderHint);
+ this.graph.init(container);
+
+ // Install rubberband selection as the last
+ // action handler in the chain
+ this.rubberband = new mxRubberband(this.graph);
+
+ // Disables the context menu
+ if (this.disableContextMenu)
+ {
+ mxEvent.disableContextMenu(container);
+ }
+
+ // Workaround for stylesheet directives in IE
+ if (mxClient.IS_QUIRKS)
+ {
+ new mxDivResizer(container);
+ }
+ }
+};
+
+/**
+ * Function: installDblClickHandler
+ *
+ * Overrides to invoke
+ * on a cell and reset the selection tool in the toolbar.
+ */
+mxEditor.prototype.installDblClickHandler = function (graph)
+{
+ // Installs a listener for double click events
+ graph.addListener(mxEvent.DOUBLE_CLICK,
+ mxUtils.bind(this, function(sender, evt)
+ {
+ var cell = evt.getProperty('cell');
+
+ if (cell != null &&
+ graph.isEnabled() &&
+ this.dblClickAction != null)
+ {
+ this.execute(this.dblClickAction, cell);
+ evt.consume();
+ }
+ })
+ );
+};
+
+/**
+ * Function: installUndoHandler
+ *
+ * Adds the to the graph model and the view.
+ */
+mxEditor.prototype.installUndoHandler = function (graph)
+{
+ var listener = mxUtils.bind(this, function(sender, evt)
+ {
+ var edit = evt.getProperty('edit');
+ this.undoManager.undoableEditHappened(edit);
+ });
+
+ graph.getModel().addListener(mxEvent.UNDO, listener);
+ graph.getView().addListener(mxEvent.UNDO, listener);
+
+ // Keeps the selection state in sync
+ var undoHandler = function(sender, evt)
+ {
+ var changes = evt.getProperty('edit').changes;
+ graph.setSelectionCells(graph.getSelectionCellsForChanges(changes));
+ };
+
+ this.undoManager.addListener(mxEvent.UNDO, undoHandler);
+ this.undoManager.addListener(mxEvent.REDO, undoHandler);
+};
+
+/**
+ * Function: installDrillHandler
+ *
+ * Installs listeners for dispatching the event.
+ */
+mxEditor.prototype.installDrillHandler = function (graph)
+{
+ var listener = mxUtils.bind(this, function(sender)
+ {
+ this.fireEvent(new mxEventObject(mxEvent.ROOT));
+ });
+
+ graph.getView().addListener(mxEvent.DOWN, listener);
+ graph.getView().addListener(mxEvent.UP, listener);
+};
+
+/**
+ * Function: installChangeHandler
+ *
+ * Installs the listeners required to automatically validate
+ * the graph. On each change of the root, this implementation
+ * fires a event.
+ */
+mxEditor.prototype.installChangeHandler = function (graph)
+{
+ var listener = mxUtils.bind(this, function(sender, evt)
+ {
+ // Updates the modified state
+ this.setModified(true);
+
+ // Automatically validates the graph
+ // after each change
+ if (this.validating == true)
+ {
+ graph.validateGraph();
+ }
+
+ // Checks if the root has been changed
+ var changes = evt.getProperty('edit').changes;
+
+ for (var i = 0; i < changes.length; i++)
+ {
+ var change = changes[i];
+
+ if (change instanceof mxRootChange ||
+ (change instanceof mxValueChange &&
+ change.cell == this.graph.model.root) ||
+ (change instanceof mxCellAttributeChange &&
+ change.cell == this.graph.model.root))
+ {
+ this.fireEvent(new mxEventObject(mxEvent.ROOT));
+ break;
+ }
+ }
+ });
+
+ graph.getModel().addListener(mxEvent.CHANGE, listener);
+};
+
+/**
+ * Function: installInsertHandler
+ *
+ * Installs the handler for invoking if
+ * one is defined.
+ */
+mxEditor.prototype.installInsertHandler = function (graph)
+{
+ var self = this; // closure
+ var insertHandler =
+ {
+ mouseDown: function(sender, me)
+ {
+ if (self.insertFunction != null &&
+ !me.isPopupTrigger() &&
+ (self.forcedInserting ||
+ me.getState() == null))
+ {
+ self.graph.clearSelection();
+ self.insertFunction(me.getEvent(), me.getCell());
+
+ // Consumes the rest of the events
+ // for this gesture (down, move, up)
+ this.isActive = true;
+ me.consume();
+ }
+ },
+
+ mouseMove: function(sender, me)
+ {
+ if (this.isActive)
+ {
+ me.consume();
+ }
+ },
+
+ mouseUp: function(sender, me)
+ {
+ if (this.isActive)
+ {
+ this.isActive = false;
+ me.consume();
+ }
+ }
+ };
+
+ graph.addMouseListener(insertHandler);
+};
+
+/**
+ * Function: createDiagramLayout
+ *
+ * Creates the layout instance used to layout the
+ * swimlanes in the diagram.
+ */
+mxEditor.prototype.createDiagramLayout = function ()
+{
+ var gs = this.graph.gridSize;
+ var layout = new mxStackLayout(this.graph, !this.horizontalFlow,
+ this.swimlaneSpacing, 2*gs, 2*gs);
+
+ // Overrides isIgnored to only take into account swimlanes
+ layout.isVertexIgnored = function(cell)
+ {
+ return !layout.graph.isSwimlane(cell);
+ };
+
+ return layout;
+};
+
+/**
+ * Function: createSwimlaneLayout
+ *
+ * Creates the layout instance used to layout the
+ * children of each swimlane.
+ */
+mxEditor.prototype.createSwimlaneLayout = function ()
+{
+ return new mxCompactTreeLayout(this.graph, this.horizontalFlow);
+};
+
+/**
+ * Function: createToolbar
+ *
+ * Creates the with no container.
+ */
+mxEditor.prototype.createToolbar = function ()
+{
+ return new mxDefaultToolbar(null, this);
+};
+
+/**
+ * Function: setToolbarContainer
+ *
+ * Initializes the toolbar for the given container.
+ */
+mxEditor.prototype.setToolbarContainer = function (container)
+{
+ this.toolbar.init(container);
+
+ // Workaround for stylesheet directives in IE
+ if (mxClient.IS_QUIRKS)
+ {
+ new mxDivResizer(container);
+ }
+};
+
+/**
+ * Function: setStatusContainer
+ *
+ * Creates the using the specified container.
+ *
+ * This implementation adds listeners in the editor to
+ * display the last saved time and the current filename
+ * in the status bar.
+ *
+ * Parameters:
+ *
+ * container - DOM node that will contain the statusbar.
+ */
+mxEditor.prototype.setStatusContainer = function (container)
+{
+ if (this.status == null)
+ {
+ this.status = container;
+
+ // Prints the last saved time in the status bar
+ // when files are saved
+ this.addListener(mxEvent.SAVE, mxUtils.bind(this, function()
+ {
+ var tstamp = new Date().toLocaleString();
+ this.setStatus((mxResources.get(this.lastSavedResource) ||
+ this.lastSavedResource)+': '+tstamp);
+ }));
+
+ // Updates the statusbar to display the filename
+ // when new files are opened
+ this.addListener(mxEvent.OPEN, mxUtils.bind(this, function()
+ {
+ this.setStatus((mxResources.get(this.currentFileResource) ||
+ this.currentFileResource)+': '+this.filename);
+ }));
+
+ // Workaround for stylesheet directives in IE
+ if (mxClient.IS_QUIRKS)
+ {
+ new mxDivResizer(container);
+ }
+ }
+};
+
+/**
+ * Function: setStatus
+ *
+ * Display the specified message in the status bar.
+ *
+ * Parameters:
+ *
+ * message - String the specified the message to
+ * be displayed.
+ */
+mxEditor.prototype.setStatus = function (message)
+{
+ if (this.status != null && message != null)
+ {
+ this.status.innerHTML = message;
+ }
+};
+
+/**
+ * Function: setTitleContainer
+ *
+ * Creates a listener to update the inner HTML of the
+ * specified DOM node with the value of .
+ *
+ * Parameters:
+ *
+ * container - DOM node that will contain the title.
+ */
+mxEditor.prototype.setTitleContainer = function (container)
+{
+ this.addListener(mxEvent.ROOT, mxUtils.bind(this, function(sender)
+ {
+ container.innerHTML = this.getTitle();
+ }));
+
+ // Workaround for stylesheet directives in IE
+ if (mxClient.IS_QUIRKS)
+ {
+ new mxDivResizer(container);
+ }
+};
+
+/**
+ * Function: treeLayout
+ *
+ * Executes a vertical or horizontal compact tree layout
+ * using the specified cell as an argument. The cell may
+ * either be a group or the root of a tree.
+ *
+ * Parameters:
+ *
+ * cell - to use in the compact tree layout.
+ * horizontal - Optional boolean to specify the tree's
+ * orientation. Default is true.
+ */
+mxEditor.prototype.treeLayout = function (cell, horizontal)
+{
+ if (cell != null)
+ {
+ var layout = new mxCompactTreeLayout(this.graph, horizontal);
+ layout.execute(cell);
+ }
+};
+
+/**
+ * Function: getTitle
+ *
+ * Returns the string value for the current root of the
+ * diagram.
+ */
+mxEditor.prototype.getTitle = function ()
+{
+ var title = '';
+ var graph = this.graph;
+ var cell = graph.getCurrentRoot();
+
+ while (cell != null &&
+ graph.getModel().getParent(
+ graph.getModel().getParent(cell)) != null)
+ {
+ // Append each label of a valid root
+ if (graph.isValidRoot(cell))
+ {
+ title = ' > ' +
+ graph.convertValueToString(cell) + title;
+ }
+
+ cell = graph.getModel().getParent(cell);
+ }
+
+ var prefix = this.getRootTitle();
+
+ return prefix + title;
+};
+
+/**
+ * Function: getRootTitle
+ *
+ * Returns the string value of the root cell in
+ * .
+ */
+mxEditor.prototype.getRootTitle = function ()
+{
+ var root = this.graph.getModel().getRoot();
+ return this.graph.convertValueToString(root);
+};
+
+/**
+ * Function: undo
+ *
+ * Undo the last change in .
+ */
+mxEditor.prototype.undo = function ()
+{
+ this.undoManager.undo();
+};
+
+/**
+ * Function: redo
+ *
+ * Redo the last change in .
+ */
+mxEditor.prototype.redo = function ()
+{
+ this.undoManager.redo();
+};
+
+/**
+ * Function: groupCells
+ *
+ * Invokes to create a new group cell and the invokes
+ * , using the grid size of the graph as the spacing
+ * in the group's content area.
+ */
+mxEditor.prototype.groupCells = function ()
+{
+ var border = (this.groupBorderSize != null) ?
+ this.groupBorderSize :
+ this.graph.gridSize;
+ return this.graph.groupCells(this.createGroup(), border);
+};
+
+/**
+ * Function: createGroup
+ *
+ * Creates and returns a clone of to be used
+ * as a new group cell in .
+ */
+mxEditor.prototype.createGroup = function ()
+{
+ var model = this.graph.getModel();
+
+ return model.cloneCell(this.defaultGroup);
+};
+
+/**
+ * Function: open
+ *
+ * Opens the specified file synchronously and parses it using
+ * . It updates and fires an -event after
+ * the file has been opened. Exceptions should be handled as follows:
+ *
+ * (code)
+ * try
+ * {
+ * editor.open(filename);
+ * }
+ * catch (e)
+ * {
+ * mxUtils.error('Cannot open ' + filename +
+ * ': ' + e.message, 280, true);
+ * }
+ * (end)
+ *
+ * Parameters:
+ *
+ * filename - URL of the file to be opened.
+ */
+mxEditor.prototype.open = function (filename)
+{
+ if (filename != null)
+ {
+ var xml = mxUtils.load(filename).getXml();
+ this.readGraphModel(xml.documentElement);
+ this.filename = filename;
+
+ this.fireEvent(new mxEventObject(mxEvent.OPEN, 'filename', filename));
+ }
+};
+
+/**
+ * Function: readGraphModel
+ *
+ * Reads the specified XML node into the existing graph model and resets
+ * the command history and modified state.
+ */
+mxEditor.prototype.readGraphModel = function (node)
+{
+ var dec = new mxCodec(node.ownerDocument);
+ dec.decode(node, this.graph.getModel());
+ this.resetHistory();
+};
+
+/**
+ * Function: save
+ *
+ * Posts the string returned by to the given URL or the
+ * URL returned by . The actual posting is carried out by
+ * . If the URL is null then the resulting XML will be
+ * displayed using . Exceptions should be handled as
+ * follows:
+ *
+ * (code)
+ * try
+ * {
+ * editor.save();
+ * }
+ * catch (e)
+ * {
+ * mxUtils.error('Cannot save : ' + e.message, 280, true);
+ * }
+ * (end)
+ */
+mxEditor.prototype.save = function (url, linefeed)
+{
+ // Gets the URL to post the data to
+ url = url || this.getUrlPost();
+
+ // Posts the data if the URL is not empty
+ if (url != null && url.length > 0)
+ {
+ var data = this.writeGraphModel(linefeed);
+ this.postDiagram(url, data);
+
+ // Resets the modified flag
+ this.setModified(false);
+ }
+
+ // Dispatches a save event
+ this.fireEvent(new mxEventObject(mxEvent.SAVE, 'url', url));
+};
+
+/**
+ * Function: postDiagram
+ *
+ * Hook for subclassers to override the posting of a diagram
+ * represented by the given node to the given URL. This fires
+ * an asynchronous event if the diagram has been posted.
+ *
+ * Example:
+ *
+ * To replace the diagram with the diagram in the response, use the
+ * following code.
+ *
+ * (code)
+ * editor.addListener(mxEvent.POST, function(sender, evt)
+ * {
+ * // Process response (replace diagram)
+ * var req = evt.getProperty('request');
+ * var root = req.getDocumentElement();
+ * editor.graph.readGraphModel(root)
+ * });
+ * (end)
+ */
+mxEditor.prototype.postDiagram = function (url, data)
+{
+ if (this.escapePostData)
+ {
+ data = encodeURIComponent(data);
+ }
+
+ mxUtils.post(url, this.postParameterName+'='+data,
+ mxUtils.bind(this, function(req)
+ {
+ this.fireEvent(new mxEventObject(mxEvent.POST,
+ 'request', req, 'url', url, 'data', data));
+ })
+ );
+};
+
+/**
+ * Function: writeGraphModel
+ *
+ * Hook to create the string representation of the diagram. The default
+ * implementation uses an to encode the graph model as
+ * follows:
+ *
+ * (code)
+ * var enc = new mxCodec();
+ * var node = enc.encode(this.graph.getModel());
+ * return mxUtils.getXml(node, this.linefeed);
+ * (end)
+ *
+ * Parameters:
+ *
+ * linefeed - Optional character to be used as the linefeed. Default is
+ * .
+ */
+mxEditor.prototype.writeGraphModel = function (linefeed)
+{
+ linefeed = (linefeed != null) ? linefeed : this.linefeed;
+ var enc = new mxCodec();
+ var node = enc.encode(this.graph.getModel());
+
+ return mxUtils.getXml(node, linefeed);
+};
+
+/**
+ * Function: getUrlPost
+ *
+ * Returns the URL to post the diagram to. This is used
+ * in . The default implementation returns ,
+ * adding ?draft=true.
+ */
+mxEditor.prototype.getUrlPost = function ()
+{
+ return this.urlPost;
+};
+
+/**
+ * Function: getUrlImage
+ *
+ * Returns the URL to create the image with. This is typically
+ * the URL of a backend which accepts an XML representation
+ * of a graph view to create an image. The function is used
+ * in the image action to create an image. This implementation
+ * returns .
+ */
+mxEditor.prototype.getUrlImage = function ()
+{
+ return this.urlImage;
+};
+
+/**
+ * Function: swapStyles
+ *
+ * Swaps the styles for the given names in the graph's
+ * stylesheet and refreshes the graph.
+ */
+mxEditor.prototype.swapStyles = function (first, second)
+{
+ var style = this.graph.getStylesheet().styles[second];
+ this.graph.getView().getStylesheet().putCellStyle(
+ second, this.graph.getStylesheet().styles[first]);
+ this.graph.getStylesheet().putCellStyle(first, style);
+ this.graph.refresh();
+};
+
+/**
+ * Function: showProperties
+ *
+ * Creates and shows the properties dialog for the given
+ * cell. The content area of the dialog is created using
+ * .
+ */
+mxEditor.prototype.showProperties = function (cell)
+{
+ cell = cell || this.graph.getSelectionCell();
+
+ // Uses the root node for the properties dialog
+ // if not cell was passed in and no cell is
+ // selected
+ if (cell == null)
+ {
+ cell = this.graph.getCurrentRoot();
+
+ if (cell == null)
+ {
+ cell = this.graph.getModel().getRoot();
+ }
+ }
+
+ if (cell != null)
+ {
+ // Makes sure there is no in-place editor in the
+ // graph and computes the location of the dialog
+ this.graph.stopEditing(true);
+
+ var offset = mxUtils.getOffset(this.graph.container);
+ var x = offset.x+10;
+ var y = offset.y;
+
+ // Avoids moving the dialog if it is alredy open
+ if (this.properties != null && !this.movePropertiesDialog)
+ {
+ x = this.properties.getX();
+ y = this.properties.getY();
+ }
+
+ // Places the dialog near the cell for which it
+ // displays the properties
+ else
+ {
+ var bounds = this.graph.getCellBounds(cell);
+
+ if (bounds != null)
+ {
+ x += bounds.x+Math.min(200, bounds.width);
+ y += bounds.y;
+ }
+ }
+
+ // Hides the existing properties dialog and creates a new one with the
+ // contents created in the hook method
+ this.hideProperties();
+ var node = this.createProperties(cell);
+
+ if (node != null)
+ {
+ // Displays the contents in a window and stores a reference to the
+ // window for later hiding of the window
+ this.properties = new mxWindow(mxResources.get(this.propertiesResource) ||
+ this.propertiesResource, node, x, y, this.propertiesWidth, this.propertiesHeight, false);
+ this.properties.setVisible(true);
+ }
+ }
+};
+
+/**
+ * Function: isPropertiesVisible
+ *
+ * Returns true if the properties dialog is currently visible.
+ */
+mxEditor.prototype.isPropertiesVisible = function ()
+{
+ return this.properties != null;
+};
+
+/**
+ * Function: createProperties
+ *
+ * Creates and returns the DOM node that represents the contents
+ * of the properties dialog for the given cell. This implementation
+ * works for user objects that are XML nodes and display all the
+ * node attributes in a form.
+ */
+mxEditor.prototype.createProperties = function (cell)
+{
+ var model = this.graph.getModel();
+ var value = model.getValue(cell);
+
+ if (mxUtils.isNode(value))
+ {
+ // Creates a form for the user object inside
+ // the cell
+ var form = new mxForm('properties');
+
+ // Adds a readonly field for the cell id
+ var id = form.addText('ID', cell.getId());
+ id.setAttribute('readonly', 'true');
+
+ var geo = null;
+ var yField = null;
+ var xField = null;
+ var widthField = null;
+ var heightField = null;
+
+ // Adds fields for the location and size
+ if (model.isVertex(cell))
+ {
+ geo = model.getGeometry(cell);
+
+ if (geo != null)
+ {
+ yField = form.addText('top', geo.y);
+ xField = form.addText('left', geo.x);
+ widthField = form.addText('width', geo.width);
+ heightField = form.addText('height', geo.height);
+ }
+ }
+
+ // Adds a field for the cell style
+ var tmp = model.getStyle(cell);
+ var style = form.addText('Style', tmp || '');
+
+ // Creates textareas for each attribute of the
+ // user object within the cell
+ var attrs = value.attributes;
+ var texts = [];
+
+ for (var i = 0; i < attrs.length; i++)
+ {
+ // Creates a textarea with more lines for
+ // the cell label
+ var val = attrs[i].value;
+ texts[i] = form.addTextarea(attrs[i].nodeName, val,
+ (attrs[i].nodeName == 'label') ? 4 : 2);
+ }
+
+ // Adds an OK and Cancel button to the dialog
+ // contents and implements the respective
+ // actions below
+
+ // Defines the function to be executed when the
+ // OK button is pressed in the dialog
+ var okFunction = mxUtils.bind(this, function()
+ {
+ // Hides the dialog
+ this.hideProperties();
+
+ // Supports undo for the changes on the underlying
+ // XML structure / XML node attribute changes.
+ model.beginUpdate();
+ try
+ {
+ if (geo != null)
+ {
+ geo = geo.clone();
+
+ geo.x = parseFloat(xField.value);
+ geo.y = parseFloat(yField.value);
+ geo.width = parseFloat(widthField.value);
+ geo.height = parseFloat(heightField.value);
+
+ model.setGeometry(cell, geo);
+ }
+
+ // Applies the style
+ if (style.value.length > 0)
+ {
+ model.setStyle(cell, style.value);
+ }
+ else
+ {
+ model.setStyle(cell, null);
+ }
+
+ // Creates an undoable change for each
+ // attribute and executes it using the
+ // model, which will also make the change
+ // part of the current transaction
+ for (var i=0; i. The
+ * default width of the window is 200 pixels, the y-coordinate of the location
+ * can be specifies in and the x-coordinate is right aligned with a
+ * 20 pixel offset from the right border. To change the location of the tasks
+ * window, the following code can be used:
+ *
+ * (code)
+ * var oldShowTasks = mxEditor.prototype.showTasks;
+ * mxEditor.prototype.showTasks = function()
+ * {
+ * oldShowTasks.apply(this, arguments); // "supercall"
+ *
+ * if (this.tasks != null)
+ * {
+ * this.tasks.setLocation(10, 10);
+ * }
+ * };
+ * (end)
+ */
+mxEditor.prototype.showTasks = function ()
+{
+ if (this.tasks == null)
+ {
+ var div = document.createElement('div');
+ div.style.padding = '4px';
+ div.style.paddingLeft = '20px';
+ var w = document.body.clientWidth;
+ var wnd = new mxWindow(
+ mxResources.get(this.tasksResource) ||
+ this.tasksResource,
+ div, w - 220, this.tasksTop, 200);
+ wnd.setClosable(true);
+ wnd.destroyOnClose = false;
+
+ // Installs a function to update the contents
+ // of the tasks window on every change of the
+ // model, selection or root.
+ var funct = mxUtils.bind(this, function(sender)
+ {
+ mxEvent.release(div);
+ div.innerHTML = '';
+ this.createTasks(div);
+ });
+
+ this.graph.getModel().addListener(mxEvent.CHANGE, funct);
+ this.graph.getSelectionModel().addListener(mxEvent.CHANGE, funct);
+ this.graph.addListener(mxEvent.ROOT, funct);
+
+ // Assigns the icon to the tasks window
+ if (this.tasksWindowImage != null)
+ {
+ wnd.setImage(this.tasksWindowImage);
+ }
+
+ this.tasks = wnd;
+ this.createTasks(div);
+ }
+
+ this.tasks.setVisible(true);
+};
+
+/**
+ * Function: refreshTasks
+ *
+ * Updates the contents of the tasks window using .
+ */
+mxEditor.prototype.refreshTasks = function (div)
+{
+ if (this.tasks != null)
+ {
+ var div = this.tasks.content;
+ mxEvent.release(div);
+ div.innerHTML = '';
+ this.createTasks(div);
+ }
+};
+
+/**
+ * Function: createTasks
+ *
+ * Updates the contents of the given DOM node to
+ * display the tasks associated with the current
+ * editor state. This is invoked whenever there
+ * is a possible change of state in the editor.
+ * Default implementation is empty.
+ */
+mxEditor.prototype.createTasks = function (div)
+{
+ // override
+};
+
+/**
+ * Function: showHelp
+ *
+ * Shows the help window. If the help window does not exist
+ * then it is created using an iframe pointing to the resource
+ * for the urlHelp key or if the resource
+ * is undefined.
+ */
+mxEditor.prototype.showHelp = function (tasks)
+{
+ if (this.help == null)
+ {
+ var frame = document.createElement('iframe');
+ frame.setAttribute('src', mxResources.get('urlHelp') || this.urlHelp);
+ frame.setAttribute('height', '100%');
+ frame.setAttribute('width', '100%');
+ frame.setAttribute('frameBorder', '0');
+ frame.style.backgroundColor = 'white';
+
+ var w = document.body.clientWidth;
+ var h = (document.body.clientHeight || document.documentElement.clientHeight);
+
+ var wnd = new mxWindow(mxResources.get(this.helpResource) || this.helpResource,
+ frame, (w-this.helpWidth)/2, (h-this.helpHeight)/3, this.helpWidth, this.helpHeight);
+ wnd.setMaximizable(true);
+ wnd.setClosable(true);
+ wnd.destroyOnClose = false;
+ wnd.setResizable(true);
+
+ // Assigns the icon to the help window
+ if (this.helpWindowImage != null)
+ {
+ wnd.setImage(this.helpWindowImage);
+ }
+
+ // Workaround for ignored iframe height 100% in FF
+ if (mxClient.IS_NS)
+ {
+ var handler = function(sender)
+ {
+ var h = wnd.div.offsetHeight;
+ frame.setAttribute('height', (h-26)+'px');
+ };
+
+ wnd.addListener(mxEvent.RESIZE_END, handler);
+ wnd.addListener(mxEvent.MAXIMIZE, handler);
+ wnd.addListener(mxEvent.NORMALIZE, handler);
+ wnd.addListener(mxEvent.SHOW, handler);
+ }
+
+ this.help = wnd;
+ }
+
+ this.help.setVisible(true);
+};
+
+/**
+ * Function: showOutline
+ *
+ * Shows the outline window. If the window does not exist, then it is
+ * created using an .
+ */
+mxEditor.prototype.showOutline = function ()
+{
+ var create = this.outline == null;
+
+ if (create)
+ {
+ var div = document.createElement('div');
+
+ div.style.overflow = 'hidden';
+ div.style.position = 'relative';
+ div.style.width = '100%';
+ div.style.height = '100%';
+ div.style.background = 'white';
+ div.style.cursor = 'move';
+
+ if (document.documentMode == 8)
+ {
+ div.style.filter = 'progid:DXImageTransform.Microsoft.alpha(opacity=100)';
+ }
+
+ var wnd = new mxWindow(
+ mxResources.get(this.outlineResource) ||
+ this.outlineResource,
+ div, 600, 480, 200, 200, false);
+
+ // Creates the outline in the specified div
+ // and links it to the existing graph
+ var outline = new mxOutline(this.graph, div);
+ wnd.setClosable(true);
+ wnd.setResizable(true);
+ wnd.destroyOnClose = false;
+
+ wnd.addListener(mxEvent.RESIZE_END, function()
+ {
+ outline.update();
+ });
+
+ this.outline = wnd;
+ this.outline.outline = outline;
+ }
+
+ // Finally shows the outline
+ this.outline.setVisible(true);
+ this.outline.outline.update(true);
+};
+
+/**
+ * Function: setMode
+ *
+ * Puts the graph into the specified mode. The following modenames are
+ * supported:
+ *
+ * select - Selects using the left mouse button, new connections
+ * are disabled.
+ * connect - Selects using the left mouse button or creates new
+ * connections if mouse over cell hotspot. See .
+ * pan - Pans using the left mouse button, new connections are disabled.
+ */
+mxEditor.prototype.setMode = function(modename)
+{
+ if (modename == 'select')
+ {
+ this.graph.panningHandler.useLeftButtonForPanning = false;
+ this.graph.setConnectable(false);
+ }
+ else if (modename == 'connect')
+ {
+ this.graph.panningHandler.useLeftButtonForPanning = false;
+ this.graph.setConnectable(true);
+ }
+ else if (modename == 'pan')
+ {
+ this.graph.panningHandler.useLeftButtonForPanning = true;
+ this.graph.setConnectable(false);
+ }
+};
+
+/**
+ * Function: createPopupMenu
+ *
+ * Uses to create the menu in the graph's
+ * panning handler. The redirection is setup in
+ * .
+ */
+mxEditor.prototype.createPopupMenu = function (menu, cell, evt)
+{
+ this.popupHandler.createMenu(this, menu, cell, evt);
+};
+
+/**
+ * Function: createEdge
+ *
+ * Uses as the prototype for creating new edges
+ * in the connection handler of the graph. The style of the
+ * edge will be overridden with the value returned by
+ * .
+ */
+mxEditor.prototype.createEdge = function (source, target)
+{
+ // Clones the defaultedge prototype
+ var e = null;
+
+ if (this.defaultEdge != null)
+ {
+ var model = this.graph.getModel();
+ e = model.cloneCell(this.defaultEdge);
+ }
+ else
+ {
+ e = new mxCell('');
+ e.setEdge(true);
+
+ var geo = new mxGeometry();
+ geo.relative = true;
+ e.setGeometry(geo);
+ }
+
+ // Overrides the edge style
+ var style = this.getEdgeStyle();
+
+ if (style != null)
+ {
+ e.setStyle(style);
+ }
+
+ return e;
+};
+
+/**
+ * Function: getEdgeStyle
+ *
+ * Returns a string identifying the style of new edges.
+ * The function is used in when new edges
+ * are created in the graph.
+ */
+mxEditor.prototype.getEdgeStyle = function ()
+{
+ return this.defaultEdgeStyle;
+};
+
+/**
+ * Function: consumeCycleAttribute
+ *
+ * Returns the next attribute in
+ * or null, if not attribute should be used in the
+ * specified cell.
+ */
+mxEditor.prototype.consumeCycleAttribute = function (cell)
+{
+ return (this.cycleAttributeValues != null &&
+ this.cycleAttributeValues.length > 0 &&
+ this.graph.isSwimlane(cell)) ?
+ this.cycleAttributeValues[this.cycleAttributeIndex++ %
+ this.cycleAttributeValues.length] : null;
+};
+
+/**
+ * Function: cycleAttribute
+ *
+ * Uses the returned value from
+ * as the value for the key in
+ * the given cell's style.
+ */
+mxEditor.prototype.cycleAttribute = function (cell)
+{
+ if (this.cycleAttributeName != null)
+ {
+ var value = this.consumeCycleAttribute(cell);
+
+ if (value != null)
+ {
+ cell.setStyle(cell.getStyle()+';'+
+ this.cycleAttributeName+'='+value);
+ }
+ }
+};
+
+/**
+ * Function: addVertex
+ *
+ * Adds the given vertex as a child of parent at the specified
+ * x and y coordinate and fires an event.
+ */
+mxEditor.prototype.addVertex = function (parent, vertex, x, y)
+{
+ var model = this.graph.getModel();
+
+ while (parent != null && !this.graph.isValidDropTarget(parent))
+ {
+ parent = model.getParent(parent);
+ }
+
+ parent = (parent != null) ? parent : this.graph.getSwimlaneAt(x, y);
+ var scale = this.graph.getView().scale;
+
+ var geo = model.getGeometry(vertex);
+ var pgeo = model.getGeometry(parent);
+
+ if (this.graph.isSwimlane(vertex) &&
+ !this.graph.swimlaneNesting)
+ {
+ parent = null;
+ }
+ else if (parent == null && this.swimlaneRequired)
+ {
+ return null;
+ }
+ else if (parent != null && pgeo != null)
+ {
+ // Keeps vertex inside parent
+ var state = this.graph.getView().getState(parent);
+
+ if (state != null)
+ {
+ x -= state.origin.x * scale;
+ y -= state.origin.y * scale;
+
+ if (this.graph.isConstrainedMoving)
+ {
+ var width = geo.width;
+ var height = geo.height;
+ var tmp = state.x+state.width;
+
+ if (x+width > tmp)
+ {
+ x -= x+width - tmp;
+ }
+
+ tmp = state.y+state.height;
+
+ if (y+height > tmp)
+ {
+ y -= y+height - tmp;
+ }
+ }
+ }
+ else if (pgeo != null)
+ {
+ x -= pgeo.x*scale;
+ y -= pgeo.y*scale;
+ }
+ }
+
+ geo = geo.clone();
+ geo.x = this.graph.snap(x / scale -
+ this.graph.getView().translate.x -
+ this.graph.gridSize/2);
+ geo.y = this.graph.snap(y / scale -
+ this.graph.getView().translate.y -
+ this.graph.gridSize/2);
+ vertex.setGeometry(geo);
+
+ if (parent == null)
+ {
+ parent = this.graph.getDefaultParent();
+ }
+
+ this.cycleAttribute(vertex);
+ this.fireEvent(new mxEventObject(mxEvent.BEFORE_ADD_VERTEX,
+ 'vertex', vertex, 'parent', parent));
+
+ model.beginUpdate();
+ try
+ {
+ vertex = this.graph.addCell(vertex, parent);
+
+ if (vertex != null)
+ {
+ this.graph.constrainChild(vertex);
+
+ this.fireEvent(new mxEventObject(mxEvent.ADD_VERTEX, 'vertex', vertex));
+ }
+ }
+ finally
+ {
+ model.endUpdate();
+ }
+
+ if (vertex != null)
+ {
+ this.graph.setSelectionCell(vertex);
+ this.graph.scrollCellToVisible(vertex);
+ this.fireEvent(new mxEventObject(mxEvent.AFTER_ADD_VERTEX, 'vertex', vertex));
+ }
+
+ return vertex;
+};
+
+/**
+ * Function: destroy
+ *
+ * Removes the editor and all its associated resources. This does not
+ * normally need to be called, it is called automatically when the window
+ * unloads.
+ */
+mxEditor.prototype.destroy = function ()
+{
+ if (!this.destroyed)
+ {
+ this.destroyed = true;
+
+ if (this.tasks != null)
+ {
+ this.tasks.destroy();
+ }
+
+ if (this.outline != null)
+ {
+ this.outline.destroy();
+ }
+
+ if (this.properties != null)
+ {
+ this.properties.destroy();
+ }
+
+ if (this.keyHandler != null)
+ {
+ this.keyHandler.destroy();
+ }
+
+ if (this.rubberband != null)
+ {
+ this.rubberband.destroy();
+ }
+
+ if (this.toolbar != null)
+ {
+ this.toolbar.destroy();
+ }
+
+ if (this.graph != null)
+ {
+ this.graph.destroy();
+ }
+
+ this.status = null;
+ this.templates = null;
+ }
+};
diff --git a/oaweb/public/cherry/drawio/src/js/handler/mxCellHighlight.js b/oaweb/public/cherry/drawio/src/js/handler/mxCellHighlight.js
new file mode 100644
index 0000000..937386a
--- /dev/null
+++ b/oaweb/public/cherry/drawio/src/js/handler/mxCellHighlight.js
@@ -0,0 +1,314 @@
+/**
+ * Copyright (c) 2006-2015, JGraph Ltd
+ * Copyright (c) 2006-2015, Gaudenz Alder
+ */
+/**
+ * Class: mxCellHighlight
+ *
+ * A helper class to highlight cells. Here is an example for a given cell.
+ *
+ * (code)
+ * var highlight = new mxCellHighlight(graph, '#ff0000', 2);
+ * highlight.highlight(graph.view.getState(cell)));
+ * (end)
+ *
+ * Constructor: mxCellHighlight
+ *
+ * Constructs a cell highlight.
+ */
+function mxCellHighlight(graph, highlightColor, strokeWidth, dashed)
+{
+ if (graph != null)
+ {
+ this.graph = graph;
+ this.highlightColor = (highlightColor != null) ? highlightColor : mxConstants.DEFAULT_VALID_COLOR;
+ this.strokeWidth = (strokeWidth != null) ? strokeWidth : mxConstants.HIGHLIGHT_STROKEWIDTH;
+ this.dashed = (dashed != null) ? dashed : false;
+ this.opacity = mxConstants.HIGHLIGHT_OPACITY;
+
+ // Updates the marker if the graph changes
+ this.repaintHandler = mxUtils.bind(this, function()
+ {
+ // Updates reference to state
+ if (this.state != null)
+ {
+ var tmp = this.graph.view.getState(this.state.cell);
+
+ if (tmp == null)
+ {
+ this.hide();
+ }
+ else
+ {
+ this.state = tmp;
+ this.repaint();
+ }
+ }
+ });
+
+ this.graph.getView().addListener(mxEvent.SCALE, this.repaintHandler);
+ this.graph.getView().addListener(mxEvent.TRANSLATE, this.repaintHandler);
+ this.graph.getView().addListener(mxEvent.SCALE_AND_TRANSLATE, this.repaintHandler);
+ this.graph.getModel().addListener(mxEvent.CHANGE, this.repaintHandler);
+
+ // Hides the marker if the current root changes
+ this.resetHandler = mxUtils.bind(this, function()
+ {
+ this.hide();
+ });
+
+ this.graph.getView().addListener(mxEvent.DOWN, this.resetHandler);
+ this.graph.getView().addListener(mxEvent.UP, this.resetHandler);
+ }
+};
+
+/**
+ * Variable: keepOnTop
+ *
+ * Specifies if the highlights should appear on top of everything
+ * else in the overlay pane. Default is false.
+ */
+mxCellHighlight.prototype.keepOnTop = false;
+
+/**
+ * Variable: graph
+ *
+ * Reference to the enclosing .
+ */
+mxCellHighlight.prototype.graph = true;
+
+/**
+ * Variable: state
+ *
+ * Reference to the .
+ */
+mxCellHighlight.prototype.state = null;
+
+/**
+ * Variable: spacing
+ *
+ * Specifies the spacing between the highlight for vertices and the vertex.
+ * Default is 2.
+ */
+mxCellHighlight.prototype.spacing = 2;
+
+/**
+ * Variable: resetHandler
+ *
+ * Holds the handler that automatically invokes reset if the highlight
+ * should be hidden.
+ */
+mxCellHighlight.prototype.resetHandler = null;
+
+/**
+ * Function: setHighlightColor
+ *
+ * Sets the color of the rectangle used to highlight drop targets.
+ *
+ * Parameters:
+ *
+ * color - String that represents the new highlight color.
+ */
+mxCellHighlight.prototype.setHighlightColor = function(color)
+{
+ this.highlightColor = color;
+
+ if (this.shape != null)
+ {
+ this.shape.stroke = color;
+ }
+};
+
+/**
+ * Function: drawHighlight
+ *
+ * Creates and returns the highlight shape for the given state.
+ */
+mxCellHighlight.prototype.drawHighlight = function()
+{
+ this.shape = this.createShape();
+ this.repaint();
+
+ if (!this.keepOnTop && this.shape.node.parentNode.firstChild != this.shape.node)
+ {
+ this.shape.node.parentNode.insertBefore(this.shape.node, this.shape.node.parentNode.firstChild);
+ }
+};
+
+/**
+ * Function: createShape
+ *
+ * Creates and returns the highlight shape for the given state.
+ */
+mxCellHighlight.prototype.createShape = function()
+{
+ var shape = this.graph.cellRenderer.createShape(this.state);
+
+ shape.svgStrokeTolerance = this.graph.tolerance;
+ shape.points = this.state.absolutePoints;
+ shape.apply(this.state);
+ shape.stroke = this.highlightColor;
+ shape.opacity = this.opacity;
+ shape.isDashed = this.dashed;
+ shape.isShadow = false;
+
+ shape.dialect = (this.graph.dialect != mxConstants.DIALECT_SVG) ? mxConstants.DIALECT_VML : mxConstants.DIALECT_SVG;
+ shape.init(this.graph.getView().getOverlayPane());
+ mxEvent.redirectMouseEvents(shape.node, this.graph, this.state);
+
+ if (this.graph.dialect != mxConstants.DIALECT_SVG)
+ {
+ shape.pointerEvents = false;
+ }
+ else
+ {
+ shape.svgPointerEvents = 'stroke';
+ }
+
+ return shape;
+};
+
+/**
+ * Function: repaint
+ *
+ * Updates the highlight after a change of the model or view.
+ */
+mxCellHighlight.prototype.getStrokeWidth = function(state)
+{
+ return this.strokeWidth;
+};
+
+/**
+ * Function: repaint
+ *
+ * Updates the highlight after a change of the model or view.
+ */
+mxCellHighlight.prototype.repaint = function()
+{
+ if (this.state != null && this.shape != null)
+ {
+ this.shape.scale = this.state.view.scale;
+
+ if (this.graph.model.isEdge(this.state.cell))
+ {
+ this.shape.strokewidth = this.getStrokeWidth();
+ this.shape.points = this.state.absolutePoints;
+ this.shape.outline = false;
+ }
+ else
+ {
+ this.shape.bounds = new mxRectangle(this.state.x - this.spacing, this.state.y - this.spacing,
+ this.state.width + 2 * this.spacing, this.state.height + 2 * this.spacing);
+ this.shape.rotation = Number(this.state.style[mxConstants.STYLE_ROTATION] || '0');
+ this.shape.strokewidth = this.getStrokeWidth() / this.state.view.scale;
+ this.shape.outline = true;
+ }
+
+ // Uses cursor from shape in highlight
+ if (this.state.shape != null)
+ {
+ this.shape.setCursor(this.state.shape.getCursor());
+ }
+
+ // Workaround for event transparency in VML with transparent color
+ // is to use a non-transparent color with near zero opacity
+ if (mxClient.IS_QUIRKS || document.documentMode == 8)
+ {
+ if (this.shape.stroke == 'transparent')
+ {
+ // KNOWN: Quirks mode does not seem to catch events if
+ // we do not force an update of the DOM via a change such
+ // as mxLog.debug. Since IE6 is EOL we do not add a fix.
+ this.shape.stroke = 'white';
+ this.shape.opacity = 1;
+ }
+ else
+ {
+ this.shape.opacity = this.opacity;
+ }
+ }
+
+ this.shape.redraw();
+ }
+};
+
+/**
+ * Function: hide
+ *
+ * Resets the state of the cell marker.
+ */
+mxCellHighlight.prototype.hide = function()
+{
+ this.highlight(null);
+};
+
+/**
+ * Function: mark
+ *
+ * Marks the and fires a