From 9936faf46997bf09979d6fee02579a7cf7a28166 Mon Sep 17 00:00:00 2001 From: Jean-Benoist Leger Date: Fri, 17 Apr 2020 17:37:19 +0000 Subject: [PATCH 1/3] Add redo method. Closes #14 --- public/js/keybinds.js | 1 + public/js/main.js | 1 + public/js/whiteboard.js | 38 +++++++++++++++++++++++++++++++++++++- 3 files changed, 39 insertions(+), 1 deletion(-) diff --git a/public/js/keybinds.js b/public/js/keybinds.js index 108b36b..74c0e59 100644 --- a/public/js/keybinds.js +++ b/public/js/keybinds.js @@ -9,6 +9,7 @@ var keybinds = { // 'key(s)' : 'function', 'defmod-shift-z' : 'clearWhiteboard', 'defmod-z' : 'undoStep', + 'defmod-shift-z' : 'redoStep', 'defmod-x' : 'setTool_recSelect', 'defmod-m' : 'setTool_mouse', 'defmod-p' : 'setTool_pen', diff --git a/public/js/main.js b/public/js/main.js index 00b1fc3..a8b97de 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -101,6 +101,7 @@ $(document).ready(function () { var shortcutFunctions = { clearWhiteboard: function () { whiteboard.clearWhiteboard(); }, undoStep: function () { whiteboard.undoWhiteboardClick(); }, + redoStep: function () { whiteboard.redoWhiteboardClick(); }, setTool_mouse: function () { $(".whiteboardTool[tool=mouse]").click(); }, setTool_recSelect: function () { $(".whiteboardTool[tool=recSelect]").click(); }, setTool_pen: function () { diff --git a/public/js/whiteboard.js b/public/js/whiteboard.js index 4a2fe50..842f203 100644 --- a/public/js/whiteboard.js +++ b/public/js/whiteboard.js @@ -24,7 +24,8 @@ var whiteboard = { svgRect: null, svgCirle: null, drawBuffer: [], - drawId: 0, //Used for undo function + undoBuffer: [], + drawId: 0, //Used for undo/redo functions imgDragActive: false, latestActiveTextBoxId: false, //The id of the latest clicked Textbox (for font and color change) pressedKeys: {}, @@ -531,6 +532,7 @@ var whiteboard = { _this.textContainer.empty(); _this.sendFunction({ "t": "clear" }); _this.drawBuffer = []; + _this.undoBuffer = []; _this.drawId = 0; }, setStrokeThickness(thickness) { @@ -687,12 +689,39 @@ var whiteboard = { var drawId = _this.drawBuffer[i]["drawId"]; for (var i = _this.drawBuffer.length - 1; i >= 0; i--) { if (_this.drawBuffer[i]["drawId"] == drawId && _this.drawBuffer[i]["username"] == username) { + _this.undoBuffer.push(_this.drawBuffer[i]) _this.drawBuffer.splice(i, 1); } } break; } } + if (_this.undoBuffer.length > 1000) { + _this.undoBuffer.splice(0, _this.undoBuffer.length-1000); + } + _this.canvas.height = _this.canvas.height; + _this.imgContainer.empty(); + _this.loadDataInSteps(_this.drawBuffer, false, function (stepData) { + //Nothing to do + }); + }, + redoWhiteboard: function (username) { //Not call this directly because you will get out of sync whit others... + var _this = this; + if (!username) { + username = _this.settings.username; + } + for (var i = _this.undoBuffer.length - 1; i >= 0; i--) { + if (_this.undoBuffer[i]["username"] == username) { + var drawId = _this.undoBuffer[i]["drawId"]; + for (var i = _this.undoBuffer.length - 1; i >= 0; i--) { + if (_this.undoBuffer[i]["drawId"] == drawId && _this.undoBuffer[i]["username"] == username) { + _this.drawBuffer.push(_this.undoBuffer[i]) + _this.undoBuffer.splice(i, 1); + } + } + break; + } + } _this.canvas.height = _this.canvas.height; _this.imgContainer.empty(); _this.loadDataInSteps(_this.drawBuffer, false, function (stepData) { @@ -703,6 +732,10 @@ var whiteboard = { this.sendFunction({ "t": "undo" }); this.undoWhiteboard(); }, + redoWhiteboardClick: function () { + this.sendFunction({ "t": "redo" }); + this.redoWhiteboard(); + }, setTool: function (tool) { this.tool = tool; if (this.tool === "text") { @@ -778,6 +811,7 @@ var whiteboard = { _this.imgContainer.empty(); _this.textContainer.empty(); _this.drawBuffer = []; + _this.undoBuffer = []; _this.drawId = 0; } else if (tool === "cursor" && _this.settings) { if (content["event"] === "move") { @@ -793,6 +827,8 @@ var whiteboard = { } } else if (tool === "undo") { _this.undoWhiteboard(username); + } else if (tool === "redo") { + _this.redoWhiteboard(username); } }); From 3c92ea5f08302ac55ce085cb59c09d0c4e3bc2d9 Mon Sep 17 00:00:00 2001 From: Jean-Benoist Leger Date: Fri, 17 Apr 2020 17:47:19 +0000 Subject: [PATCH 2/3] Add redo button --- public/index.html | 3 +++ public/js/main.js | 5 +++++ 2 files changed, 8 insertions(+) diff --git a/public/index.html b/public/index.html index c2200cb..b0c4f13 100644 --- a/public/index.html +++ b/public/index.html @@ -54,6 +54,9 @@ +
diff --git a/public/js/main.js b/public/js/main.js index a8b97de..ac8f387 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -256,6 +256,11 @@ $(document).ready(function () { whiteboard.undoWhiteboardClick(); }); + // redo button + $("#whiteboardRedoBtn").click(function () { + whiteboard.redoWhiteboardClick(); + }); + // switch tool $(".whiteboardTool").click(function () { $(".whiteboardTool").removeClass("active"); From 89ea6f030867fafa91eab912854528b59aaadf69 Mon Sep 17 00:00:00 2001 From: Jean-Benoist Leger Date: Fri, 17 Apr 2020 17:48:35 +0000 Subject: [PATCH 3/3] Add redo shortcut in README --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 34d6e17..c920edb 100644 --- a/README.md +++ b/README.md @@ -43,6 +43,7 @@ Result | Windows and Linux | macOS ------ | -------------------- | ------- Clear the whiteboard | Ctrl + Shift + Z | Command + Shift + Z Undo your last step | Ctrl + Z | Command + Z +Redo your last undo | Ctrl + Shift + Z | Command + + Shift + Z Select an area | Ctrl + X | Command + X Take the mouse | Ctrl + M | Command + M Take the pen | Ctrl + P | Command + P