Improve interface and subject display (Thanks to the blabber.im group chat).

This commit is contained in:
Schimon Jehudah, Adv. 2024-10-14 12:31:31 +03:00
parent 928f5272e0
commit 26d92eff7c
5 changed files with 145 additions and 61 deletions

View file

@ -48,6 +48,14 @@ div:has(#bar) {
} }
*/ */
#subject {
margin: auto;
max-height: 30vh;
overflow: auto;
padding: 1em;
width: 90vw;
}
#bar, #bar,
#content > #entries > .entry, #content > #entries > .entry,
#profile-top, #profile-top,
@ -141,6 +149,7 @@ label,
} }
#profile-top { #profile-top {
align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
text-align: center; text-align: center;
@ -239,8 +248,8 @@ h1 {
width: 40em; width: 40em;
} }
#photo, #profile #photo,
#qrcode { #profile #qrcode {
/* border: 1px solid #c0c0c0; */ /* border: 1px solid #c0c0c0; */
/* width: 40%; */ /* width: 40%; */
/* margin-bottom: 2.5em; */ /* margin-bottom: 2.5em; */
@ -256,15 +265,29 @@ h1 {
*/ */
} }
#photo { #profile #photo {
/* object-fit: scale-down; */ /* object-fit: scale-down; */
} }
#profile-top img {
height: 180px;
width: 180px;
}
#profile-top #photo {
border-radius: 20px;
}
h3, h4, h5 { h3, h4, h5 {
padding-left: 2em; padding-left: 2em;
padding-right: 2em; padding-right: 2em;
} }
#titles {
padding-left: 0.5em;
padding-right: 0.5em;
}
#container-of-profile { #container-of-profile {
/* margin: auto; */ /* margin: auto; */
padding-bottom: 0.5em; padding-bottom: 0.5em;
@ -445,7 +468,7 @@ h3, h4, h5 {
border: 1px solid #434a53; /* #6f7b8c */ border: 1px solid #434a53; /* #6f7b8c */
} }
#qrcode { #profile #qrcode {
filter: invert(0.9); filter: invert(0.9);
} }
@ -482,6 +505,21 @@ h3, h4, h5 {
} }
*/ */
@media (max-width: 950px) {
#action-bar > #vcard,
#profile-top img,
#number-of-pages #first,
#number-of-pages #last {
display: none;
}
#profile-top {
justify-content: center;
}
}
@media (max-width: 885px) { @media (max-width: 885px) {
h1 { h1 {
@ -498,15 +536,15 @@ h3, h4, h5 {
width: unset; width: unset;
} }
#photo, #profile #photo,
#qrcode { #profile #qrcode {
display: block; display: block;
/* border-radius: 50px; */ /* border-radius: 50px; */
margin: auto; margin: auto;
margin-bottom: 2.5em; margin-bottom: 2.5em;
} }
#qrcode { #profile #qrcode {
outline: solid; outline: solid;
outline-color: #333; outline-color: #333;
} }
@ -578,8 +616,8 @@ h3, h4, h5 {
text-shadow: unset; text-shadow: unset;
} }
#photo, #profile #photo,
#qrcode { #profile #qrcode {
/* height: unset; */ /* height: unset; */
height: 360px; height: 360px;
max-width: 70%; max-width: 70%;
@ -587,7 +625,7 @@ h3, h4, h5 {
/* width: 360px; */ /* width: 360px; */
} }
#photo { #profile #photo {
background: unset; background: unset;
} }

83
fasi.py
View file

@ -109,7 +109,9 @@ class HttpInstance:
message = '{}: {} (XEP-0030)'.format(jid_info['text'], jid_info['condition']) message = '{}: {} (XEP-0030)'.format(jid_info['text'], jid_info['condition'])
action = 'Connect with' action = 'Connect with'
link_href = 'xmpp:{}'.format(jid_bare) link_href = 'xmpp:{}'.format(jid_bare)
links.append(['Connect', link_href]) links.append({'name' : 'Connect',
'href' : link_href,
'iden' : 'connect'})
xmpp_uri = jid_bare xmpp_uri = jid_bare
elif jid_kind in ('conference', 'server'): elif jid_kind in ('conference', 'server'):
action = 'Discover' action = 'Discover'
@ -118,7 +120,9 @@ class HttpInstance:
elif jid_kind == 'server': elif jid_kind == 'server':
instance = 'services' instance = 'services'
link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare) link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare)
links.append(['Discover', link_href]) links.append({'name' : 'Discover',
'href' : link_href,
'iden' : 'discover'})
view_href = '/d/' + jid_bare view_href = '/d/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
elif jid_kind in ('mix', 'muc'): elif jid_kind in ('mix', 'muc'):
@ -127,7 +131,9 @@ class HttpInstance:
action = 'Join to' action = 'Join to'
instance = 'participants' instance = 'participants'
link_href = 'xmpp:{}?join'.format(jid_bare) link_href = 'xmpp:{}?join'.format(jid_bare)
links.append(['Join', link_href]) links.append({'name' : 'Join',
'href' : link_href,
'iden' : 'join'})
view_href = '/v/' + jid_bare view_href = '/v/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
# room_info = await XmppXep0045.get_room_data(xmpp_instance, jid_bare) # room_info = await XmppXep0045.get_room_data(xmpp_instance, jid_bare)
@ -144,21 +150,33 @@ class HttpInstance:
action = 'Browse' action = 'Browse'
instance = 'nodes' instance = 'nodes'
link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare) link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare)
links.append(['Browse', link_href]) links.append({'name' : 'Browse',
'href' : link_href,
'iden' : 'browse'})
view_href = '/d/' + jid_bare view_href = '/d/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
else: else:
action = 'Message' action = 'Message'
instance = 'articles' instance = 'articles'
link_href = 'xmpp:{}?message'.format(jid_bare) link_href = 'xmpp:{}?message'.format(jid_bare)
links.append(['Add', 'xmpp:{}?roster'.format(jid_bare)]) links.append({'name' : 'Add',
links.append(['Message', link_href]) 'href' : 'xmpp:{}?roster'.format(jid_bare),
'id' : 'add'})
links.append({'name' : 'Message',
'href' : link_href,
'iden' : 'message'})
node_name = 'urn:xmpp:microblog:0' node_name = 'urn:xmpp:microblog:0'
view_href = '/d/{}/{}'.format(jid_bare, node_name) view_href = '/d/{}/{}'.format(jid_bare, node_name)
xmpp_uri = jid_bare xmpp_uri = jid_bare
links.append(['Subscribe', 'xmpp:{}?pubsub;node={};action=subscribe'.format(jid_bare, node_name)]) links.append({'name' : 'Subscribe',
links.append(['View', 'xmpp:{}?pubsub;node={}'.format(jid_bare, node_name)]) 'href' : 'xmpp:{}?pubsub;node={};action=subscribe'.format(jid_bare, node_name),
links.append(['vCard', 'xmpp:{}?vcard'.format(jid_bare)]) 'iden' : 'subscribe'})
links.append({'name' : 'View',
'href' : 'xmpp:{}?pubsub;node={}'.format(jid_bare, node_name),
'iden' : 'view'})
links.append({'name' : 'vCard',
'href' : 'xmpp:{}?vcard'.format(jid_bare),
'iden' : 'vcard'})
# JID info # JID info
# NOTE Group chat of Psi+ Project at jabber.ru has a note in its vCard. # NOTE Group chat of Psi+ Project at jabber.ru has a note in its vCard.
@ -336,7 +354,9 @@ class HttpInstance:
message = '{}: {} (XEP-0030)'.format(jid_info['text'], jid_info['condition']) message = '{}: {} (XEP-0030)'.format(jid_info['text'], jid_info['condition'])
action = 'Connect with' action = 'Connect with'
link_href = 'xmpp:{}'.format(jid_bare) link_href = 'xmpp:{}'.format(jid_bare)
links.append(['Connect', link_href]) links.append({'name' : 'Connect',
'href' : link_href,
'iden' : 'connect'})
xmpp_uri = jid_bare xmpp_uri = jid_bare
elif jid_kind in ('conference', 'server'): elif jid_kind in ('conference', 'server'):
action = 'Discover' action = 'Discover'
@ -345,7 +365,9 @@ class HttpInstance:
elif jid_kind == 'server': elif jid_kind == 'server':
instance = 'services' instance = 'services'
link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare) link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare)
links.append(['Discover', link_href]) links.append({'name' : 'Discover',
'href' : link_href,
'iden' : 'discover'})
view_href = '/d/' + jid_bare view_href = '/d/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
elif jid_kind in ('mix', 'muc'): elif jid_kind in ('mix', 'muc'):
@ -354,7 +376,9 @@ class HttpInstance:
action = 'Join to' action = 'Join to'
instance = 'participants' instance = 'participants'
link_href = 'xmpp:{}?join'.format(jid_bare) link_href = 'xmpp:{}?join'.format(jid_bare)
links.append(['Join', link_href]) links.append({'name' : 'Join',
'href' : link_href,
'iden' : 'join'})
view_href = '/v/' + jid_bare view_href = '/v/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
# room_info = await XmppXep0045.get_room_data(xmpp_instance, jid_bare) # room_info = await XmppXep0045.get_room_data(xmpp_instance, jid_bare)
@ -371,21 +395,41 @@ class HttpInstance:
action = 'Browse' action = 'Browse'
instance = 'nodes' instance = 'nodes'
link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare) link_href = 'xmpp:{}?disco;type=get;request=items'.format(jid_bare)
links.append(['Browse', link_href]) links.append({'name' : 'Browse',
'href' : link_href,
'iden' : 'browse'})
view_href = '/d/' + jid_bare view_href = '/d/' + jid_bare
xmpp_uri = jid_bare xmpp_uri = jid_bare
else: else:
action = 'Message' action = 'Message'
instance = 'articles' instance = 'articles'
link_href = 'xmpp:{}?message'.format(jid_bare) link_href = 'xmpp:{}?message'.format(jid_bare)
links.append(['Add', 'xmpp:{}?roster'.format(jid_bare)]) links.append({'name' : 'Add',
links.append(['Message', link_href]) 'href' : 'xmpp:{}?roster'.format(jid_bare),
'iden' : 'add'})
links.append({'name' : 'Add',
'href' : link_href,
'iden' : 'message'})
node_name = 'urn:xmpp:microblog:0' node_name = 'urn:xmpp:microblog:0'
view_href = '/d/{}/{}'.format(jid_bare, node_name) view_href = '/d/{}/{}'.format(jid_bare, node_name)
xmpp_uri = jid_bare xmpp_uri = jid_bare
links.append(['Subscribe', 'xmpp:{}?pubsub;node={};action=subscribe'.format(jid_bare, node_name)]) if item_id:
links.append(['View', 'xmpp:{}?pubsub;node={}'.format(jid_bare, node_name)]) links.append({'name' : 'Subscribe',
links.append(['vCard', 'xmpp:{}?vcard'.format(jid_bare)]) 'href' : 'xmpp:{}?pubsub;node={};item={};action=subscribe'.format(jid_bare, node_name, item_id),
'iden' : 'subscribe'})
links.append({'name' : 'View',
'href' : 'xmpp:{}?pubsub;node={};item={}'.format(jid_bare, node_name, item_id),
'iden' : 'view'})
else:
links.append({'name' : 'Subscribe',
'href' : 'xmpp:{}?pubsub;node={};action=subscribe'.format(jid_bare, node_name),
'iden' : 'subscribe'})
links.append({'name' : 'View',
'href' : 'xmpp:{}?pubsub;node={}'.format(jid_bare, node_name),
'iden' : 'view'})
links.append({'name' : 'vCard',
'href' : 'xmpp:{}?vcard'.format(jid_bare),
'iden' : 'vcard'})
# JID info # JID info
# NOTE Group chat of Psi+ Project at jabber.ru has a note in its vCard. # NOTE Group chat of Psi+ Project at jabber.ru has a note in its vCard.
@ -410,6 +454,7 @@ class HttpInstance:
} }
# Title # Title
# TODO /d/pubsub.nicoco.fr/blog/urn-uuid-53e43061-1962-3112-bb8a-1473dca61719
if '@' in jid_bare and node_name == 'urn:xmpp:microblog:0': if '@' in jid_bare and node_name == 'urn:xmpp:microblog:0':
node_title = 'Journal' node_title = 'Journal'
else: else:
@ -1109,7 +1154,7 @@ class Syndication:
instances = '' # TODO Check the Blasta database for instances. instances = '' # TODO Check the Blasta database for instances.
entry = {'content' : content_text, entry = {'content' : content_text,
'link' : link_href, 'href' : link_href,
'published' : published_text, 'published' : published_text,
'summary' : summary_text, 'summary' : summary_text,
'tags' : tags, 'tags' : tags,

View file

@ -6,7 +6,7 @@
<html xmlns="http://www.w3.org/1999/xhtml"> <html xmlns="http://www.w3.org/1999/xhtml">
<head> <head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" /> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>XMPP: {{action}} {{title}}</title> <title>XMPP: {{action}} {% if title %}{{title}}{% else %}{{jid_bare}}{% endif %}</title>
<meta name="description" content="{{action}} {{title}}" /> <meta name="description" content="{{action}} {{title}}" />
<meta name="generator" content="Fast And Sleek Invite" /> <meta name="generator" content="Fast And Sleek Invite" />
<meta name="uri" content="{{xmpp_uri}}" /> <meta name="uri" content="{{xmpp_uri}}" />
@ -36,8 +36,8 @@
{% if links %} {% if links %}
<div id="action-bar"> <div id="action-bar">
{% for link in links %} {% for link in links %}
<a href="{{link[1]}}"> <a href="{{link['href']}}" id="{{link['iden']}}">
{{link[0]}} {{link['name']}}
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
@ -46,7 +46,7 @@
{% if filename %} {% if filename %}
<img id="photo" src="/photo/{{filename}}" /> <img id="photo" src="/photo/{{filename}}" />
{% endif %} {% endif %}
<span> <span id="titles">
<h1>{% if jid_title %}{{jid_title}}{% else %}Group Chat{% endif %}</h1> <h1>{% if jid_title %}{{jid_title}}{% else %}Group Chat{% endif %}</h1>
<a href="/{{jid_bare}}"> <a href="/{{jid_bare}}">
<h2>{% if jid_note %}{{jid_note}}{% else %}{{jid_bare}}{% endif %}</h2> <h2>{% if jid_note %}{{jid_note}}{% else %}{{jid_bare}}{% endif %}</h2>
@ -56,9 +56,7 @@
</div> </div>
<div> <div>
{% if subject %} {% if subject %}
<h3> <pre id="subject">{{subject}}</pre>
{{subject}}
</h3>
{% endif %} {% endif %}
</div> </div>
{% if messages %} {% if messages %}
@ -89,21 +87,21 @@
{% endif %} {% endif %}
{% if number_of_pages %} {% if number_of_pages %}
<div id="number-of-pages"> <div id="number-of-pages">
{% if number_of_pages > 5 %} {% if number_of_pages > 3 %}
{% if page_number < 2 %} {% if page_number < 2 %}
<span class="inactive">First</span> <span class="inactive" id="first">First</span>
<span class="inactive">Back</span> <span class="inactive">Back</span>
{% else %} {% else %}
<a href="?page=1">First</a> <a href="?page=1" id="first">First</a>
<a href="?page={{page_number-1}}">Back</a> <a href="?page={{page_number-1}}">Back</a>
{% endif %} {% endif %}
<a href="?page={{page_number}}">{{page_number}}</a> <a href="?page={{page_number}}">{{page_number}}</a>
{% if page_number == number_of_pages %} {% if page_number == number_of_pages %}
<span class="inactive">Proceed</span> <span class="inactive">Proceed</span>
<span class="inactive">Last</span> <span class="inactive" id="last">Last</span>
{% else %} {% else %}
<a href="?page={{page_number+1}}">Proceed</a> <a href="?page={{page_number+1}}">Proceed</a>
<a href="?page={{number_of_pages}}">Last</a> <a href="?page={{number_of_pages}}" id="last">Last</a>
{% endif %} {% endif %}
{% else %} {% else %}
{% for number in range(number_of_pages) %} {% for number in range(number_of_pages) %}

View file

@ -92,15 +92,17 @@
Preview journal OR Preview group chat Preview journal OR Preview group chat
</a> </a>
</div --> </div -->
<div id="count"> {% if count or jid_kind in ('mix', 'muc') %}
<a href="{{view_href}}"> <div id="count">
{% if count %} <a href="{{view_href}}">
{{count}} {{instance}} {% if count %}
{% else %} {{count}} {{instance}}
Preview {% elif jid_kind in ('mix', 'muc') %}
{% endif %} Preview
</a> {% endif %}
</div> </a>
</div>
{% endif %}
<!-- div> <!-- div>
<a href="https://xmpp.org"> <a href="https://xmpp.org">
<img id="logo-bottom" src="/img/logo-wordmark-vertical.svg" /> <img id="logo-bottom" src="/img/logo-wordmark-vertical.svg" />

View file

@ -6,7 +6,7 @@
<html xmlns="http://www.w3.org/1999/xhtml"> <html xmlns="http://www.w3.org/1999/xhtml">
<head> <head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" /> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>XMPP: {{action}} {{title}}</title> <title>XMPP: {{action}} {% if title %}{{title}}{% else %}{{jid_bare}}{% endif %}</title>
<meta name="description" content="{{action}} {{title}}" /> <meta name="description" content="{{action}} {{title}}" />
<meta name="generator" content="Fast And Sleek Invite" /> <meta name="generator" content="Fast And Sleek Invite" />
<meta name="uri" content="{{xmpp_uri}}" /> <meta name="uri" content="{{xmpp_uri}}" />
@ -36,8 +36,8 @@
{% if links %} {% if links %}
<div id="action-bar"> <div id="action-bar">
{% for link in links %} {% for link in links %}
<a href="{{link[1]}}"> <a href="{{link['href']}}" id="{{link['iden']}}">
{{link[0]}} {{link['name']}}
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
@ -46,7 +46,7 @@
{% if filename %} {% if filename %}
<img id="photo" src="/photo/{{filename}}" /> <img id="photo" src="/photo/{{filename}}" />
{% endif %} {% endif %}
<span> <span id="titles">
<h1>{{node_title}}</h1> <h1>{{node_title}}</h1>
<a href="/{{jid_bare}}/{{node_name}}"> <a href="/{{jid_bare}}/{{node_name}}">
<h2>{{jid_title}}</h2> <h2>{{jid_title}}</h2>
@ -81,7 +81,7 @@
class="permalink"> class="permalink">
🔗️ 🔗️
</a> </a>
<a href="{{entry['link']}}"> <a href="{{entry['href']}}">
{{entry['title']}} {{entry['title']}}
</a> </a>
</div> </div>
@ -96,21 +96,21 @@
{% endif %} {% endif %}
{% if number_of_pages %} {% if number_of_pages %}
<div id="number-of-pages"> <div id="number-of-pages">
{% if number_of_pages > 5 %} {% if number_of_pages > 3 %}
{% if page_number < 2 %} {% if page_number < 2 %}
<span class="inactive">First</span> <span class="inactive" id="first">First</span>
<span class="inactive">Back</span> <span class="inactive">Back</span>
{% else %} {% else %}
<a href="?page=1">First</a> <a href="?page=1" id="first">First</a>
<a href="?page={{page_number-1}}">Back</a> <a href="?page={{page_number-1}}">Back</a>
{% endif %} {% endif %}
<a href="?page={{page_number}}">{{page_number}}</a> <a href="?page={{page_number}}">{{page_number}}</a>
{% if page_number == number_of_pages %} {% if page_number == number_of_pages %}
<span class="inactive">Proceed</span> <span class="inactive">Proceed</span>
<span class="inactive">Last</span> <span class="inactive" id="last">Last</span>
{% else %} {% else %}
<a href="?page={{page_number+1}}">Proceed</a> <a href="?page={{page_number+1}}">Proceed</a>
<a href="?page={{number_of_pages}}">Last</a> <a href="?page={{number_of_pages}}" id="last">Last</a>
{% endif %} {% endif %}
{% else %} {% else %}
{% for number in range(number_of_pages) %} {% for number in range(number_of_pages) %}
@ -121,7 +121,8 @@
{% endif %} {% endif %}
{% if previous %} {% if previous %}
<div id="number-of-pages"> <div id="number-of-pages">
<a href="./">Previous</a> <!-- a href="./">Return to {{node_title}}</a -->
<a href="./">Return</a>
</div> </div>
{% endif %} {% endif %}
<!-- div> <!-- div>