webview: Fix webview glitches.

2025-10-26 09:33:35 +00:00 · 2018-02-23 23:33:05 +05:30
3 changed files with 34 additions and 28 deletions
--- a/app/renderer/css/main.css
+++ b/app/renderer/css/main.css
@@ -13,6 +13,9 @@ body {
 #content {
    display: flex;
    height: 100%;
+}
+
+.loading {
    background: #fff url(../img/ic_loading.gif) no-repeat;
    background-size: 60px 60px;
    background-position: center;
--- a/app/renderer/js/components/webview.js
+++ b/app/renderer/js/components/webview.js
@@ -21,6 +21,7 @@ class WebView extends BaseComponent {
 		this.zoomFactor = 1.0;
 		this.loading = false;
 		this.badgeCount = 0;
+		this.loadingIndicator = document.getElementById('content');
 	}

 	template() {
@@ -92,6 +93,8 @@ class WebView extends BaseComponent {
 		});

 		this.$el.addEventListener('dom-ready', () => {
+			// const loadingIndicator = document.getElementById('content');
+			this.loadingIndicator.classList.remove('loading');
 			if (this.props.role === 'server') {
 				this.$el.classList.add('onload');
 			}
--- a/app/renderer/main.html
+++ b/app/renderer/main.html
@@ -9,7 +9,7 @@
 </head>

 <body>
-  <div id="content">
+  <div id="content" class="loading">
    <div class="popup">
      <span class="popuptext hidden" id="fullscreen-popup"></span>
    </div>