mirror of
https://gitlab.com/animath/si/plateforme.git
synced 2024-12-24 18:22:24 +00:00
Add fullscreen mode for chat
Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>
This commit is contained in:
parent
ca91842c2d
commit
2d706b2b81
@ -33,6 +33,8 @@ function selectChannel(channel_id) {
|
||||
|
||||
selected_channel_id = channel_id
|
||||
|
||||
window.history.replaceState({}, null, `#channel-${channel['id']}`)
|
||||
|
||||
let channelTitle = document.getElementById('channel-title')
|
||||
channelTitle.innerText = channel['name']
|
||||
|
||||
@ -84,8 +86,12 @@ function setChannels(new_channels) {
|
||||
fetchMessages(channel['id'])
|
||||
}
|
||||
|
||||
if (new_channels && (!selected_channel_id || !channels[selected_channel_id]))
|
||||
selectChannel(Object.keys(channels)[0])
|
||||
if (new_channels && (!selected_channel_id || !channels[selected_channel_id])) {
|
||||
if (window.location.hash)
|
||||
selectChannel(window.location.hash.substring(9))
|
||||
else
|
||||
selectChannel(Object.keys(channels)[0])
|
||||
}
|
||||
}
|
||||
|
||||
function receiveMessage(message) {
|
||||
@ -180,6 +186,20 @@ function redrawMessages() {
|
||||
fetchMoreButton.classList.remove('d-none')
|
||||
}
|
||||
|
||||
function toggleFullscreen() {
|
||||
let chatContainer = document.getElementById('chat-container')
|
||||
if (!chatContainer.getAttribute('data-fullscreen')) {
|
||||
chatContainer.setAttribute('data-fullscreen', 'true')
|
||||
chatContainer.classList.add('position-absolute', 'top-0', 'start-0', 'vh-100', 'z-3')
|
||||
window.history.replaceState({}, null, `?fullscreen=1#channel-${selected_channel_id}`)
|
||||
}
|
||||
else {
|
||||
chatContainer.removeAttribute('data-fullscreen')
|
||||
chatContainer.classList.remove('position-absolute', 'top-0', 'start-0', 'vh-100', 'z-3')
|
||||
window.history.replaceState({}, null, `?fullscreen=0#channel-${selected_channel_id}`)
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
/**
|
||||
* Process the received data from the server.
|
||||
|
@ -3,6 +3,8 @@
|
||||
{% load static %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block content-title %}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<noscript>
|
||||
{% trans "JavaScript must be enabled on your browser to access chat." %}
|
||||
@ -17,7 +19,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card tab-content w-100 mh-100" style="height: 95vh" id="nav-channels-content">
|
||||
<div class="card tab-content w-100 mh-100{% if request.GET.fullscreen == '1' %} position-absolute top-0 start-0 vh-100 z-3{% endif %}"
|
||||
style="height: 95vh" id="chat-container">
|
||||
<div class="card-header">
|
||||
<h3>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#channelSelector"
|
||||
@ -25,6 +28,9 @@
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<span id="channel-title"></span>
|
||||
<button class="btn float-end" type="button" onclick="toggleFullscreen()" title="{% trans "Toggle fullscreen mode" %}">
|
||||
<i class="fas fa-expand"></i>
|
||||
</button>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="card-body overflow-y-scroll mw-100 h-100 flex-grow-0" id="chat-messages">
|
||||
|
@ -2,10 +2,9 @@
|
||||
# SPDX-License-Identifier: GPL-3.0-or-later
|
||||
|
||||
from django.contrib.auth.mixins import LoginRequiredMixin
|
||||
from django.utils.translation import gettext_lazy as _
|
||||
from django.views.generic import TemplateView
|
||||
|
||||
from chat.models import Channel
|
||||
|
||||
|
||||
class ChatView(LoginRequiredMixin, TemplateView):
|
||||
"""
|
||||
@ -13,9 +12,4 @@ class ChatView(LoginRequiredMixin, TemplateView):
|
||||
with Javascript and websockets.
|
||||
"""
|
||||
template_name = "chat/chat.html"
|
||||
|
||||
def get_context_data(self, **kwargs):
|
||||
context = super().get_context_data(**kwargs)
|
||||
from asgiref.sync import async_to_sync
|
||||
context['channels'] = async_to_sync(Channel.get_accessible_channels)(self.request.user, 'read')
|
||||
return context
|
||||
extra_context = {'title': _("Chat")}
|
||||
|
@ -7,7 +7,7 @@ msgid ""
|
||||
msgstr ""
|
||||
"Project-Id-Version: TFJM\n"
|
||||
"Report-Msgid-Bugs-To: \n"
|
||||
"POT-Creation-Date: 2024-04-27 14:10+0200\n"
|
||||
"POT-Creation-Date: 2024-04-27 16:15+0200\n"
|
||||
"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
|
||||
"Last-Translator: Emmy D'Anello <emmy.danello@animath.fr>\n"
|
||||
"Language-Team: LANGUAGE <LL@li.org>\n"
|
||||
@ -143,22 +143,30 @@ msgstr "message"
|
||||
msgid "messages"
|
||||
msgstr "messages"
|
||||
|
||||
#: chat/templates/chat/chat.html:8
|
||||
#: chat/templates/chat/chat.html:10
|
||||
msgid "JavaScript must be enabled on your browser to access chat."
|
||||
msgstr "JavaScript doit être activé sur votre navigateur pour accéder au chat."
|
||||
|
||||
#: chat/templates/chat/chat.html:12
|
||||
#: chat/templates/chat/chat.html:14
|
||||
msgid "Chat channels"
|
||||
msgstr "Canaux de chat"
|
||||
|
||||
#: chat/templates/chat/chat.html:40
|
||||
#: chat/templates/chat/chat.html:31
|
||||
msgid "Toggle fullscreen mode"
|
||||
msgstr "Inverse le mode plein écran"
|
||||
|
||||
#: chat/templates/chat/chat.html:39
|
||||
msgid "Fetch previous messages…"
|
||||
msgstr "Récupérer les messages précédents…"
|
||||
|
||||
#: chat/templates/chat/chat.html:52
|
||||
#: chat/templates/chat/chat.html:51
|
||||
msgid "Send message…"
|
||||
msgstr "Envoyer un message…"
|
||||
|
||||
#: chat/views.py:15 tfjm/templates/navbar.html:67
|
||||
msgid "Chat"
|
||||
msgstr "Chat"
|
||||
|
||||
#: draw/admin.py:39 draw/admin.py:57 draw/admin.py:75
|
||||
#: participation/admin.py:109 participation/models.py:253
|
||||
#: participation/tables.py:88
|
||||
@ -3720,10 +3728,6 @@ msgstr "Mon équipe"
|
||||
msgid "My participation"
|
||||
msgstr "Ma participation"
|
||||
|
||||
#: tfjm/templates/navbar.html:67
|
||||
msgid "Chat"
|
||||
msgstr "Chat"
|
||||
|
||||
#: tfjm/templates/navbar.html:72
|
||||
msgid "Administration"
|
||||
msgstr "Administration"
|
||||
|
Loading…
Reference in New Issue
Block a user