Mercurial > libervia-templates
annotate sat_templates/templates/bulma/chat/chat.html @ 399:e7152fc8a81f
bulma (components/search_item): explicitely import "avatar".
author | Goffi <goffi@goffi.org> |
---|---|
date | Thu, 06 Jun 2024 15:22:22 +0200 |
parents | 8b990c78d4b5 |
children |
rev | line source |
---|---|
230 | 1 {% if not embedded %}{% extends 'base/base.html' %}{% endif %} |
2 {% block title %}{{ target_jid }} - {{ super() }}{% endblock %} | |
3 {% block body %} | |
364
095bd5b34080
chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents:
362
diff
changeset
|
4 {{ icon_defs( |
095bd5b34080
chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents:
362
diff
changeset
|
5 "lock-open", "lock-filled", "ok", "pencil", "dot-3", "share", "attach", |
386
e63fb06052ae
bulma: message edition + extra menu + improvments:
Goffi <goffi@goffi.org>
parents:
385
diff
changeset
|
6 "paper-plane-empty", "doc", "download", "wrench", "eye", "smile", "plus-circled", |
387
8b990c78d4b5
(bulma/chat): add menu + style for message retraction
Goffi <goffi@goffi.org>
parents:
386
diff
changeset
|
7 "quote-left", "trash-empty" |
364
095bd5b34080
chat: add templates for URL previews
Goffi <goffi@goffi.org>
parents:
362
diff
changeset
|
8 ) }} |
362
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
9 |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
10 {# TODO: this should be done in a more generic way in dialog module #} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
11 <div id="modal" class="modal"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
12 <div class="modal-background"></div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
13 <div class="modal-content"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
14 <p class="image"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
15 <img id="modal-image" src="" alt=""> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
16 </p> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
17 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
18 <button class="modal-close is-large" aria-label="close"></button> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
19 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
20 |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
21 <div id="chat-panel" class="is-flex is-flex-direction-column is-justify-content-space-between is-align-items-stretch pt-4"> <!-- calculate height depending on your navbar size --> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
22 <!-- Header --> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
23 <div id="header" class="box p-4 is-flex is-justify-content-space-between is-align-items-center is-flex-shrink-0"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
24 {% if subject is defined %} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
25 <h2 id="room-subject" class="title is-5 has-text-weight-bold">{{- subject|urlize(nofollow=true,target='_blank') -}}</h2> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
26 {% endif %} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
27 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
28 |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
29 <!-- Messages --> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
30 <div id="messages" class="box p-4 has-background-white mb-4 is-flex-grow-1 is-flex-direction-column-reverse is-overflow-auto"> |
329 | 31 {% for msg in messages %} |
365
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
32 {% set current_date = msg.timestamp|date_fmt('full', date_only=True) %} |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
33 {% if loop.changed(current_date) %} |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
34 <div class="separator"> |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
35 <hr class="has-background-light" /> |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
36 <span class="has-text-grey is-size-7">{{current_date}}</span> |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
37 <hr class="has-background-light" /> |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
38 </div> |
9860286068b9
chat/chat.html: display date when there is a date change between 2 messages
Goffi <goffi@goffi.org>
parents:
364
diff
changeset
|
39 {% endif %} |
329 | 40 {% include 'chat/message.html' %} |
41 {% endfor %} | |
230 | 42 </div> |
362
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
43 |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
44 <!-- Attachments --> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
45 <div id="attachments" class="box has-background-white is-flex is-flex-grow-0 is-flex-shrink-0 is-align-items-center is-overflow-auto is-contracted"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
46 {% for file in attachments %} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
47 {% include 'chat/attachment_preview.html' %} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
48 {% endfor %} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
49 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
50 |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
51 <!-- Input --> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
52 <div id="input-area" class="field has-addons py-4 is-flex-shrink-0"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
53 <p class="control is-expanded"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
54 <textarea id="message_input" class="textarea" name="message" type="text" rows="1" placeholder="{{_("enter your message")}}"></textarea> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
55 </p> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
56 <div class="control"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
57 <button class="button" id="attach_button"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
58 <span class="icon is-small"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
59 {{ icon('attach', cls='has-text-info') }} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
60 </span> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
61 </button> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
62 <input id="file_input" type="file" multiple="true" style="display: none" /> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
63 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
64 <div class="control"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
65 <button class="button" id="send_button"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
66 <span class="icon is-small"> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
67 {{ icon('paper-plane-empty') }} |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
68 </span> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
69 </button> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
70 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
71 </div> |
b2b859a62e70
bulma (chat): new templates and CSS for chat page.
Goffi <goffi@goffi.org>
parents:
329
diff
changeset
|
72 |
230 | 73 </div> |
74 {% endblock body %} | |
75 | |
76 {% block footer %}{% endblock footer %} |