ynerant/plateforme-tfjm2
1
0
Fork 0
mirror of https://gitlab.com/animath/si/plateforme.git synced 2025-06-22 08:38:29 +02:00
Code Issues Releases Wiki Activity

Add fullscreen mode for chat

Browse Source 
Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>
This commit is contained in:
Emmy D'Anello
2024-04-27 16:16:57 +02:00
parent ca91842c2d
commit 2d706b2b81
4 changed files with 44 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
chat/static/chat.js
View File

@ -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.

8
chat/templates/chat/chat.html
View File

@ -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">

10
chat/views.py
View File

@ -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")}