Highlight windows when dragging detached tab

css/window.css

@@ -12,6 +12,21 @@
 	#page_wrapper.invisible {
 		visibility: hidden;
 	}
+	#page_wrapper.accept_detached_tab > * {
+		filter: brightness(0.4);
+	}
+	#page_wrapper.accept_detached_tab::after {
+		content: "+";
+		font-weight: 300;
+		font-size: 120px;
+		position: absolute;
+		margin: auto;
+		top: calc(50% - 100px);
+		right: -10px;
+		left: -10px;
+		width: 50px;
+		color: var(--color-text);
+	}
 	body {
 		background-image: url('../assets/logo_cutout.svg');
 		background-repeat: no-repeat;
@@ -548,7 +563,7 @@
 		margin-left: 2px;
 		border-top: 3px solid transparent;
 		left: 0;
-		--tabwidth: 202px;
+		--tabwidth: 242px;
 	}
 	#tab_bar.drag_mode .project_tab {
 		transition: left 100ms ease;

js/desktop.js

@@ -98,6 +98,9 @@ function loadOpenWithBlockbenchFile() {
 			ipcRenderer.send('close-detached-project', model.detached_window_id, model.detached_uuid);
 		}
 	})
+	ipcRenderer.on('accept-detached-tab', (event, value) => {
+		Interface.page_wrapper.classList.toggle('accept_detached_tab', value);
+	})
 	ipcRenderer.on('close-detached-project', (event, uuid) => {
 		let tab = ModelProject.all.find(project => project.uuid == uuid && project.detached);
 		if (tab) tab.close(true);

js/io/project.js

@@ -705,6 +705,8 @@ onVueSetup(() => {
 								document.body.removeChild(drag_out_window_helper);
 							}
 							tab_node.style.visibility = outside_tab_bar ? 'hidden' : 'visible';
+							ipcRenderer.send('dragging-tab', outside_tab_bar);
+
 						}
 						if (outside_tab_bar) {
 							drag_out_window_helper.style.left = `${e2.clientX}px`;
@@ -730,6 +732,7 @@ onVueSetup(() => {
 						let pos = currentwindow.getPosition()
 						project.detached_uuid = Project.uuid;
 						project.detached_window_id = currentwindow.id;
+						ipcRenderer.send('dragging-tab', false);
 						ipcRenderer.send('new-window', JSON.stringify(project), JSON.stringify({
 							offset: [
 								pos[0] + e2.clientX,
@@ -737,19 +740,8 @@ onVueSetup(() => {
 							]
 						}));
 						drag_out_window_helper.remove();
-						//setStartScreen(false);
 						tab_node.style.visibility = null;
-						//tab.select();
 						tab.detached = true;
-						/*Blockbench.showMessageBox({
-							title: 'Project detached',
-							message: 'The tab was moved to another window. Do you want to close it here?',
-							buttons: ['dialog.ok', 'dialog.cancel']
-						}, val => {
-							if (val == 0) {
-								tab.close(true)
-							}
-						})*/
 
 					} else if (active && !open_menu) {
 						convertTouchEvent(e2);

main.js

@@ -192,6 +192,12 @@ ipcMain.on('edit-launch-setting', (event, arg) => {
 ipcMain.on('add-recent-project', (event, path) => {
 	app.addRecentDocument(path);
 })
+ipcMain.on('dragging-tab', (event, value) => {
+	all_wins.forEach(win => {
+		if (win.isDestroyed() || win.id == event.sender.id) return;
+		win.webContents.send('accept-detached-tab', JSON.parse(value));
+	})
+})
 ipcMain.on('new-window', (event, data, position) => {
 	if (typeof data == 'string') load_project_data = JSON.parse(data);
 	if (position) {