diff --git a/css/styles.css b/css/styles.css index 455cb78..edc49cd 100644 --- a/css/styles.css +++ b/css/styles.css @@ -304,9 +304,12 @@ button.nav > img.icon { max-height: 300px; object-fit: contain; } +.action-bar { + display: flex; +} .action-bar > button { - margin-right: 25px; opacity: 0.5; + flex: 1; } .reactions { @@ -339,7 +342,6 @@ button.nav > img.icon { .action-bar button.icon { transition: opacity 0.3s linear; - padding: 5px; } .action-bar button.icon img.icon { width: 16px; diff --git a/icon/event-options.svg b/icon/event-options.svg new file mode 100644 index 0000000..065c01b --- /dev/null +++ b/icon/event-options.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/js/event.js b/js/event.js index 60f185e..e03dc19 100644 --- a/js/event.js +++ b/js/event.js @@ -56,13 +56,11 @@ function event_calculate_pow(ev) { const target = +tag[2] if (isNaN(target)) return 0 - // if our nonce target is smaller than the difficulty, // then we use the nonce target as the actual difficulty return min(target, id_bits) } } - // not a valid pow if we don't have a difficulty target return 0 } diff --git a/js/main.js b/js/main.js index 3e79abb..27b5922 100644 --- a/js/main.js +++ b/js/main.js @@ -13,6 +13,7 @@ const SID_DMS_IN = "din"; const SID_PROFILES = "prof"; const SID_THREAD = "thrd"; const SID_FRIENDS = "frds"; +const SID_EVENT = "evnt"; // This is our main entry. // https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event @@ -235,6 +236,7 @@ async function on_pool_eose(relay, sub_id) { } case SID_NOTIFICATIONS: case SID_PROFILES: + case SID_EVENT: pool.unsubscribe(sub_id, relay); break; case SID_DMS_OUT: @@ -284,8 +286,17 @@ function fetch_profile(pubkey, pool, relay) { }], relay); } +function fetch_event(evid, pool) { + const sid = `${SID_EVENT}:${evid}`; + pool.subscribe(sid, [{ + ids: [evid] + }]); + log_debug(`fetching event ${sid}`); +} + function fetch_thread_history(evid, pool) { // TODO look up referenced relays for thread history + fetch_event(evid, pool); const sid = `${SID_THREAD}:${evid}` pool.subscribe(sid, [{ kinds: PUBLIC_KINDS, diff --git a/js/ui/render.js b/js/ui/render.js index 4c34542..e0599e3 100644 --- a/js/ui/render.js +++ b/js/ui/render.js @@ -63,10 +63,12 @@ function render_event(model, ev, opts={}) { const profile = model_get_profile(model, ev.pubkey); const delta = fmt_since_str(new Date().getTime(), ev.created_at*1000) + const target_thread_id = ev.refs.root || ev.id; let classes = "event" if (!opts.is_composing) classes += " bottom-border"; - return html`
+ return html`
$${render_shared_by(ev, opts)}
@@ -213,26 +215,9 @@ function render_action_bar(model, ev, opts={}) { `; } str += ` - - - `; - if (can_delete) { - const delete_id = shared ? shared.share_evid : ev.id; - str += html` - ` - } return str + "
"; } diff --git a/js/ui/state.js b/js/ui/state.js index 15cbd20..fe8fec3 100644 --- a/js/ui/state.js +++ b/js/ui/state.js @@ -119,7 +119,7 @@ function view_timeline_apply_mode(model, mode, opts={}, push_state=true) { view_update_navs(mode); find_node("#view [role='profile-info']").classList.toggle("hide", mode != VM_USER); const timeline_el = find_node("#timeline"); - timeline_el.classList.toggle("reverse", mode == VM_THREAD || mode == VM_DM_THREAD); + timeline_el.classList.toggle("reverse", mode == VM_DM_THREAD); timeline_el.classList.toggle("hide", mode == VM_SETTINGS || mode == VM_DM); find_node("#settings").classList.toggle("hide", mode != VM_SETTINGS); find_node("#dms").classList.toggle("hide", mode != VM_DM); @@ -181,9 +181,11 @@ function view_timeline_refresh(model, mode, opts={}) { // Build DOM fragment and render it let count = 0; const limit = 200; - const evs = mode == VM_DM_THREAD ? + let evs = mode == VM_DM_THREAD ? model_get_dm(model, opts.pubkey).events.concat().reverse() : model_events_arr(model); + if (mode == VM_THREAD) + evs = evs.reverse(); const fragment = new DocumentFragment(); let show_more = true; let i = evs.length - 1; @@ -334,7 +336,10 @@ function view_timeline_show_new(model) { const el = view_get_timeline_el(); const mode = el.dataset.mode; const opts = view_get_el_opts(el); - const latest_evid = el.firstChild ? el.firstChild.id.slice(2) : undefined; + let latest_evid = el.firstChild ? el.firstChild.id.slice(2) : undefined; + if (mode == VM_THREAD) { + latest_evid = el.lastElementChild ? el.lastElementChild.id.slice(2) : undefined; + } let count = 0; const evs = model_events_arr(model) @@ -353,7 +358,11 @@ function view_timeline_show_new(model) { count++; } if (count > 0) { - el.prepend(fragment); + if (mode == VM_THREAD) { + el.appendChild(fragment); + } else { + el.prepend(fragment); + } view_show_spinner(false); if (mode == VM_NOTIFICATIONS) { reset_notifications(model); @@ -511,9 +520,8 @@ function view_mode_contains_event(model, ev, mode, opts={}) { return ev.pubkey == model.pubkey || contact_is_friend(model.contacts, ev.pubkey); case VM_THREAD: if (ev.kind == KIND_SHARE) return false; - return ev.id == opts.thread_id || (ev.refs && ( - ev.refs.root == opts.thread_id || - ev.refs.reply == opts.thread_id)); + return ev.id == opts.thread_id || + event_refs_event(ev, {id:opts.thread_id}); case VM_NOTIFICATIONS: return event_tags_pubkey(ev, model.pubkey); case VM_DM_THREAD: @@ -629,11 +637,6 @@ async function onclick_send(ev) { el_input.value = ""; trigger_postbox_assess(el_input); close_modal(el); - - /* - const el_cw = document.querySelector("#content-warning-input"); - //tags: el_cw.value ? [["content-warning", el_cw.value]] : [], - el_cw.value = "";*/ } async function onclick_send_dm(ev) { const pubkey = await get_pubkey(); @@ -679,8 +682,20 @@ function onclick_toggle_cw(ev) { } function onclick_any(ev) { - const el = ev.target; - const action = el.getAttribute("action"); + let el = ev.target; + let action = el.getAttribute("action"); + if (action == null && el.tagName != "A") { + const parent = find_parent(el, "[action]"); + if (parent) { + const parent_action = parent.getAttribute("action") + // This is a quick hijack for propogating clicks; further extending + // this should be obvious. + if (parent_action == "open-thread") { + el = parent; + action = parent_action; + } + } + } switch (action) { case "sign-in": signin(); diff --git a/js/util.js b/js/util.js index d4e3364..9e2c76b 100644 --- a/js/util.js +++ b/js/util.js @@ -133,6 +133,8 @@ function find_nodes(selector, parentEl) { function find_parent(el, selector) { while (el && !el.matches(selector)) { el = el.parentNode; + if (!el.matches) + return undefined; } return el; }