Merge pull request #29 from alteist/close-tabs-after-saving-link

Add close tabs link in toast message after saving window's tabs

background.js

@@ -4,6 +4,8 @@ chrome.commands.onCommand.addListener(async function (command) {
         await saveSelection();
     } else if (command == "saveWholePage") {
         await saveWholePage();
+    } else if (command == "saveTabs") {
+        await saveTabs();
     } else if (command == "saveScreenshot") {
         const activeTab = await getActiveTab();
 
@@ -100,6 +102,14 @@ async function getActiveTab() {
 	return tabs[0];
 }
 
+async function getWindowTabs() {
+	const tabs = await browser.tabs.query({
+		currentWindow: true
+	});
+
+	return tabs;
+}
+
 async function sendMessageToActiveTab(message) {
 	const activeTab = await getActiveTab();
 
@@ -115,11 +125,12 @@ async function sendMessageToActiveTab(message) {
 	}
 }
 
-function toast(message, noteId = null) {
+function toast(message, noteId = null, tabIds = null) {
 	sendMessageToActiveTab({
 		name: 'toast',
 		message: message,
-		noteId: noteId
+		noteId: noteId,
+		tabIds: tabIds
 	});
 }
 
@@ -253,6 +264,50 @@ async function saveNote(title, content) {
 	return true;
 }
 
+async function getTabsPayload(tabs) {
+	let content = '<ul>';
+	tabs.forEach(tab => {
+		content += `<li><a href="${tab.url}">${tab.title}</a></li>`
+	});
+	content += '</ul>';
+
+	const domainsCount = tabs.map(tab => tab.url)
+		.reduce((acc, url) => {
+			const hostname = new URL(url).hostname
+			return acc.set(hostname, (acc.get(hostname) || 0) + 1)
+		}, new Map());
+
+	let topDomains = [...domainsCount]
+		.sort((a, b) => {return b[1]-a[1]})
+		.slice(0,3)
+		.map(domain=>domain[0])
+		.join(', ')
+
+	if (tabs.length > 3) { topDomains += '...' }
+
+	return {
+		title: `${tabs.length} browser tabs: ${topDomains}`,
+		content: content,
+		clipType: 'tabs'
+	};
+}
+
+async function saveTabs() {
+	const tabs = await getWindowTabs();
+
+	const payload = await getTabsPayload(tabs);
+
+	const resp = await triliumServerFacade.callService('POST', 'notes', payload);
+
+	if (!resp) {
+		return;
+	}
+
+	const tabIds = tabs.map(tab=>{return tab.id});
+
+	toast(`${tabs.length} links have been saved to Trilium.`, resp.noteId, tabIds);
+}
+
 browser.contextMenus.onClicked.addListener(async function(info, tab) {
 	if (info.menuItemId === 'trilium-save-selection') {
 		await saveSelection();
@@ -319,6 +374,9 @@ browser.runtime.onMessage.addListener(async request => {
 			}
 		}
 	}
+	else if (request.name === 'closeTabs') {
+		return await browser.tabs.remove(request.tabIds)
+	}
 	else if (request.name === 'load-script') {
 		return await browser.tabs.executeScript({file: request.file});
 	}
@@ -333,6 +391,9 @@ browser.runtime.onMessage.addListener(async request => {
 	else if (request.name === 'save-note') {
 		return await saveNote(request.title, request.content);
 	}
+	else if (request.name === 'save-tabs') {
+		return await saveTabs();
+	}
 	else if (request.name === 'trigger-trilium-search') {
 		triliumServerFacade.triggerSearchForTrilium();
 	}

content.js

@@ -209,6 +209,18 @@ function getImages(container) {
 	return images;
 }
 
+function createLink(clickAction, text, color = "lightskyblue") {
+	const link = document.createElement('a');
+	link.href = "javascript:";
+	link.style.color = color;
+	link.appendChild(document.createTextNode(text));
+	link.addEventListener("click", () => {
+		browser.runtime.sendMessage(null, clickAction)
+	});
+
+	return link
+}
+
 async function prepareMessageResponse(message) {
 	console.info('Message: ' + message.name);
 
@@ -216,21 +228,23 @@ async function prepareMessageResponse(message) {
 		let messageText;
 
 		if (message.noteId) {
-			messageText = document.createElement('span');
+			messageText = document.createElement('p');
+			messageText.setAttribute("style", "padding: 0; margin: 0")
 			messageText.appendChild(document.createTextNode(message.message + " "));
+			messageText.appendChild(createLink(
+				{name: 'openNoteInTrilium', noteId: message.noteId},
+				"Open in Trilium."
+			));
 
-			const link = document.createElement('a');
+			// only after saving tabs
-			link.href = "javascript:";
+			if (message.tabIds) {
-			link.style.color = "lightskyblue";
+				messageText.appendChild(document.createElement("br"));
-			link.appendChild(document.createTextNode("Open in Trilium."));
+				messageText.appendChild(createLink(
-			link.addEventListener("click", () => {
+					{name: 'closeTabs', tabIds: message.tabIds},
-				browser.runtime.sendMessage(null, {
+					"Close saved tabs.",
-					name: 'openNoteInTrilium',
+					"tomato"
-					noteId: message.noteId
+				));
-				})
+			}
-			});
-
-			messageText.appendChild(link);
 		}
 		else {
 			messageText = message.message;
@@ -304,4 +318,4 @@ async function requireLib(libPath) {
 
 		await browser.runtime.sendMessage({name: 'load-script', file: libPath});
 	}
-}
+}

popup/popup.html

@@ -21,6 +21,7 @@
   <button class="button full needs-connection" id="clip-screenshot-button">Clip screenshot</button>
   <button class="button full needs-connection" id="save-whole-page-button">Save whole page</button>
   <button class="button full needs-connection" id="create-text-note-button">Create text note</button>
+  <button class="button full needs-connection" id="save-tabs-button">Save window's tabs as a list</button>
 
   <div id="create-text-note-wrapper">
     <textarea id="create-text-note-textarea" rows="5"></textarea>
@@ -43,4 +44,4 @@
   <script src="popup.js"></script>
 </body>
 
-</html>
+</html>

popup/popup.js

@@ -12,6 +12,7 @@ async function sendMessage(message) {
 const $showOptionsButton = $("#show-options-button");
 const $clipScreenShotButton = $("#clip-screenshot-button");
 const $saveWholePageButton = $("#save-whole-page-button");
+const $saveTabsButton = $("#save-tabs-button");
 
 $showOptionsButton.on("click", () => browser.runtime.openOptionsPage());
 
@@ -19,6 +20,8 @@ $clipScreenShotButton.on("click", () => sendMessage({name: 'save-screenshot'}));
 
 $saveWholePageButton.on("click", () => sendMessage({name: 'save-whole-page'}));
 
+$saveTabsButton.on("click", () => sendMessage({name: 'save-tabs'}));
+
 const $createTextNoteWrapper = $("#create-text-note-wrapper");
 const $textNote = $("#create-text-note-textarea");
 
@@ -141,4 +144,4 @@ $checkConnectionButton.on("click", () => {
     })
 });
 
-$(() => browser.runtime.sendMessage({name: "send-trilium-search-status"}));
+$(() => browser.runtime.sendMessage({name: "send-trilium-search-status"}));