From bbbdbc1e8372921d871a7d274ca3a0a17a395cf1 Mon Sep 17 00:00:00 2001
From: Lorenzo Miniero <lminiero@gmail.com>
Date: Wed, 10 Apr 2024 12:47:09 +0200
Subject: [PATCH] Fixed VideoRoom local buttons not being clickable on Chrome
 in demos

---
 html/demos/mvideoroom.js | 8 ++++----
 html/demos/videoroom.js  | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/html/demos/mvideoroom.js b/html/demos/mvideoroom.js
index 86c2451a3f..b837302b51 100644
--- a/html/demos/mvideoroom.js
+++ b/html/demos/mvideoroom.js
@@ -276,7 +276,7 @@ $(document).ready(function() {
 											toastr.warning("Our video stream has been rejected, viewers won't see us");
 											// Hide the webcam video
 											$('#myvideo').addClass('hide');
-											$('#videolocal').append(
+											$('#videolocal').prepend(
 												'<div class="no-video-container">' +
 													'<i class="fa-solid fa-video fa-xl no-video-icon" style="height: 100%;"></i>' +
 													'<span class="no-video-text" style="font-size: 16px;">Video rejected, no webcam</span>' +
@@ -308,7 +308,7 @@ $(document).ready(function() {
 											if(localVideos === 0) {
 												// No video, at least for now: show a placeholder
 												if($('#videolocal .no-video-container').length === 0) {
-													$('#videolocal').append(
+													$('#videolocal').prepend(
 														'<div class="no-video-container">' +
 															'<i class="fa-solid fa-video fa-xl no-video-icon"></i>' +
 															'<span class="no-video-text">No webcam available</span>' +
@@ -339,7 +339,7 @@ $(document).ready(function() {
 										if(localVideos === 0) {
 											// No video, at least for now: show a placeholder
 											if($('#videolocal .no-video-container').length === 0) {
-												$('#videolocal').append(
+												$('#videolocal').prepend(
 													'<div class="no-video-container">' +
 														'<i class="fa-solid fa-video fa-xl no-video-icon"></i>' +
 														'<span class="no-video-text">No webcam available</span>' +
@@ -355,7 +355,7 @@ $(document).ready(function() {
 										Janus.log("Created local stream:", stream);
 										Janus.log(stream.getTracks());
 										Janus.log(stream.getVideoTracks());
-										$('#videolocal').append('<video class="rounded centered" id="myvideo' + trackId + '" width=100% autoplay playsinline muted="muted"/>');
+										$('#videolocal').prepend('<video class="rounded centered" id="myvideo' + trackId + '" width=100% autoplay playsinline muted="muted"/>');
 										Janus.attachMediaStream($('#myvideo' + trackId).get(0), stream);
 									}
 									if(sfutest.webrtcStuff.pc.iceConnectionState !== "completed" &&
diff --git a/html/demos/videoroom.js b/html/demos/videoroom.js
index 1e5e8ba690..a1cc61f253 100644
--- a/html/demos/videoroom.js
+++ b/html/demos/videoroom.js
@@ -274,7 +274,7 @@ $(document).ready(function() {
 											toastr.warning("Our video stream has been rejected, viewers won't see us");
 											// Hide the webcam video
 											$('#myvideo').addClass('hide');
-											$('#videolocal').append(
+											$('#videolocal').prepend(
 												'<div class="no-video-container">' +
 													'<i class="fa-solid fa-video fa-xl no-video-icon" style="height: 100%;"></i>' +
 													'<span class="no-video-text" style="font-size: 16px;">Video rejected, no webcam</span>' +
@@ -305,7 +305,7 @@ $(document).ready(function() {
 											if(localVideos === 0) {
 												// No video, at least for now: show a placeholder
 												if($('#videolocal .no-video-container').length === 0) {
-													$('#videolocal').append(
+													$('#videolocal').prepend(
 														'<div class="no-video-container">' +
 															'<i class="fa-solid fa-video fa-xl no-video-icon"></i>' +
 															'<span class="no-video-text">No webcam available</span>' +
@@ -336,7 +336,7 @@ $(document).ready(function() {
 										if(localVideos === 0) {
 											// No video, at least for now: show a placeholder
 											if($('#videolocal .no-video-container').length === 0) {
-												$('#videolocal').append(
+												$('#videolocal').prepend(
 													'<div class="no-video-container">' +
 														'<i class="fa-solid fa-video fa-xl no-video-icon"></i>' +
 														'<span class="no-video-text">No webcam available</span>' +
@@ -352,7 +352,7 @@ $(document).ready(function() {
 										Janus.log("Created local stream:", stream);
 										Janus.log(stream.getTracks());
 										Janus.log(stream.getVideoTracks());
-										$('#videolocal').append('<video class="rounded centered" id="myvideo' + trackId + '" width=100% autoplay playsinline muted="muted"/>');
+										$('#videolocal').prepend('<video class="rounded centered" id="myvideo' + trackId + '" width=100% autoplay playsinline muted="muted"/>');
 										Janus.attachMediaStream($('#myvideo' + trackId).get(0), stream);
 									}
 									if(sfutest.webrtcStuff.pc.iceConnectionState !== "completed" &&