added loading of 1750 ms to resolution change. ant-media/Ant-Media-Se…

…rver#3236
ant-media · May 17, 2021 · 880c4ad · 880c4ad
1 parent fa3967b
commit 880c4ad
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/src/main/webapp/images/loading.gif b/src/main/webapp/images/loading.gif
diff --git a/src/main/webapp/player.html b/src/main/webapp/player.html
@@ -50,6 +50,11 @@
 .options {
 		display:none;
 	}
+#video-overlay {
+	margin: 0 auto;
+	display: none;
+	z-index: 9999999;
+}
 </style>
 </head>
 <body>
@@ -70,6 +75,9 @@ <h3 class="col text-muted">WebRTC Play</h3>
 		<div class="jumbotron">
 
 			<div class="col-sm-12 form-group">
+				<div id='video-overlay'>
+					<img src="images/loading.gif" />
+				</div>
 				<video id="remoteVideo" autoplay controls playsinline ></video>
 			</div>
 			<div class="form-group col-sm-12 text-left">
@@ -321,9 +329,14 @@ <h3 class="col text-muted">WebRTC Play</h3>
 
  					// Remove p character in stream resolution
  					dropdownSelectedItem = dropdownSelectedItem.replace('p', '');
-
+					let getVideo = document.getElementById("remoteVideo");
+					let overlay = document.getElementById('video-overlay');
+					getVideo.pause();
+					overlay.style.display = "block";
+					getVideo.style.display = "none";
  					// Call set stream resolution
     				webRTCAdaptor.forceStreamQuality(streamId, Number(dropdownSelectedItem));
+					setTimeout(function(){ getVideo.play();overlay.style.display = "none"; getVideo.style.display = "block"; }, 1750);
 					// Remove current active item
 					$('a.dropdown-item.active').removeClass("active"); 
 					// Add active in new item