Minor 1.9 (#43 )

- Now you can close the panel by clicking outside of it (#40) - Added ability to move only selected tabs aside (#19) - Context menu entries removed from pages' context menu (#41) - After update extension now will open GitHub Releases page with the latest version - Minor performance improvements Co-authored-by: Amine A. <15179425+AmineI@users.noreply.github.com> Co-Authored-By: Michael Gordeev <michael@xfox111.net>
2026-07-02 19:52:47 +03:00 · 2020-09-12 22:45:39 +03:00
6 changed files with 121 additions and 72 deletions
@@ -31,6 +31,7 @@ Unfortunately, in new Chromium-based Microsoft Edge, the devs decided not to imp
 - Auto Dark mode
 - Now you can restore one tab from collection without removing
 - Now you can choose if you want to load restored tabs only when you're navigating onto them
+- Set tabs you've selected aside
 - **Now available for Firefox!**

 ## Download
@@ -15,6 +15,7 @@

 <body>
 	<div class="tabsAside background">
+		<div class="tabsAside closeArea"></div>
 		<aside class="tabsAside pane">
 			<header>
 				<h1 loc="name">Tabs aside</h1>
@@ -10,6 +10,17 @@
 	color: black;
 }

+.tabsAside.closeArea
+{
+	position: fixed;
+	top: 0;
+	bottom: 0;
+	right: 0;
+	left: 0;
+
+	background-color: transparent;
+}
+
 .tabsAside.pane
 {
 	user-select: none;
@@ -74,6 +74,9 @@ function Initialize()
 	document.querySelector(".tabsAside header .btn.remove").addEventListener("click", () =>
 		chrome.runtime.sendMessage({ command: "togglePane" })
 	);
+	document.querySelector(".tabsAside.closeArea").addEventListener("click", () =>
+		chrome.runtime.sendMessage({ command: "togglePane" })
+	);

 	document.querySelector("nav > p > small").textContent = chrome.runtime.getManifest()["version"];

@@ -1,3 +1,21 @@
+//This variable is populated when the browser action icon is clicked, or a command is called (with a shortcut for example).
+//We can't populate it later, as selected tabs get deselected on a click inside a tab.
+var tabsToSave = [];
+
+
+//Get the tabs to save, either all the window or the selected tabs only, and pass them through a callback.
+function GetTabsToSave(callback)
+{
+		chrome.tabs.query({ currentWindow: true }, (windowTabs) =>
+		{
+			var highlightedTabs = windowTabs.filter(item => item.highlighted);
+			//If there are more than one selected tab in the window, we set only those aside.
+			// Otherwise, all the window's tabs get saved.
+			return callback((highlightedTabs.length > 1 ? highlightedTabs : windowTabs));
+		});
+
+}
+
 function TogglePane(tab)
 {
 	if (tab.url.startsWith("http")
@@ -43,50 +61,43 @@ function TogglePane(tab)

 function ProcessCommand(command)
 {
-	switch(command)
+	GetTabsToSave((returnedTabs) =>
 	{
-		case "set-aside":
-			SaveCollection();
-			break;
-		case "toggle-pane":
-			chrome.tabs.query(
-				{
-					active: true,
-					currentWindow: true
-				},
-				(tabs) => TogglePane(tabs[0])
-			)
-			break;
-	}
+		tabsToSave = returnedTabs;
+		switch(command)
+		{
+			case "set-aside":
+				SaveCollection();
+				break;
+			case "toggle-pane":
+				chrome.tabs.query(
+					{
+						active: true,
+						currentWindow: true
+					},
+					(tabs) => TogglePane(tabs[0])
+				)
+				break;
+		}
+	});
 }

 chrome.browserAction.onClicked.addListener((tab) =>
 {
-	chrome.storage.sync.get({ "setAsideOnClick": false }, values =>
+	GetTabsToSave((returnedTabs) =>
 	{
-		if (values?.setAsideOnClick)
-			SaveCollection();
-		else
-			TogglePane(tab);
+		tabsToSave = returnedTabs;
+
+		chrome.storage.sync.get({ "setAsideOnClick": false }, values =>
+		{
+			if (values?.setAsideOnClick)
+				SaveCollection();
+			else
+				TogglePane(tab);
+		});
 	});
 });

-// Adding context menu options
-chrome.contextMenus.create(
-	{
-		id: "toggle-pane",
-		contexts: ['all'],
-		title: chrome.i18n.getMessage("togglePaneContext")
-	}
-);
-chrome.contextMenus.create(
-	{
-		id: "set-aside",
-		contexts: ['all'],
-		title: chrome.i18n.getMessage("setAside")
-	}
-);
-
 var collections = JSON.parse(localStorage.getItem("sets")) || [];
 var shortcuts;
 chrome.commands.getAll((commands) => shortcuts = commands);
@@ -94,6 +105,27 @@ chrome.commands.getAll((commands) => shortcuts = commands);
 chrome.commands.onCommand.addListener(ProcessCommand);
 chrome.contextMenus.onClicked.addListener((info) => ProcessCommand(info.menuItemId));

+chrome.runtime.onInstalled.addListener((reason) => 
+{
+	chrome.tabs.create({ url: "https://github.com/XFox111/TabsAsideExtension/releases/latest" });
+	// Adding context menu options
+	chrome.contextMenus.create(
+		{
+			id: "toggle-pane",
+			contexts: ["browser_action"],
+			title: chrome.i18n.getMessage("togglePaneContext")
+		}
+	);
+	chrome.contextMenus.create(
+		{
+			id: "set-aside",
+			contexts: ["browser_action"],
+			title: chrome.i18n.getMessage("setAside")
+		}
+	);
+});
+
+//We receive a message from the pane aside-script, which means the tabsToSave are already assigned on message reception.
 chrome.runtime.onMessage.addListener((message, sender, sendResponse) =>
 {
 	switch (message.command)
@@ -172,48 +204,45 @@ chrome.tabs.onActivated.addListener(UpdateTheme);
 // Set current tabs aside
 function SaveCollection()
 {
-	chrome.tabs.query({ currentWindow: true }, (rawTabs) =>
+	var tabs = tabsToSave.filter(i => i.url != chrome.runtime.getURL("TabsAside.html") && !i.pinned && !i.url.includes("//newtab") && !i.url.includes("about:blank") && !i.url.includes("about:home"));
+
+	if (tabs.length < 1)
 	{
-		var tabs = rawTabs.filter(i => i.url != chrome.runtime.getURL("TabsAside.html") && !i.pinned && !i.url.includes("//newtab") && !i.url.includes("about:blank") && !i.url.includes("about:home"));
+		alert(chrome.i18n.getMessage("noTabsToSave"));
+		return;
+	}

-		if (tabs.length < 1)
-		{
-			alert(chrome.i18n.getMessage("noTabsToSave"));
-			return;
-		}
+	var collection =
+	{
+		timestamp: Date.now(),
+		tabsCount: tabs.length,
+		titles: tabs.map(tab => tab.title ?? ""),
+		links: tabs.map(tab => tab.url ?? ""),
+		icons: tabs.map(tab => tab.favIconUrl ?? ""),
+		thumbnails: tabs.map(tab => thumbnails.find(i => i.tabId == tab.id)?.url ?? "")
+	};

-		var collection =
-		{
-			timestamp: Date.now(),
-			tabsCount: tabs.length,
-			titles: tabs.map(tab => tab.title ?? ""),
-			links: tabs.map(tab => tab.url ?? ""),
-			icons: tabs.map(tab => tab.favIconUrl ?? ""),
-			thumbnails: tabs.map(tab => thumbnails.find(i => i.tabId == tab.id)?.url ?? "")
-		};
+	var rawData;
+	if (localStorage.getItem("sets") === null)
+		rawData = [collection];
+	else
+	{
+		rawData = JSON.parse(localStorage.getItem("sets"));
+		rawData.unshift(collection);
+	}

-		var rawData;
-		if (localStorage.getItem("sets") === null)
-			rawData = [collection];
-		else
-		{
-			rawData = JSON.parse(localStorage.getItem("sets"));
-			rawData.unshift(collection);
-		}
+	localStorage.setItem("sets", JSON.stringify(rawData));

-		localStorage.setItem("sets", JSON.stringify(rawData));
+	collections = JSON.parse(localStorage.getItem("sets"));

-		collections = JSON.parse(localStorage.getItem("sets"));
-
-		var newTabId;
-		chrome.tabs.create({}, (tab) =>
-		{
-			newTabId = tab.id;
-			chrome.tabs.remove(rawTabs.filter(i => !i.pinned && i.id != newTabId).map(tab => tab.id));
-		});
-
-		UpdateTheme();
+	var newTabId;
+	chrome.tabs.create({}, (tab) =>
+	{
+		newTabId = tab.id;
+		chrome.tabs.remove(tabsToSave.filter(i => !i.pinned && i.id != newTabId).map(tab => tab.id));
 	});
+
+	UpdateTheme();
 }

 function DeleteCollection(collectionIndex)
@@ -251,6 +280,10 @@ function RestoreCollection(collectionIndex, removeCollection)
 			});
 	});

+	//We added new tabs by restoring a collection, so we refresh the array of tabs ready to be saved.
+	GetTabsToSave((returnedTabs) => 
+	tabsToSave = returnedTabs)
+
 	if (!removeCollection)
 		return;

@@ -334,4 +367,4 @@ chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) =>
 {
 	if (changeInfo.status === "complete")
 		AppendThumbnail(tabId, tab)
-});
+});
@@ -1,6 +1,6 @@
 {
 	"name": "__MSG_name__",
-	"version": "1.8.1",
+	"version": "1.9",
 	"manifest_version": 2,
 	"description": "__MSG_description__",
 	"author": "__MSG_author__",