15.9.5 release

ChangeLog

@@ -1,3 +1,15 @@
+13-DEC-2021: 15.9.5
+
+- Ctrl disables copy if enabled by default
+- Uses action state for (un)group buttons
+- Altered AWS group styles for better usability
+- Fixes no pointerEvents for no (fill)opacity
+- Fixes for AWS container usability
+- Uses lazyZoom and adds trackpad in outline window
+- Fixes dark mode support in browser picker
+- Fixes ignored stroke option in SVG getBBox https://github.com/jgraph/drawio/issues/2484
+- 
+
 08-DEC-2021: 15.9.4
 
 - Adds mxShape.intersectsRectangle

VERSION

@@ -1 +1 @@
-15.9.4
+15.9.5

src/main/webapp/js/diagramly/Editor.js

@@ -539,6 +539,8 @@
 
         	return format.editorUi.editor.graph.isSwimlane(state.vertices[0]) ||
         		fillColor == null || fillColor == mxConstants.NONE ||
+				mxUtils.getValue(state.style, mxConstants.STYLE_FILL_OPACITY, 100) == 0 ||
+				mxUtils.getValue(state.style, mxConstants.STYLE_OPACITY, 100) == 0 ||
 				state.style['pointerEvents'] != null;
         }},
         {name: 'moveCells', dispName: 'Move Cells on Fold', type: 'bool', defVal: false, isVisible: function(state, format)

src/main/webapp/js/diagramly/EditorUi.js

@@ -7413,18 +7413,43 @@
 			{
 				try
 				{
-					EditorUi.logEvent({category: 'LUCIDCHART-IMPORT-FILE',
-						action: 'size_' + data.length});
-					EditorUi.debug('convertLucidChart', data);
-				}
-				catch (e)
-				{
-					// ignore
-				}
-
-				try
-				{
-					success(LucidImporter.importState(JSON.parse(data)));
+					var obj = JSON.parse(data);
+					success(LucidImporter.importState(obj));
+
+					try
+					{
+						EditorUi.logEvent({category: 'LUCIDCHART-IMPORT-FILE',
+							action: 'size_' + data.length});
+
+							if (window.console != null && urlParams['test'] == '1')
+							{
+								var args = [new Date().toISOString(), 'convertLucidChart', obj];
+
+								if (obj.state != null)
+								{
+									args.push(JSON.parse(obj.state));
+								}
+
+								if (obj.svgThumbs != null)
+								{
+									for (var i = 0; i < obj.svgThumbs.length; i++)
+									{
+										args.push(Editor.createSvgDataUri(obj.svgThumbs[i]));
+									}
+								}
+
+								if (obj.thumb != null)
+								{
+									args.push(obj.thumb);
+								}
+
+								console.log.apply(console, args);
+							}
+					}
+					catch (e)
+					{
+						// ignore
+					}
 				}
 				catch (e)
 				{

src/main/webapp/js/diagramly/sidebar/Sidebar-AWS4.js

@@ -202,7 +202,8 @@
 
 	Sidebar.prototype.addAWS4GroupsPalette = function(s, gn, sb, pts)
 	{
-		var n4 = pts + 'outlineConnect=0;gradientColor=none;html=1;whiteSpace=wrap;fontSize=12;fontStyle=0;' + mxConstants.STYLE_SHAPE + "=mxgraph.aws4.";
+		var n4 = pts + 'outlineConnect=0;gradientColor=none;html=1;whiteSpace=wrap;fontSize=12;fontStyle=0;container=1;pointerEvents=0;collapsible=0;recursiveResize=0;' + mxConstants.STYLE_SHAPE + "=mxgraph.aws4.";
+
 		var dt = 'aws amazon web service groups group ';
 
 		this.addPaletteFunctions('aws4Groups', 'AWS / Groups', false,

src/main/webapp/js/grapheditor/Dialogs.js

@@ -2015,6 +2015,7 @@ var OutlineWindow = function(editorUi, x, y, w, h)
 
 	var zoomInAction = editorUi.actions.get('zoomIn');
 	var zoomOutAction = editorUi.actions.get('zoomOut');
+
 	mxEvent.addMouseWheelListener(function(evt, up)
 	{
 		var outlineWheel = false;
@@ -2033,14 +2034,16 @@ var OutlineWindow = function(editorUi, x, y, w, h)
 
 		if (outlineWheel)
 		{
-			if (up)
-			{
-				zoomInAction.funct();
-			}
-			else
+			var factor = graph.zoomFactor;
+
+			// Slower zoom for pinch gesture on trackpad
+			if (evt.deltaY != null && Math.round(evt.deltaY) != evt.deltaY)
 			{
-				zoomOutAction.funct();
+				factor = 1 + (Math.abs(evt.deltaY) / 20) * (factor - 1);
 			}
+
+			graph.lazyZoom(up, null, null, factor);
+			mxEvent.consume(evt);
 		}
 	});
 };

src/main/webapp/js/grapheditor/EditorUi.js

@@ -2904,9 +2904,11 @@ EditorUi.prototype.initCanvas = function()
 
 			scrollPosition = new mxPoint(graph.container.scrollLeft, graph.container.scrollTop);
 
-			var cx = (ignoreCursorPosition) ? graph.container.scrollLeft + graph.container.clientWidth / 2 :
+			var cx = (ignoreCursorPosition || cursorPosition == null) ?
+				graph.container.scrollLeft + graph.container.clientWidth / 2 :
 				cursorPosition.x + graph.container.scrollLeft - graph.container.offsetLeft;
-			var cy = (ignoreCursorPosition) ? graph.container.scrollTop + graph.container.clientHeight / 2 :
+			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(' + this.cumulativeZoomFactor + ')';
@@ -3802,6 +3804,9 @@ EditorUi.prototype.updateActionStates = function()
 	var vertexSelected = false;
 	var groupSelected = false;
 	var edgeSelected = false;
+	var tableSelected = false;
+	var rowSelected = false;
+	var cellSelected = false;
 	var selected = false;
 	var editable = [];
 
@@ -3813,6 +3818,10 @@ EditorUi.prototype.updateActionStates = function()
     	{
     		var cell = cells[i];
 
+			tableSelected = tableSelected || graph.isTable(cell);
+			cellSelected = cellSelected || graph.isTableCell(cell);
+			rowSelected = rowSelected || graph.isTableRow(cell);
+
 			if (graph.isCellEditable(cell))
 			{
 				editable.push(cell);
@@ -3861,9 +3870,11 @@ EditorUi.prototype.updateActionStates = function()
 	this.actions.get('wordWrap').setEnabled(vertexSelected);
 	this.actions.get('autosize').setEnabled(vertexSelected);
    	var oneVertexSelected = vertexSelected && graph.getSelectionCount() == 1;
-	this.actions.get('group').setEnabled(graph.getSelectionCount() > 1 ||
-		(oneVertexSelected && !graph.isContainer(graph.getSelectionCell())));
-	this.actions.get('ungroup').setEnabled(groupSelected);
+	this.actions.get('group').setEnabled((graph.getSelectionCount() > 1 ||
+		(oneVertexSelected && !graph.isContainer(graph.getSelectionCell()) &&
+		graph.model.getChildCount(graph.getSelectionCell()) == 0)) &&
+		!rowSelected && !cellSelected);
+	this.actions.get('ungroup').setEnabled(groupSelected && !rowSelected && !cellSelected);
    	this.actions.get('removeFromGroup').setEnabled(oneVertexSelected &&
    		graph.getModel().isVertex(graph.getModel().getParent(editable[0])));
 

src/main/webapp/js/grapheditor/Format.js

@@ -848,6 +848,32 @@ BaseFormatPanel.prototype.createTitle = function(title)
 	return div;
 };
 
+/**
+ * 
+ */
+BaseFormatPanel.prototype.addAction = function(div, action, width)
+{
+	var result = false;
+
+	if (action != null && action.isEnabled())
+	{
+		var btn = mxUtils.button(action.label, function(evt)
+		{
+			action.funct();
+		});
+
+		var short = (action.shortcut != null) ? ' (' + action.shortcut + ')' : '';
+		btn.setAttribute('title', action.label + short);
+		width = (width != null) ? width : 210;
+		btn.style.width = width + 'px';
+		btn.style.marginBottom = '2px';
+		div.appendChild(btn);
+		result = true;
+	}
+
+	return result;
+};
+
 /**
  * 
  */
@@ -1965,42 +1991,21 @@ ArrangePanel.prototype.addGroupOps = function(div)
 	div.style.paddingTop = '8px';
 	div.style.paddingBottom = '6px';
 
-	if (graph.getSelectionCount() > 1)
+	if (this.addAction(div, ui.actions.get('group')))
 	{
-		btn = mxUtils.button(mxResources.get('group'), function(evt)
-		{
-			ui.actions.get('group').funct();
-		})
-
-		btn.setAttribute('title', mxResources.get('group') + ' (' + this.editorUi.actions.get('group').shortcut + ')');
-		btn.style.width = '210px';
-		btn.style.marginBottom = '2px';
-		div.appendChild(btn);
+		mxUtils.br(div);
 		count++;
 	}
-	else if (ss.cells.length == 1 && !graph.getModel().isEdge(cell) && !graph.isSwimlane(cell) &&
-		!graph.isTable(cell) && !ss.row && !ss.cell && graph.getModel().getChildCount(cell) > 0)
+
+	if (this.addAction(div, ui.actions.get('ungroup')))
 	{
-		btn = mxUtils.button(mxResources.get('ungroup'), function(evt)
-		{
-			ui.actions.get('ungroup').funct();
-		})
-
-		btn.setAttribute('title', mxResources.get('ungroup') + ' (' +
-			this.editorUi.actions.get('ungroup').shortcut + ')');
-		btn.style.width = '210px';
-		btn.style.marginBottom = '2px';
-		div.appendChild(btn);
+		mxUtils.br(div);
 		count++;
 	}
-	
+
 	if (graph.getModel().isVertex(graph.getSelectionCell()))
 	{
-		if (count > 0)
-		{
-			mxUtils.br(div);
-			count = 0;
-		}
+		count = 0;
 
 		var btn = mxUtils.button(mxResources.get('copySize'), function(evt)
 		{