21.2.1 release

jgraph · Apr 20, 2023 · c139526 · c139526
1 parent 2f81494
commit c139526
Show file tree

Hide file tree

Showing 70 changed files with 2,235 additions and 2,075 deletions.
diff --git a/ChangeLog b/ChangeLog
@@ -1,3 +1,13 @@
+19-APR-2023: 21.2.1
+
+- Skips sanitizeHtml for unchanged labels [drawio-3530]
+- Uses cssText property to set CSS in foreignObjects
+- Adds submenu to enable and change diagram language
+
+19-APR-2023: 21.2.0
+
+- Defers bounding box update until after DOM changes [DID-7902]
+
 18-APR-2023: 21.1.9
 
 - Edit connection points in popup menu [drawio-2984]

diff --git a/VERSION b/VERSION
@@ -1 +1 @@
-21.1.9
+21.2.1
diff --git a/src/main/webapp/js/app.min.js b/src/main/webapp/js/app.min.js
diff --git a/src/main/webapp/js/diagramly/Menus.js b/src/main/webapp/js/diagramly/Menus.js
@@ -1637,19 +1637,43 @@
 			}
 		})));
 
-		// Experimental
+		// LATER: Remove when translations are updated
 		mxResources.parse('diagramLanguage=Diagram Language');
-		editorUi.actions.addAction('diagramLanguage...', function()
+		mxResources.parse('languageCode=Language Code');
+
+		editorUi.actions.addAction('languageCode...', function()
 		{
-			var lang = prompt('Language Code', Graph.diagramLanguage || '');
-
-			if (lang != null)
+			var lang = Graph.diagramLanguage || '';
+					
+			var dlg = new FilenameDialog(editorUi, lang, mxResources.get('ok'), mxUtils.bind(this, function(newLang)
 			{
-				Graph.diagramLanguage = (lang.length > 0) ? lang : null;
-				graph.refresh();
-			}
+				if (newLang != null)
+				{
+					Graph.diagramLanguage = (newLang.length > 0) ? newLang : null;
+					Graph.translateDiagram = true;
+					graph.refresh();
+				}
+			}), mxResources.get('languageCode'), null, null, 'https://www.diagrams.net/blog/translate-diagrams');
+			editorUi.showDialog(dlg.container, 340, 96, true, true);
+			dlg.init();
 		});
 
+		this.put('diagramLanguage', new Menu(mxUtils.bind(this, function(menu, parent)
+		{
+			this.addMenuItems(menu, ['languageCode', '-'], parent);
+
+			var item = menu.addItem(mxResources.get('disabled'), null, function()
+			{
+				Graph.translateDiagram = false;
+				graph.refresh();
+			}, parent);
+
+			if (!Graph.translateDiagram)
+			{
+				menu.addCheckmark(item, Editor.checkmarkImage);
+			}
+		})));
+
 		// Only visible in test mode
 		if (urlParams['test'] == '1')
 		{
@@ -4337,12 +4361,8 @@
 				{
 					editorUi.menus.addMenuItems(menu, ['-', 'spellCheck', 'autoBkp', 'drafts', '-'], parent);
 				}
-
-				if (Graph.translateDiagram)
-				{
-					editorUi.menus.addMenuItems(menu, ['diagramLanguage'], parent);
-				}
 
+				this.addSubmenu('diagramLanguage', menu, parent);
 				menu.addSeparator(parent);
 
 				if (editorUi.mode != App.MODE_ATLAS) 
@@ -4412,12 +4432,7 @@
 				}
 
 				this.addMenuItems(menu, ['-', 'editDiagram'], parent);
-
-				if (Graph.translateDiagram)
-				{
-					this.addMenuItems(menu, ['diagramLanguage']);
-				}
-
+				this.addSubmenu('diagramLanguage', menu, parent);
 				menu.addSeparator(parent);
 
 				if (urlParams['embed'] != '1' && (isLocalStorage || mxClient.IS_CHROMEAPP))

diff --git a/src/main/webapp/js/diagramly/Minimal.js b/src/main/webapp/js/diagramly/Minimal.js
@@ -233,8 +233,6 @@ EditorUi.initMinimalTheme = function()
 	mxConstants.CONNECT_HANDLE_FILLCOLOR = '#cee7ff';
 	mxConstants.DEFAULT_VALID_COLOR = fill;
 	mxConstants.GUIDE_COLOR = '#C0C0C0';
-	mxConstants.HIGHLIGHT_STROKEWIDTH = 5;
-	mxConstants.HIGHLIGHT_OPACITY = 35;
 	mxConstants.OUTLINE_COLOR = '#29b6f2';
 	mxConstants.OUTLINE_HANDLE_FILLCOLOR = '#29b6f2';
 	mxConstants.OUTLINE_HANDLE_STROKECOLOR = '#fff';

diff --git a/src/main/webapp/js/grapheditor/Graph.js b/src/main/webapp/js/grapheditor/Graph.js
@@ -764,7 +764,12 @@ Graph = function(container, model, renderHint, stylesheet, themes, standalone)
 			}
 			else
 			{
-				result = Graph.sanitizeHtml(result);
+				// Skips sanitizeHtml for unchanged labels
+				if (state.lastLabelValue != result)
+				{
+					state.lastLabelValue = result;
+					result = Graph.sanitizeHtml(result);
+				}
 			}
 		}
 
@@ -8078,7 +8083,8 @@ if (typeof mxVertexHandler !== 'undefined')
 		mxConstants.DEFAULT_VALID_COLOR = '#00a8ff';
 		mxConstants.LABEL_HANDLE_FILLCOLOR = '#cee7ff';
 		mxConstants.GUIDE_COLOR = '#0088cf';
-		mxConstants.HIGHLIGHT_OPACITY = 30;
+		mxConstants.HIGHLIGHT_STROKEWIDTH = 5;
+		mxConstants.HIGHLIGHT_OPACITY = 50;
 	    mxConstants.HIGHLIGHT_SIZE = 5;
 
 		// Sets window decoration icons
@@ -13638,7 +13644,8 @@ if (typeof mxVertexHandler !== 'undefined')
 
 			if (this.isSource || this.isTarget)
 			{
-				if (this.constraintHandler.currentConstraint != null &&
+				if (this.constraintHandler != null &&
+					this.constraintHandler.currentConstraint != null &&
 					this.constraintHandler.currentFocus != null)
 				{
 					var pt = this.constraintHandler.currentConstraint.point;
@@ -14454,19 +14461,29 @@ if (typeof mxVertexHandler !== 'undefined')
 		};
 
 		mxEdgeHandler.prototype.updateLinkHint = mxVertexHandler.prototype.updateLinkHint;
+
+		// Extends constraint handler
+		var edgeHandlerCreateConstraintHandler = mxEdgeHandler.prototype.createConstraintHandler;
+
+		mxEdgeHandler.prototype.createConstraintHandler = function()
+		{
+			var handler = edgeHandlerCreateConstraintHandler.apply(this, arguments);
+
+			// Disables connection points
+			handler.isEnabled = mxUtils.bind(this, function()
+			{
+				return this.state.view.graph.connectionHandler.isEnabled();
+			});
+
+			return handler;
+		};
 
 		// Creates special handles
 		var edgeHandlerInit = mxEdgeHandler.prototype.init;
 		mxEdgeHandler.prototype.init = function()
 		{
 			edgeHandlerInit.apply(this, arguments);
 
-			// Disables connection points
-			this.constraintHandler.isEnabled = mxUtils.bind(this, function()
-			{
-				return this.state.view.graph.connectionHandler.isEnabled();
-			});
-
 			var update = mxUtils.bind(this, function()
 			{
 				if (this.linkHint != null)