moved UI-related code into content-ui

extension/core/content/content.js

@@ -18,7 +18,7 @@
  *   along with SingleFile.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-/* global browser, SingleFileBrowser, singlefile, frameTree, document, Blob, MouseEvent, getSelection, prompt, addEventListener, Node, window, lazyLoader, URL, timeout */
+/* global browser, SingleFileBrowser, singlefile, frameTree, document, Blob, MouseEvent, addEventListener, window, lazyLoader, URL, timeout */
 
 this.singlefile.top = this.singlefile.top || (() => {
 
@@ -48,7 +48,7 @@ this.singlefile.top = this.singlefile.top || (() => {
 		if (!processing && !options.frameId) {
 			let selectionFound;
 			if (options.selected) {
-				selectionFound = await markSelection();
+				selectionFound = await singlefile.ui.markSelection();
 			}
 			if (!options.selected || selectionFound) {
 				processing = true;
@@ -66,20 +66,6 @@ this.singlefile.top = this.singlefile.top || (() => {
 		}
 	}
 
-	async function markSelection() {
-		let selectionFound = markSelectedContent();
-		if (selectionFound) {
-			return selectionFound;
-		} else {
-			const selectedArea = await singlefile.ui.getSelectedArea();
-			if (selectedArea) {
-				markSelectedArea(selectedArea);
-				selectionFound = true;
-			}
-			return selectionFound;
-		}
-	}
-
 	async function processPage(options) {
 		singlefile.ui.onStartPage();
 		const processor = new SingleFile(options);
@@ -142,11 +128,11 @@ this.singlefile.top = this.singlefile.top || (() => {
 		await processor.initialize();
 		await processor.run();
 		if (options.confirmInfobar) {
-			options.infobarContent = prompt("Infobar content", options.infobarContent) || "";
+			options.infobarContent = singlefile.ui.prompt("Infobar content", options.infobarContent) || "";
 		}
 		const page = await processor.getPageData();
 		if (options.selected) {
-			unmarkSelectedContent();
+			singlefile.ui.unmarkSelection();
 		}
 		page.url = URL.createObjectURL(new Blob([page.content], { type: "text/html" }));
 		if (options.shadowEnabled) {
@@ -159,39 +145,6 @@ this.singlefile.top = this.singlefile.top || (() => {
 		return page;
 	}
 
-	function markSelectedContent() {
-		const selection = getSelection();
-		const range = selection.rangeCount ? selection.getRangeAt(0) : null;
-		let selectionFound = false;
-		if (range && range.commonAncestorContainer) {
-			const treeWalker = document.createTreeWalker(range.commonAncestorContainer);
-			const ancestorElement = range.commonAncestorContainer != Node.ELEMENT_NODE ? range.commonAncestorContainer.parentElement : range.commonAncestorContainer;
-			while (treeWalker.nextNode() && treeWalker.currentNode != range.endContainer) {
-				if (treeWalker.currentNode == range.startContainer) {
-					selectionFound = true;
-				}
-				if (selectionFound) {
-					const element = treeWalker.currentNode.nodeType == Node.ELEMENT_NODE ? treeWalker.currentNode : treeWalker.currentNode.parentElement;
-					element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, "");
-				}
-			}
-			if (selectionFound) {
-				ancestorElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
-			}
-		}
-		return selectionFound;
-	}
-
-	function markSelectedArea(selectedAreaElement) {
-		selectedAreaElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
-		selectedAreaElement.querySelectorAll("*").forEach(element => element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, ""));
-	}
-
-	function unmarkSelectedContent() {
-		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME));
-		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME));
-	}
-
 	async function downloadPage(page, options) {
 		if (options.backgroundSave) {
 			const response = await browser.runtime.sendMessage({ download: true, url: page.url, confirmFilename: options.confirmFilename, conflictAction: options.conflictAction, filename: page.filename });
@@ -210,7 +163,7 @@ this.singlefile.top = this.singlefile.top || (() => {
 
 	function downloadPageFallback(page, options) {
 		if (options.confirmFilename) {
-			page.filename = prompt("File name", page.filename);
+			page.filename = singlefile.ui.prompt("File name", page.filename);
 		}
 		if (page.filename && page.filename.length) {
 			const link = document.createElement("a");

extension/ui/content/content-ui.js

@@ -18,10 +18,12 @@
  *   along with SingleFile.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-/* global browser, document, getComputedStyle, addEventListener, removeEventListener, requestAnimationFrame, setTimeout */
+/* global SingleFileBrowser, browser, document, prompt, getComputedStyle, addEventListener, removeEventListener, requestAnimationFrame, setTimeout, getSelection, Node */
 
 this.singlefile.ui = this.singlefile.ui || (() => {
 
+	const SingleFile = SingleFileBrowser.getClass();
+
 	const MASK_TAGNAME = "singlefile-mask";
 	const PROGRESS_BAR_TAGNAME = "singlefile-progress-bar";
 	const PROGRESS_CURSOR_TAGNAME = "singlefile-progress-cursor";
@@ -39,7 +41,11 @@ this.singlefile.ui = this.singlefile.ui || (() => {
 	Array.from(getComputedStyle(document.body)).forEach(property => allProperties.add(property));
 
 	return {
-		getSelectedArea,
+		markSelection,
+		unmarkSelection,
+		prompt(message, defaultValue) {
+			return prompt(message, defaultValue);
+		},
 		onStartPage() {
 			let maskElement = document.querySelector(MASK_TAGNAME);
 			if (!maskElement) {
@@ -96,6 +102,53 @@ this.singlefile.ui = this.singlefile.ui || (() => {
 		onEndStageTask() { }
 	};
 
+	async function markSelection() {
+		let selectionFound = markSelectedContent();
+		if (selectionFound) {
+			return selectionFound;
+		} else {
+			const selectedArea = await getSelectedArea();
+			if (selectedArea) {
+				markSelectedArea(selectedArea);
+				selectionFound = true;
+			}
+			return selectionFound;
+		}
+	}
+
+	function markSelectedContent() {
+		const selection = getSelection();
+		const range = selection.rangeCount ? selection.getRangeAt(0) : null;
+		let selectionFound = false;
+		if (range && range.commonAncestorContainer) {
+			const treeWalker = document.createTreeWalker(range.commonAncestorContainer);
+			const ancestorElement = range.commonAncestorContainer != Node.ELEMENT_NODE ? range.commonAncestorContainer.parentElement : range.commonAncestorContainer;
+			while (treeWalker.nextNode() && treeWalker.currentNode != range.endContainer) {
+				if (treeWalker.currentNode == range.startContainer) {
+					selectionFound = true;
+				}
+				if (selectionFound) {
+					const element = treeWalker.currentNode.nodeType == Node.ELEMENT_NODE ? treeWalker.currentNode : treeWalker.currentNode.parentElement;
+					element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, "");
+				}
+			}
+			if (selectionFound) {
+				ancestorElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
+			}
+		}
+		return selectionFound;
+	}
+
+	function markSelectedArea(selectedAreaElement) {
+		selectedAreaElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
+		selectedAreaElement.querySelectorAll("*").forEach(element => element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, ""));
+	}
+
+	function unmarkSelection() {
+		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME));
+		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME));
+	}
+
 	function getSelectedArea() {
 		return new Promise(resolve => {
 			addEventListener("mousemove", mousemoveListener, true);