Allow restoring removed elements one by one

Former-commit-id: 81ecad4265db1bd7dc70b3998c825aaac3896708

extension/ui/bg/ui-editor.js

@@ -41,6 +41,7 @@ singlefile.extension.ui.bg.editor = (() => {
 	const editPageButton = document.querySelector(".edit-page-button");
 	const cutPageButton = document.querySelector(".cut-page-button");
 	const undoCutPageButton = document.querySelector(".undo-cut-page-button");
+	const undoAllCutPageButton = document.querySelector(".undo-all-cut-page-button");
 	const savePageButton = document.querySelector(".save-page-button");
 
 	let tabData;
@@ -59,6 +60,7 @@ singlefile.extension.ui.bg.editor = (() => {
 	editPageButton.title = browser.i18n.getMessage("editorEditPage");
 	cutPageButton.title = browser.i18n.getMessage("editorCutPage");
 	undoCutPageButton.title = browser.i18n.getMessage("editorUndoCutPage");
+	undoAllCutPageButton.title = browser.i18n.getMessage("editorUndoAllCutPage");
 	savePageButton.title = browser.i18n.getMessage("editorSavePage");
 
 	addYellowNoteButton.onclick = () => editorElement.contentWindow.postMessage(JSON.stringify({ method: "addNote", color: "note-yellow" }), "*");
@@ -153,6 +155,9 @@ singlefile.extension.ui.bg.editor = (() => {
 	undoCutPageButton.onclick = () => {
 		editorElement.contentWindow.postMessage(JSON.stringify({ method: "undoCutPage" }), "*");
 	};
+	undoAllCutPageButton.onclick = () => {
+		editorElement.contentWindow.postMessage(JSON.stringify({ method: "undoAllCutPage" }), "*");
+	};
 	savePageButton.onclick = () => {
 		savePage();
 	};

extension/ui/content/content-ui-editor-web.js

@@ -54,6 +54,7 @@
 
 	let NOTES_WEB_STYLESHEET, MASK_WEB_STYLESHEET, HIGHLIGHTS_WEB_STYLESHEET;
 	let selectedNote, anchorElement, maskNoteElement, maskPageElement, highlightSelectionMode, removeHighlightMode, resizingNoteMode, movingNoteMode, highlightColor, collapseNoteTimeout, cuttingMode;
+	let removedElements = [];
 
 	window.onmessage = async event => {
 		const message = JSON.parse(event.data);
@@ -128,9 +129,13 @@
 			document.body.removeEventListener ("mouseout", cutter);
 		}
 		if (message.method == "undoCutPage" ) {
-			var removedElements = document.getElementsByClassName("single-file-removed");
+			if (removedElements.length) {
+				removedElements.pop().classList.remove ("single-file-removed");
+			}
+		}
+		if (message.method == "undoAllCutPage" ) {
 			while (removedElements.length) {
-				removedElements[0].classList.remove ("single-file-removed");
+				removedElements.pop().classList.remove ("single-file-removed");
 			}
 		}
 		if (message.method == "getContent") {
@@ -426,6 +431,7 @@
 		if (cuttingMode) {
 			let element = event.target;
 			element.classList.add ("single-file-removed");
+			removedElements.push(element);
 		}
 	}
 

extension/ui/editor/editor.html

@@ -35,8 +35,12 @@
 			<img type="button" class="remove-highlight-button remove-highlight-disabled"
 				src="/extension/ui/resources/button_highlighter_delete.png">
 			<img type="button" class="edit-page-button edit-disabled" src="/extension/ui/resources/button_note_edit.png">
+			<div class="separator"></div>
+		</div>
+		<div class="buttons">
 			<img type="button" class="cut-page-button cut-disabled" src="/extension/ui/resources/button_cut.png">
 			<img type="button" class="undo-cut-page-button" src="/extension/ui/resources/button_undo_cut.png">
+			<img type="button" class="undo-all-cut-page-button" src="/extension/ui/resources/button_undo_all_cut.png">
 			<div class="separator"></div>
 		</div>
 		<div class="buttons">