comparison sat_templates/templates/bulma/call/call.html @ 394:3c2bf7c30767

call: add a new button to send a file during a call.
author Goffi <goffi@goffi.org>
date Sat, 06 Apr 2024 13:08:03 +0200
parents c573917ce388
children 5072e4a4e261
comparison
equal deleted inserted replaced
393:772e73148132 394:3c2bf7c30767
3 {% extends 'base/base.html' %} 3 {% extends 'base/base.html' %}
4 {% endif %} 4 {% endif %}
5 5
6 {% block body %} 6 {% block body %}
7 {{ icon_defs( 7 {{ icon_defs(
8 "resize-full", "resize-small", "volume-up", "videocam", "dot-3-vert", "wrench", "user-circle", "desktop", "exchange", "phone" 8 "desktop", "doc", "dot-3-vert", "exchange", "mic", "phone", "resize-full", "resize-small", "user-circle", "videocam", "wrench"
9 ) }} 9 ) }}
10 <audio id="audio_player" class="is-hidden" src="{{media_path}}sounds/notifications/ring_1.mp3" preload="auto" loop></audio> 10 <audio id="audio_player" class="is-hidden" src="{{media_path}}sounds/notifications/ring_1.mp3" preload="auto" loop></audio>
11 <section class="section is-full-below-menu" style="position: relative" > 11 <section class="section is-full-below-menu" style="position: relative" >
12 <div id="containers_wrapper"> 12 <div id="containers_wrapper">
13 13
78 </button> 78 </button>
79 </div> 79 </div>
80 80
81 <video id="local_video" class="is-video-only" autoplay playsinline></video> 81 <video id="local_video" class="is-video-only" autoplay playsinline></video>
82 82
83 <div class="call-controls columns is-centered is-mobile"> 83 <div class="call-controls columns is-centered is-mobile is-multiline">
84 <div class="column is-narrow"> 84 <div class="column is-narrow">
85 <button class="button is-success" id="mute_audio_btn" aria-label="{{ _('Mute audio') }}"> 85 <button class="button is-success" id="mute_audio_btn" aria-label="{{ _('Mute audio') }}">
86 {{ icon('volume-up', cls='image is-24x24 is-inline-block') }} 86 {{ icon('mic', cls='image is-24x24 is-inline-block') }}
87 </button> 87 </button>
88 </div> 88 </div>
89 <div class="column is-narrow"> 89 <div class="column is-narrow">
90 <button class="button is-success is-video-only" id="mute_video_btn" aria-label="{{ _('Mute video') }}"> 90 <button class="button is-success is-video-only" id="mute_video_btn" aria-label="{{ _('Mute video') }}">
91 {{ icon('videocam', cls='image is-24x24 is-inline-block') }} 91 {{ icon('videocam', cls='image is-24x24 is-inline-block') }}
92 </button> 92 </button>
93 </div> 93 </div>
94 <div id="share_desktop_column" class="column is-narrow is-hidden-touch"> 94 <div id="share_desktop_column" class="column is-narrow is-hidden-touch is-video-only">
95 <button class="button is-success inactive screen-off" id="share_desktop_btn" aria-label="{{ _('Share desktop') }}"> 95 <button class="button is-success inactive screen-off" id="share_desktop_btn" aria-label="{{ _('Share desktop') }}">
96 {{ icon('desktop', cls='image is-24x24 is-inline-block') }} 96 {{ icon('desktop', cls='image is-24x24 is-inline-block') }}
97 </button> 97 </button>
98 </div> 98 </div>
99 <div id="switch_camera_column" class="column is-narrow is-hidden-desktop"> 99 <div id="switch_camera_column" class="column is-narrow is-hidden-desktop">
100 <button class="button is-success" id="switch_camera_btn" aria-label="{{ _('Switch camera') }}"> 100 <button class="button is-success" id="switch_camera_btn" aria-label="{{ _('Switch camera') }}">
101 {{ icon('exchange', cls='image is-24x24 is-inline-block') }} 101 {{ icon('exchange', cls='image is-24x24 is-inline-block') }}
102 </button> 102 </button>
103 </div>
104 <div class="column is-narrow">
105 <button class="button " id="send_file_btn" aria-label="{{ _('Send file') }}">
106 {{ icon('doc', cls='image is-24x24 is-inline-block') }}
107 </button>
108 <input type="file" id="send_file_input" style="display:none;" />
103 </div> 109 </div>
104 <div class="column is-narrow"> 110 <div class="column is-narrow">
105 <button class="button is-danger" id="hangup_btn" aria-label="{{ _('Hang up') }}"> 111 <button class="button is-danger" id="hangup_btn" aria-label="{{ _('Hang up') }}">
106 {{ icon('phone', cls='image is-24x24 is-inline-block') }} 112 {{ icon('phone', cls='image is-24x24 is-inline-block') }}
107 </button> 113 </button>