skorotkiewicz/yosup
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

web: only expand thread one message at a time

Browse source
This commit is contained in:
William Casarin 2022-11-18 13:44:20 -08:00
parent ef1c2ca525
commit bd03976544
3 changed files with 51 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

4
web/index.html
View file

@ -8,11 +8,11 @@
<link rel="stylesheet" href="css/responsive.css?v=10">
<link rel="stylesheet" href="css/fontawesome.css?v=2">
<script defer src="js/ui/util.js?v=6"></script>
<script defer src="js/ui/render.js?v=11"></script>
<script defer src="js/ui/render.js?v=12"></script>
<script defer src="js/noble-secp256k1.js?v=1"></script>
<script defer src="js/bech32.js?v=1"></script>
<script defer src="js/nostr.js?v=6"></script>
<script defer src="js/damus.js?v=90"></script>
<script defer src="js/damus.js?v=91"></script>
</head>
<body>
<script>

52
web/js/damus.js
View file

@ -44,6 +44,7 @@ function init_timeline(name) {
name,
events: [],
rendered: new Set(),
depths: {},
expanded: new Set(),
}
}
@ -52,6 +53,7 @@ function init_home_model() {
return {
done_init: {},
notifications: 0,
max_depth: 2,
all_events: {},
reactions_to: {},
chatrooms: {},
@ -194,11 +196,11 @@ async function damus_web_init_ready()
pool.on('eose', async (relay, sub_id) => {
if (sub_id === ids.home) {
log_debug("got home EOSE from %s", relay.url)
//log_debug("got home EOSE from %s", relay.url)
const events = model.views.home.events
handle_comments_loaded(ids, model, events, relay)
} else if (sub_id === ids.profiles) {
log_debug("got profiles EOSE from %s", relay.url)
//log_debug("got profiles EOSE from %s", relay.url)
const view = get_current_view()
handle_profiles_loaded(ids, model, view, relay)
}
@ -951,10 +953,12 @@ function determine_event_refs(tags) {
for (const tag of tags) {
if (tag.length >= 4 && tag[0] == "e") {
if (tag[3] === "root")
positional_ids.push(tag[1])
if (tag[3] === "root") {
root = tag[1]
else if (tag[3] === "reply")
} else if (tag[3] === "reply") {
reply = tag[1]
}
} else if (tag.length >= 2 && tag[0] == "e") {
positional_ids.push(tag[1])
} else if (tag.length >= 2 && tag[0] == "p") {
@ -964,9 +968,14 @@ function determine_event_refs(tags) {
i++
}
if (!root && !reply && positional_ids.length > 0)
if (!(root && reply) && positional_ids.length > 0)
return determine_event_refs_positionally(pubkeys, positional_ids)
/*
if (reply && !root)
root = reply
*/
return {root, reply, pubkeys}
}
@ -988,18 +997,37 @@ function* yield_etags(tags)
}
function expand_thread(id) {
const ev = DAMUS.all_events[id]
const view = get_current_view()
if (ev) {
for (const tag of yield_etags(ev.tags))
view.expanded.add(tag[1])
} else {
log_debug("expand_thread, id not found?", id)
const root_id = get_thread_root_id(DAMUS, id)
if (!root_id) {
log_debug("could not get root_id for", DAMUS.all_events[id])
return
}
view.expanded.add(id)
view.depths[root_id] = get_thread_max_depth(DAMUS, view, root_id) + 1
redraw_events(DAMUS, view)
}
function get_thread_root_id(damus, id)
{
const ev = damus.all_events[id]
if (!ev) {
log_debug("expand_thread: no event found?", id)
return null
}
return ev.refs && ev.refs.root
}
function get_thread_max_depth(damus, view, root_id)
{
if (!view.depths[root_id])
return damus.max_depth
return view.depths[root_id]
}
function delete_post_confirm(evid) {
if (!confirm("Are you sure you want to delete this post?"))
return

17
web/js/ui/render.js
View file

@ -4,7 +4,9 @@
function render_timeline_event(damus, view, ev)
{
let max_depth = 3
const root_id = get_thread_root_id(damus, ev.id)
const max_depth = root_id ? get_thread_max_depth(damus, view, root_id) : damus.max_depth
if (ev.refs && ev.refs.root && view.expanded.has(ev.refs.root))
max_depth = null
@ -26,13 +28,13 @@ function render_reply_line_bot() {
return `<div class="line-bot"></div>`
}
function render_thread_collapsed(model, reply_ev, opts)
function render_thread_collapsed(model, ev, opts)
{
if (opts.is_composing)
return ""
return `<div onclick="expand_thread('${reply_ev.id}')" class="thread-collapsed">
<div class="thread-summary clickable event-message">
More messages in thread available. Click to expand.
return `<div onclick="expand_thread('${ev.id}')" class="thread-collapsed">
<div class="thread-summary clickable">
⮝ More
</div>
</div>`
}
@ -47,9 +49,8 @@ function render_replied_events(damus, view, ev, opts)
return ""
opts.replies = opts.replies == null ? 1 : opts.replies + 1
const expanded = view.expanded.has(reply_ev.id)
if (!expanded && !(opts.max_depth == null || opts.replies < opts.max_depth))
return render_thread_collapsed(damus, reply_ev, opts)
if (!(opts.max_depth == null || opts.replies < opts.max_depth))
return render_thread_collapsed(damus, ev, opts)
opts.is_reply = true
return render_event(damus, view, reply_ev, opts)