Browse Source

[shgraph] Remade moving/resizing box undo/redo

Clément Espeute 1 year ago
parent
commit
5fc3bd8680
3 changed files with 67 additions and 53 deletions
  1. 8 0
      hide/comp/CurveEditor.hx
  2. 52 35
      hide/view/GraphEditor.hx
  3. 7 18
      hide/view/shadereditor/Box.hx

+ 8 - 0
hide/comp/CurveEditor.hx

@@ -1180,6 +1180,14 @@ class CurveEditor extends hide.comp.Component {
 		svg.line(markersGroup, xt(this.currentTime), svg.element.height(), xt(this.currentTime), labelHeight / 2.0, { stroke:'#426dae', 'stroke-width':'2px' });
 		drawLabel(markersGroup, xt(this.currentTime), labelHeight / 2.0 + (tlHeight - labelHeight) / 2.0, labelWidth, labelHeight, { fill:'#426dae', stroke: '#426dae', 'stroke-width':'5px', 'stroke-linejoin':'round'});
 		svg.text(markersGroup, xt(this.currentTime), 14, '${rounderCurrTime}', { 'fill':'#e7ecf5', 'text-anchor':'middle', 'font':'10px sans-serif'});
+
+
+		function drawMaker(x: Float) {
+			svg.line(markersGroup, xt(x), svg.element.height(), xt(x), labelHeight / 2.0, { stroke: '#260f00', 'stroke-width' : '2px'});
+		}
+
+		drawMaker(0);
+
 	}
 
 	public function refreshOverlay(?duration: Float) {

+ 52 - 35
hide/view/GraphEditor.hx

@@ -365,12 +365,10 @@ class GraphEditor extends hide.comp.Component {
 			if (!preview.visible)
 				continue;
 
-			var pos = Box.tmpPoint;
-			box.node.getPos(pos);
-			preview.x = gX(pos.x);
-			preview.y = gY(pos.y + box.getHeight());
-			preview.scaleX = transformMatrix[0] * box.width;
-			preview.scaleY = transformMatrix[3] * box.width;
+			preview.x = gX(box.x);
+			preview.y = gY(box.y + box.getHeight());
+			preview.scaleX = transformMatrix[0] * box.width / preview.tile.width;
+			preview.scaleY = transformMatrix[3] * box.width / preview.tile.height;
 
 			if (preview.x + preview.scaleX < 0 || preview.x > sceneW || preview.y + preview.scaleY < 0 || preview.y > sceneH) {
 				preview.visible = false;
@@ -400,6 +398,45 @@ class GraphEditor extends hide.comp.Component {
 		}
 	}
 
+	function opMove(box: Box, x: Float, y: Float, undoBuffer: UndoBuffer) {
+		box.node.getPos(Box.tmpPoint);
+		var prevX = Box.tmpPoint.x;
+		var prevY = Box.tmpPoint.y;
+		if (prevX == x && prevY == y)
+			return;
+		var id = box.node.getId();
+		function exec(isUndo: Bool) {
+			var x = !isUndo ? x : prevX;
+			var y = !isUndo ? y : prevY;
+			var box = boxes[id];
+			Box.tmpPoint.set(x,y);
+			box.node.setPos(Box.tmpPoint);
+			moveBox(box, x, y);
+		}
+		exec(false);
+		undoBuffer.push(exec);
+	}
+
+	public function opResize(box: Box, w: Float, h: Float, undoBuffer: UndoBuffer) {
+		box.info.comment.getSize(Box.tmpPoint);
+		var id = box.node.getId();
+		var prevW = Box.tmpPoint.x;
+		var prevH = Box.tmpPoint.y;
+		function exec(isUndo : Bool) {
+			var box = boxes.get(id);
+			var vw = !isUndo ? w : prevW;
+			var vh = !isUndo ? h : prevH;
+			Box.tmpPoint.set(vw, vh);
+			box.info.comment.setSize(Box.tmpPoint);
+			box.width = Std.int(vw);
+			box.height = Std.int(vh);
+			box.refreshBox();
+		}
+
+		exec(false);
+		undoBuffer.push(exec);
+	}
+
 	function opSelect(id: Int, doSelect: Bool, undoBuffer: UndoBuffer) {
 		var exec = function(isUndo: Bool) {
 			if (!doSelect) isUndo = !isUndo;
@@ -575,7 +612,7 @@ class GraphEditor extends hide.comp.Component {
 				var box = boxes[instance.getId()];
 				var x = (fromInput ? @:privateAccess box.width : 0) - Box.NODE_RADIUS;
 				var y = box.getNodeHeight(0) - Box.NODE_RADIUS;
-				moveBox(boxes[instance.getId()], pos.x - x, pos.y - y);
+				opMove(boxes[instance.getId()], pos.x - x, pos.y - y, currentUndoBuffer);
 				opEdge(createLinkOutput, createLinkInput, true, currentUndoBuffer);
 			}
 
@@ -723,8 +760,7 @@ class GraphEditor extends hide.comp.Component {
 
 			for (id => _  in boxesToMove) {
 				var b = boxes.get(id);
-				b.node.getPos(Box.tmpPoint);
-				moveBox(b, Box.tmpPoint.x + dx, Box.tmpPoint.y + dy);
+				moveBox(b, b.x + dx, b.y + dy);
 			}
 			lastClickDrag.x = lX(clientX);
 			lastClickDrag.y = lY(clientY);
@@ -781,8 +817,6 @@ class GraphEditor extends hide.comp.Component {
 				}
 			}
 		}
-
-		undoSave = saveMovedBoxes();
 	}
 
 	function saveMovedBoxes() {
@@ -801,33 +835,14 @@ class GraphEditor extends hide.comp.Component {
 
 		lastClickDrag = null;
 
-		if (undoSave != null) {
-			var before : Map<Int, {x: Float, y: Float}> = undoSave;
-			var after : Map<Int, {x: Float, y: Float}> = saveMovedBoxes();
-
-			var hasChanged = false;
-
-			for (id => dataBefore in before) {
-				var dataAfter = after.get(id);
-				if (dataAfter == null)
-					throw "what";
-				if (dataBefore.x != dataAfter.x || dataBefore.y != dataAfter.y) {
-					hasChanged = true;
-					break;
-				}
-			}
-
-			if (hasChanged) {
-				editor.getUndo().change(Custom(function(undo) {
-					var toApply = undo ? before : after;
-					for (id => pos in toApply) {
-						moveBox(boxes[id], pos.x ,pos.y);
-					}
-				}));
-				undoSave = null;
+		for (id => _ in boxesToMove) {
+			for (id => _ in boxesToMove) {
+				var b = boxes[id];
+				opMove(b, b.x, b.y, currentUndoBuffer);
 			}
 		}
 
+		commitUndo();
 		boxesToMove = [];
 	}
 
@@ -972,6 +987,8 @@ class GraphEditor extends hide.comp.Component {
 		undoBuffer.push(exec);
 	}
 
+
+
 	function opEdge(output: Int, input: Int, doAdd: Bool, undoBuffer: UndoBuffer) : Void {
 		var edge = edgeFromPack(output, input);
 		var previousFrom : Null<Int> = outputsToInputs.getLeft(input);

+ 7 - 18
hide/view/shadereditor/Box.hx

@@ -20,6 +20,8 @@ class Box {
 	var node : IGraphNode;
 	var info : GraphNodeInfo;
 
+	var x : Float;
+	var y : Float;
 	var width : Int;
 	var height : Int;
 	var propsHeight : Int = 0;
@@ -37,7 +39,6 @@ class Box {
 	var hasHeader : Bool = true;
 	var color : String;
 	var closePreviewBtn : JQuery;
-	var resizeSave = {x:0.0,y:0.0, w:0.0, h:0.0};
 
 	var element : JQuery;
 	var propertiesGroup : JQuery;
@@ -93,9 +94,6 @@ class Box {
 					e.preventDefault();
 					pressed = true;
 					elt.setPointerCapture(e.pointerId);
-
-					this.node.getPos(tmpPoint);
-					resizeSave = {x: tmpPoint.x, y:tmpPoint.y, w: this.width, h: this.height};
 				};
 
 				elt.onpointermove = function(e: js.html.PointerEvent) {
@@ -136,8 +134,6 @@ class Box {
 
 					this.width = x1 - x0;
 					this.height = y1 - y0;
-					tmpPoint.set(this.width, this.height);
-					info.comment.setSize(tmpPoint);
 					refreshBox();
 				}
 
@@ -148,18 +144,11 @@ class Box {
 					e.stopPropagation();
 					e.preventDefault();
 
-					var save = resizeSave;
-
 					this.node.getPos(tmpPoint);
 					var current = {x: tmpPoint.x, y:tmpPoint.y, w: this.width, h: this.height};
-					function exec(undo : Bool) {
-						var toApply = undo ? save : current;
-						setPosition(toApply.x, toApply.y);
-						tmpPoint.set(toApply.w, toApply.h);
-						info.comment.setSize(tmpPoint);
-					}
-					editor.editor.getUndo().change(Custom(exec));
-					elt.releasePointerCapture(e.pointerId);
+					editor.opMove(this, this.x, this.y, editor.currentUndoBuffer);
+					editor.opResize(this, this.width, this.height, editor.currentUndoBuffer);
+					editor.commitUndo();
 				};
 			}
 
@@ -417,8 +406,8 @@ class Box {
 	public static var tmpPoint = new h2d.col.Point();
 	public function setPosition(x : Float, y : Float) {
 		element.attr({transform: 'translate(${x} ${y})'});
-		tmpPoint.set(x,y);
-		node.setPos(tmpPoint);
+		this.x = x;
+		this.y = y;
 	}
 
 	public function setSelected(b : Bool) {