Mercurial > libervia-web
changeset 1557:855729ef75f2
browser (calls): improve call buttons:
- following template change, there are now a call button for video and one for audio, and
no more "switch" button, this is more intuitive
- search items have been customised with a 3 dots menu to show a dropdown, which let
select the "video" or "audio" call mode. By defaut, a click on a search item will do a
video call.
| author | Goffi <goffi@goffi.org> |
|---|---|
| date | Tue, 15 Aug 2023 17:16:45 +0200 |
| parents | 5c4703870088 |
| children | 2f2250ddad23 |
| files | libervia/web/pages/calls/_browser/__init__.py |
| diffstat | 1 files changed, 40 insertions(+), 15 deletions(-) [+] |
line wrap: on
line diff
--- a/libervia/web/pages/calls/_browser/__init__.py Tue Aug 15 17:14:53 2023 +0200 +++ b/libervia/web/pages/calls/_browser/__init__.py Tue Aug 15 17:16:45 2023 +0200 @@ -45,9 +45,16 @@ # call/hang up buttons self._call_mode = VIDEO - self.call_button_tpl = Template("call/call_button.html") - self._update_call_button() - document["toggle_call_mode_btn"].bind("click", self.switch_call_mode) + document["video_call_btn"].bind( + "click", + lambda __: aio.run(self.make_call()) + + ) + document["audio_call_btn"].bind( + "click", + lambda __: aio.run(self.make_call(video=False)) + + ) document["hangup_btn"].bind("click", lambda __: aio.run(self.hang_up())) # other buttons @@ -67,7 +74,24 @@ # search self.jid_search = JidSearch( - document["search"], document["contacts"], click_cb=self._on_entity_click + document["search"], + document["contacts"], + click_cb=self._on_entity_click, + template="call/search_item.html", + options={ + "no_group": True, + "extra_cb": { + ".dropdown-trigger": lambda evt, item: aio.run( + self.on_entity_action(evt, "menu", item) + ), + ".click-to-video": lambda evt, item: aio.run( + self.on_entity_action(evt, VIDEO, item) + ), + ".click-to-audio": lambda evt, item: aio.run( + self.on_entity_action(evt, AUDIO, item) + ), + } + } ) # incoming call dialog @@ -114,7 +138,6 @@ if self._call_mode == mode: return self._call_mode = mode - self._update_call_button() with_video = mode == VIDEO for elt in self.call_box_elt.select(".is-video-only"): if with_video: @@ -124,16 +147,6 @@ else: raise ValueError("Invalid call mode") - def switch_call_mode(self, ev): - self.call_mode = AUDIO if self.call_mode == VIDEO else VIDEO - - def _update_call_button(self): - new_button = self.call_button_tpl.get_elt({"call_mode": self.call_mode}) - new_button.bind( - "click", lambda __: aio.run(self.make_call(video=not self.call_mode == AUDIO)) - ) - document["call_btn"].replaceWith(new_button) - def _on_action_new( self, action_data_s: str, action_id: str, security_limit: int, profile: str ) -> None: @@ -261,6 +274,7 @@ @param audio: True if an audio flux is required @param video: True if a video flux is required """ + self.call_mode = VIDEO if video else AUDIO try: callee_jid = JID(document["search"].value.strip()) if not callee_jid.is_valid: @@ -467,6 +481,17 @@ await self.make_call() + async def on_entity_action(self, evt, action: str, item: dict) -> None: + """Handle extra actions on search items""" + evt.stopPropagation() + if action == "menu": + evt.currentTarget.parent.classList.toggle("is-active") + elif action in (VIDEO, AUDIO): + document["search"].value = item["entity"] + # we want the dropdown to be inactive + evt.currentTarget.closest(".dropdown").classList.remove("is-active") + await self.make_call(video=action==VIDEO) + CallUI() loading.remove_loading_screen()