Mercurial > libervia-templates
annotate sat_templates/templates/bulma/chat/message.html @ 402:2bbcb7da56bc default tip
bulma: use Font-Awesome instead of Fontello + start of major redesign:
- Font-Awesome is now used instead of Fontello, following change in Libervia Media.
- This is a beginning of a major redesign of the web templates/web frontend. This
currently breaks a lot of thing.
author | Goffi <goffi@goffi.org> |
---|---|
date | Sat, 26 Oct 2024 22:53:26 +0200 |
parents | 2eaea9a9c234 |
children |
rev | line source |
---|---|
230 | 1 {% import 'components/avatar.html' as avatar with context %} |
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 | 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 | 19 {{ avatar.avatar(msg.from_, "is-32x32") }} |
20 </figure> | |
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 | 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 | 26 <div class="level-left has-text-weight-bold"> |
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 | 29 </div> |
30 </div> | |
31 <div class="level-right is-italic"> | |
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 | 50 </div> |
51 </div> | |
52 </nav> | |
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 | 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 | 109 </div> |
110 </div> | |
111 </div> |