Mercurial > libervia-templates

annotate sat_templates/templates/bulma/chat/message.html @ 390:38635d393089

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bulma (chat/reactions): use a special style for reactions made by the user.
author Goffi <goffi@goffi.org>
date Wed, 13 Dec 2023 22:01:46 +0100
parents 2eaea9a9c234
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
1 {% import 'components/avatar.html' as avatar with context %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
2
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
3 {% if chat_type == "group" %}
389
2eaea9a9c234 bulma (chat/message): fix setting of `own_mess` class.
Goffi <goffi@goffi.org>
parents: 387
diff changeset
4 {% set own_msg = msg.from_==own_local_jid %}
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
5 {% else %}
389
2eaea9a9c234 bulma (chat/message): fix setting of `own_mess` class.
Goffi <goffi@goffi.org>
parents: 387
diff changeset
6 {% set own_msg = msg.from_|bare_jid==own_local_jid|bare_jid %}
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
7 {% endif %}
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
8
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
9 <div
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
10 id="{{msg.id}}"
387
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
11 class="media is-chat-message msg_{{msg.type}} {{'own_msg' if own_msg}} {{ 'is-retracted' if msg.extra.retracted }}"
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
12 role="listitem"
387
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
13 aria-label="{{ 'Retracted Message' if msg.extra.retracted else 'Chat Message' }}"
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
14 {% if msg.extra.editions %}data-editions='{{msg.extra.editions|tojson}}'{% endif %}
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
15 >
385
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
16 {%- if msg.type != "info" %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
17 {%- set author = identities[msg.from_].nicknames[0] | default(msg.from_) -%}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
18 <figure class="media-left pt-1">
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
19 {{ avatar.avatar(msg.from_, "is-32x32") }}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
20 </figure>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
21 {% endif -%}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
22 <div class="media-content is-relative">
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
23 <div class="content">
385
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
24 {%- if msg.type != "info" %}
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
25 <nav class="level is-mobile is-marginless is-size-7 is-not-selectable">
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
26 <div class="level-left has-text-weight-bold">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
27 <div class="level-item">
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
28 <span class="author" id="msg_author_{{msg.id}}">{{author}}</span>
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
29 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
30 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
31 <div class="level-right is-italic">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
32 <div class="level-item">
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
33 <span class="date" id="msg_date_{{msg.id}}">{{(msg.extra.updated or msg.timestamp)|date_fmt('short', tz_name=tz_name)}}</span>
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
34 <div id="status_icons_{{msg.id}}" class="status-icons level-item has-padding-left">
386
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
35 {% if msg.extra.editions %}
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
36 {{ icon('pencil', cls='icon is-small message-editions') }}
e63fb06052ae bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents: 385
diff changeset
37 {% endif %}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
38 {% if msg.encrypted %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
39 {{ icon('lock-filled', cls='icon is-small has-text-success') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
40 {% else %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
41 {{ icon('lock-open', cls='icon is-small has-text-danger') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
42 {% endif %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
43 {% if msg.received %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
44 {{ icon('ok', cls='icon is-small has-text-link') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
45 {% endif %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
46 {% if msg.edited %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
47 {{ icon('pencil', cls='icon is-small has-text-info') }}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
48 {% endif %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
49 </div>
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
50 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
51 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
52 </nav>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
53 {% endif -%}
387
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
54 <p class="msg_body has-whitespace-pre-wrap {{ "has-text-info" if msg.type=="info" or msg.extra.retracted }} m-0" id="msg_body_{{msg.id}}">
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
55 {%- if msg.extra.retracted %}
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
56 {% trans %}This message has been retracted.{% endtrans %}
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
57 {% else %}
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
58 {{- msg.html or (msg.text|e|urlize|safe) -}}
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
59 {% endif -%}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
60 </p>
364
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 363
diff changeset
61
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 363
diff changeset
62 <div class="url-previews is-hidden">
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 363
diff changeset
63 <div class="icon-container"></div>
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 363
diff changeset
64 </div>
095bd5b34080 chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents: 363
diff changeset
65
387
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
66 <div
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
67 id="actions_{{msg.id}}"
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
68 class="level is-mobile actions mb-0 {{ "is-hidden" if msg.extra.retracted }}"
8b990c78d4b5 (bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents: 386
diff changeset
69 >
385
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
70 {#{{ icon('share', cls='icon is-small action-button', id='msg_share_{{msg.id}}') }} #}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
71 {{ icon('smile', cls='icon is-small action-button reaction-button', id='msg_actions_{{msg.id}}') }}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
72 {{ icon('dot-3', cls='icon is-small action-button extra-button', id='msg_actions_{{msg.id}}') }}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
73 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
74 <div id="msg_reactions_{{msg.id}}" style="margin-top: 0.5em;">
385
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
75 {% if msg.extra.reactions is defined %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
76 {% set reactions = msg.extra.get("reactions") %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
77 {% include 'chat/reactions.html' %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
78 {% endif %}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
79 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
80 {% if msg.attachments %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
81 <div class="message-attachments pt-2">
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
82 {%- for attachment in msg.attachments %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
83 <figure class="image message-attachment">
385
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
84 {%- if not attachment.url -%}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
85 <div class="notification is-warning">
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
86 <div class="is-size-6 has-text-weight-semibold mb-1">
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
87 {% trans name=attachment.name %}Attachment: {{name}}{% endtrans %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
88 </div>
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
89
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
90 <div class="is-size-7 mb-1">
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
91 {% trans %}Cannot be opened as there are no sources available.{% endtrans %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
92 </div>
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
93
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
94 </div>
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
95 {%- else -%}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
96 {%- if attachment.media_type|media_type_main == 'image' %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
97 <img src="{{attachment.url}}" alt="{{attachment.name}}">
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
98 {%- else %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
99 {{ icon('doc', cls='icon') }}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
100 {%- endif %}
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
101 <figcaption class="has-text-centered is-size-7">
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
102 <a href="{{attachment.url}}" target="_blank" class="has-text-grey">{{attachment.name}}</a>
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
103 </figcaption>
941e4006ab6e bulma (message): reactions + fixes:
Goffi <goffi@goffi.org>
parents: 371
diff changeset
104 {%- endif -%}
362
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
105 </figure>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
106 {%- endfor %}
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
107 </div>
b2b859a62e70 bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents: 235
diff changeset
108 {% endif %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
109 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
110 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
111 </div>