diff sat_templates/templates/bulma/call/call.html @ 395:5072e4a4e261

call: update template to handle remote control mode. rel 436
author Goffi <goffi@goffi.org>
date Sat, 11 May 2024 13:55:03 +0200
parents 3c2bf7c30767
children 9847e6dbeefa
line wrap: on
line diff
--- a/sat_templates/templates/bulma/call/call.html	Sat Apr 06 13:08:03 2024 +0200
+++ b/sat_templates/templates/bulma/call/call.html	Sat May 11 13:55:03 2024 +0200
@@ -67,7 +67,7 @@
         </div>
 
         <div id="call_box" class="is-relative mt-3 is-flex-grow-1">
-            <video id="remote_video" class="is-video-only" autoplay playsinline></video>
+            <video id="remote_video" class="is-video-only" autoplay playsinline tabindex="0"></video>
 
             <div class="fullscreen-btn is-video-only">
                 <button class="button is-light" id="full_screen_btn" aria-label="{{ _('Enter full screen') }}">
@@ -78,30 +78,30 @@
                 </button>
             </div>
 
-            <video id="local_video" class="is-video-only" autoplay playsinline></video>
+            <video id="local_video" class="is-video-only is-not-remote" autoplay playsinline></video>
 
             <div class="call-controls columns is-centered is-mobile is-multiline">
                 <div class="column is-narrow">
-                    <button class="button is-success" id="mute_audio_btn" aria-label="{{ _('Mute audio') }}">
+                    <button class="button is-success is-not-remote" id="mute_audio_btn" aria-label="{{ _('Mute audio') }}">
                         {{ icon('mic', cls='image is-24x24 is-inline-block') }}
                     </button>
                 </div>
                 <div class="column is-narrow">
-                    <button class="button is-success is-video-only" id="mute_video_btn" aria-label="{{ _('Mute video') }}">
+                    <button class="button is-success is-video-only is-not-remote" id="mute_video_btn" aria-label="{{ _('Mute video') }}">
                         {{ icon('videocam', cls='image is-24x24 is-inline-block') }}
                     </button>
                 </div>
-                <div id="share_desktop_column" class="column is-narrow is-hidden-touch is-video-only">
+                <div id="share_desktop_column" class="column is-narrow is-hidden-touch is-video-only is-not-remote">
                     <button class="button is-success inactive screen-off" id="share_desktop_btn" aria-label="{{ _('Share desktop') }}">
                         {{ icon('desktop', cls='image is-24x24 is-inline-block') }}
                     </button>
                 </div>
-                <div id="switch_camera_column" class="column is-narrow is-hidden-desktop">
+                <div id="switch_camera_column" class="column is-narrow is-hidden-desktop is-not-remote">
                     <button class="button is-success" id="switch_camera_btn" aria-label="{{ _('Switch camera') }}">
                         {{ icon('exchange', cls='image is-24x24 is-inline-block') }}
                     </button>
                 </div>
-                <div class="column is-narrow">
+                <div class="column is-narrow is-not-remote">
                     <button class="button " id="send_file_btn" aria-label="{{ _('Send file') }}">
                         {{ icon('doc', cls='image is-24x24 is-inline-block') }}
                     </button>