Merge branch...

Merge branch '261-microphone-and-video-connection-buttons-should-show-their-status' into 'development'

Resolve "Microphone and video connection buttons should show their status"

Closes #261

See merge request !258

src/main/resources/static/js/jitsi.js

@@ -87,10 +87,18 @@ function closeJitsiRoomDueToEmergency() {
 
 function toggleAudio() {
 	api.executeCommand('toggleAudio');
+	let button = $("#audio-button");
+	button.toggleClass("disabled");
+	button.toggleClass("fa-microphone-slash");
+	button.toggleClass("fa-microphone");
 }
 
 function toggleVideo() {
 	api.executeCommand('toggleVideo');
+	let button = $("#video-button");
+	button.toggleClass("disabled");
+	button.toggleClass("fa-video-slash");
+	button.toggleClass("fa-video");
 }
 
 function onEndOfSlotApproaching() {

src/main/resources/templates/connect/components.html

@@ -8,7 +8,8 @@
 	</div>
 	<div class="col-12 col-md-8 text-center">
 		<button
-				class="btn btn-light btn-call fa fa-microphone-slash mr-1"
+				id="audio-button"
+				class="btn btn-light btn-call fa fa-microphone mr-1"
 				onclick="toggleAudio()"
 		></button>
 		<button
@@ -21,7 +22,8 @@
 				th:if="${isPatient}"
 		></button>
 		<button
-				class="btn btn-light btn-call fa fa-video-slash"
+				id="video-button"
+				class="btn btn-light btn-call fa fa-video"
 				onclick="toggleVideo()"
 		></button>
 	</div>