From 10763285c8ef03e2e7639ba1c49e7e9162edbf2a Mon Sep 17 00:00:00 2001 From: s-ol Date: Wed, 27 Jan 2021 14:28:27 +0100 Subject: node collapsing (w/o relayouting) --- src/index.js | 46 +++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 41 insertions(+), 5 deletions(-) (limited to 'src/index.js') diff --git a/src/index.js b/src/index.js index 911099c..111a7f6 100644 --- a/src/index.js +++ b/src/index.js @@ -23,11 +23,11 @@ dom.css` document.body.appendChild(
-

loading...

-
- -
-
+

loading...

+
+ +
+
); @@ -93,6 +93,7 @@ const createNotes = (graph, discussion) => { && onlyParent.attributedTo === data.attributedTo // posted by same user && onlyParent.published === data.published // in the same second } + onHide={hideNote} /> ); nodes.appendChild(dom); @@ -138,7 +139,42 @@ const scrollToRoot = (graph) => { } } +// update collapsed nodes starting with id +// returns list of (potentially) affected nodes +const updateCollapsed = (graph, id, updated=[]) => { + updated.push(id); + const node = graph[id]; + + if (node.collapsed !== 'explicit') { + node.collapsed = + node.data.inReplyTo.length + && node.data.inReplyTo.every(p => graph[p.id].collapsed); + } + + for (const child of graph[id].data.replies) + updateCollapsed(graph, child.id, updated); + + return updated; +}; + const graph = {}; +window.graph = graph; + update(graph) .then(() => scrollToRoot(graph)) .catch(err => console.error(err)); + +const hideNote = (e) => { + const node = graph[e.currentTarget.dataset.id]; + + node.collapsed = node.collapsed ? false : 'explicit'; + + for (const id of updateCollapsed(graph, node.data.id)) { + graph[id].dom.style.opacity = graph[id].collapsed ? 0.2 : 1.0; + } + + // layoutNodes(graph) + // .then(() => scrollToRoot(graph)) + // .catch(err => console.error(err)); +}; + -- cgit v1.2.3