Mercurial > libervia-templates

changeset 329:6a26c8a43d10

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bulma (chat): fix chat: those change are done to have a minimal chat working, but it's really basic. A full-featured chat should come in a future version.
author Goffi <goffi@goffi.org>
date Fri, 07 May 2021 15:38:10 +0200
parents bfb0d5829728
children b85b72f44f01
files sat_templates/templates/bulma/base/base.html sat_templates/templates/bulma/chat/chat.html sat_templates/templates/bulma/static/chat.css sat_templates/templates/default/static/chat.js
diffstat 4 files changed, 32 insertions(+), 12 deletions(-) [+]
line wrap: on
line diff
--- a/sat_templates/templates/bulma/base/base.html	Sat May 01 18:47:35 2021 +0200
+++ b/sat_templates/templates/bulma/base/base.html	Fri May 07 15:38:10 2021 +0200
@@ -70,12 +70,22 @@
         <script>var csrf_token = "{{csrf_token}}"; var session_uuid="{{session_uuid}}";</script>
     {% endif %}
 
+    {# FIXME: websocket handling is to be replaced by Brython #}
+    {% if websocket is defined %}
+        {{ script.include('websocket', '') }}
+    {% endif %}
+
     {{ script.generate_scripts() }}
 
     {% for script in scripts %}
         <script{{ {'src': script.src, 'type': script.type} | xmlattr }}>{{script.content|safe}}</script>
     {% endfor %}
 
+    {# FIXME: websocket handling is to be replaced by Brython #}
+    {% if websocket is defined %}
+        <script>var socket=new WSHandler("{{websocket.url}}", "{{websocket.token}}", {{websocket.debug}});</script>
+    {% endif %}
+
     {% block favicon %}
         <link rel="icon" href="{{media_path}}icons/apps/64/sat.png">
     {% endblock favicon %}
--- a/sat_templates/templates/bulma/chat/chat.html	Sat May 01 18:47:35 2021 +0200
+++ b/sat_templates/templates/bulma/chat/chat.html	Fri May 07 15:38:10 2021 +0200
@@ -2,19 +2,19 @@
 {% if not embedded %}{% extends 'base/base.html' %}{% endif %}
 {% block title %}{{ target_jid }} - {{ super() }}{% endblock %}
 {% block body %}
-<div class="container has-background-white px-1 py-1">
-    <div id="messages">
-    {% if subject is defined %}
-        <div class="notification is-primary">
-            {{- subject|urlize(nofollow=true,target='_blank') -}}
+    <div id="chat-panel">
+        {% if subject is defined %}
+            <div class="notification is-primary my-0">
+                {{- subject|urlize(nofollow=true,target='_blank') -}}
+            </div>
+        {% endif %}
+        <div id="messages" class="has-background-white pt-4 px-4">
+            {% for msg in messages %}
+                {% include 'chat/message.html' %}
+            {% endfor %}
         </div>
-    {% endif %}
-    {% for msg in messages %}
-        {% include 'chat/message.html' %}
-    {% endfor %}
+        <textarea id="message_input" class="textarea mt-4 chat_input mb-4" name="message" type="text" rows="1" placeholder="{{_("enter your message")}}"></textarea>
     </div>
-    <textarea id="message_input" class="textarea mt-4 chat_input" name="message" type="text" rows="1" placeholder="{{_("enter your message")}}"></textarea>
-</div>
 {% endblock body %}
 
 {% block footer %}{% endblock footer %}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/sat_templates/templates/bulma/static/chat.css	Fri May 07 15:38:10 2021 +0200
@@ -0,0 +1,10 @@
+#chat-panel {
+	height: calc(100vh - 3.25rem);
+    padding-top: 1rem;
+    display: flex;
+    flex-direction: column;
+}
+
+#messages {
+    overflow: auto;
+}
--- a/sat_templates/templates/default/static/chat.js	Sat May 01 18:47:35 2021 +0200
+++ b/sat_templates/templates/default/static/chat.js	Fri May 07 15:38:10 2021 +0200
@@ -43,7 +43,7 @@
 
 var mutationCb = function(mutationsList) {
     scrollPos = messages.scrollTop + messages.clientHeight;
-    if (messages.lastChild.offsetTop - scrollPos - 10 <= 0) {
+    if (messages.lastChild.offsetTop - scrollPos - 150 <= 0) {
         // we auto scroll only if we are at the bottom of the page
         // else the use is probably checking history
         // Note thas this doesn't take margin into account,