BrowserView: Remove webview usage and initialize BrowserView.

Removes all instances of webview from main.ts and adds an initial working instance of BrowserView.
zulip · Jul 19, 2019 · 5fbc6ac · 5fbc6ac
1 parent 29bc1c0
commit 5fbc6ac
Show file tree

Hide file tree

Showing 5 changed files with 133 additions and 111 deletions.
diff --git a/app/main/index.ts b/app/main/index.ts
@@ -263,7 +263,7 @@ app.on('ready', () => {
 		page.send('toggle-autohide-menubar', showMenubar, true);
 	});
 
-	ipcMain.on('toggle-sidebar', () => {
+	ipcMain.on('fix-bounds', () => {
 		ViewManager.fixBounds();
 	});
 

diff --git a/app/main/view.ts b/app/main/view.ts
@@ -1,6 +1,6 @@
 'use strict';
 
-import { BrowserView } from 'electron';
+import { BrowserView, BrowserWindow } from 'electron';
 
 import ConfigUtil = require('../renderer/js/utils/config-util');
 const shouldSilentWebview = ConfigUtil.getConfigItem('silent');
@@ -17,7 +17,7 @@ export class View extends BrowserView {
 	index: number;
 	url: string;
 	zoomFactor: number;
-	loading: true;
+	loading: boolean;
 	badgeCount: number;
 	customCSS: boolean;
 
@@ -33,7 +33,7 @@ export class View extends BrowserView {
 		this.index = props.index;
 		this.url = props.url;
 		this.zoomFactor = 1.0;
-		this.loading = true;
+		this.loading = false;
 		this.badgeCount = 0;
 		this.customCSS = ConfigUtil.getConfigItem('customCSS');
 		this.registerListeners();
@@ -45,6 +45,34 @@ export class View extends BrowserView {
 				this.webContents.setAudioMuted(true);
 			});
 		}
+
+		this.webContents.addListener('did-navigate-in-page', () => {
+			const isSettingsPage = this.url.includes('renderer/preference.html');
+			if (isSettingsPage) {
+				return;
+			}
+			this.canGoBackButton();
+		});
+
+		this.webContents.addListener('did-navigate', () => {
+			this.canGoBackButton();
+		});
+
+		this.webContents.addListener('did-start-loading', () => {
+			const isSettingsPage = this.url.includes('renderer/preference.html');
+			if (!isSettingsPage) {
+				this.sendAction('switch-loading', true, this.url);
+			}
+		});
+
+		this.webContents.addListener('dom-ready', () => {
+			this.loading = false;
+			this.sendAction('switch-loading', false, this.url);
+		});
+
+		this.webContents.addListener('did-stop-loading', () => {
+			this.sendAction('switch-loading', false, this.url);
+		});
 	}
 
 	zoomIn(): void {
@@ -90,4 +118,22 @@ export class View extends BrowserView {
 	toggleDevTools(): void {
 		this.webContents.toggleDevTools();
 	}
+
+	canGoBackButton(): void {
+		if (this.webContents.canGoBack()) {
+			this.sendAction('switch-back', true);
+		} else {
+			this.sendAction('switch-back', false);
+		}
+	}
+
+	sendAction(action: any, ...params: any[]): void {
+		const win = BrowserWindow.getAllWindows()[0];
+
+		if (process.platform === 'darwin') {
+			win.restore();
+		}
+
+		win.webContents.send(action, ...params);
+	}
 }
diff --git a/app/main/viewmanager.ts b/app/main/viewmanager.ts
@@ -41,12 +41,9 @@ class ViewManager {
 		});
 
 		ipcMain.on('call-view-function', (e: Event, name: string, ...params: any[]) => {
-			const fn = this.views[this.selectedIndex][name as keyof View];
-			if (typeof fn === 'function') {
-				// Type checking requires spread elements to match up with a rest parameter.
-				// So, using a workaround here.
-				(fn as any)(...params);
-			}
+			// Type checking requires spread elements to match up with a rest parameter.
+			// So, using a workaround here.
+			(this.views[this.selectedIndex] as any)[name as keyof View](...params);
 		});
 	}
 
@@ -67,6 +64,8 @@ class ViewManager {
 			return;
 		}
 		this.selectedIndex = index;
+		// console.log('setting null');
+		mainWindow.setBrowserView(null);
 		if (!view.webContents.getURL()) {
 			const { url } = view;
 			view.webContents.loadURL(url);