BrowserView: Improvements to loading indicator.

zulip · Jul 25, 2019 · 6769ed3 · 6769ed3
1 parent a9095d0
commit 6769ed3
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 10 deletions.
diff --git a/app/main/view.ts b/app/main/view.ts
@@ -17,7 +17,6 @@ export class View extends BrowserView {
 	index: number;
 	url: string;
 	zoomFactor: number;
-	loading: boolean;
 	customCSS: boolean;
 
 	constructor(public props: ViewProps) {
@@ -32,7 +31,6 @@ export class View extends BrowserView {
 		this.index = props.index;
 		this.url = props.url;
 		this.zoomFactor = 1.0;
-		this.loading = false;
 		this.customCSS = ConfigUtil.getConfigItem('customCSS');
 		this.registerListeners();
 	}
@@ -57,19 +55,15 @@ export class View extends BrowserView {
 		});
 
 		this.webContents.addListener('did-start-loading', () => {
-			const isSettingsPage = this.url.includes('renderer/preference.html');
-			if (!isSettingsPage) {
-				this.sendAction('switch-loading', true, this.url);
-			}
+			this.switchLoadingIndicator(true);
 		});
 
 		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);
+			this.switchLoadingIndicator(false);
 		});
 
 		this.webContents.addListener('page-title-updated', (e: Event, title: string) => {
@@ -107,10 +101,17 @@ export class View extends BrowserView {
 	}
 
 	reload(): void {
-		this.loading = true;
+		this.switchLoadingIndicator(true);
 		this.webContents.reload();
 	}
 
+	switchLoadingIndicator(state: boolean): void {
+		const isSettingsPage = this.url.includes('renderer/preference.html');
+		if (!isSettingsPage) {
+			this.sendAction('switch-loading', state, this.url);
+		}
+	}
+
 	forward(): void {
 		if (this.webContents.canGoForward()) {
 			this.webContents.goForward();

diff --git a/app/renderer/main.html b/app/renderer/main.html
@@ -29,7 +29,7 @@
                     <div class="action-button" id="reload-action" title="Reload">
                         <i class="material-icons md-48">refresh</i>
                     </div>
-                    <div class="action-button" id="loading-action" title="Loading">
+                    <div class="action-button disable" id="loading-action" title="Loading">
                         <i class="refresh material-icons md-48">loop</i>
                     </div>
                     <div class="action-button disable" id="back-action" title="Go Back">