diff options
-rw-r--r-- | view/css/conversation.css | 17 | ||||
-rw-r--r-- | view/js/main.js | 25 |
2 files changed, 36 insertions, 6 deletions
diff --git a/view/css/conversation.css b/view/css/conversation.css index 180d4b1f0..995fc99b2 100644 --- a/view/css/conversation.css +++ b/view/css/conversation.css @@ -194,7 +194,8 @@ a.wall-item-name-link { } .item-highlight, -.item-indent { +.item-indent, +.wall-item-comment { position: relative; } @@ -246,6 +247,20 @@ a.wall-item-name-link { border-width: 1px 1px 0 0; } +.wall-item-comment.expanded:before { + content: '>'; + position: absolute; + left: .82rem; + top: .4rem; +} + +.wall-item-comment.expanded.indented:before { + content: '\2012'; + position: absolute; + left: .82rem; + top: .45rem; +} + /* comment_item */ diff --git a/view/js/main.js b/view/js/main.js index f83af560f..31437cfe0 100644 --- a/view/js/main.js +++ b/view/js/main.js @@ -100,6 +100,25 @@ $(document).ready(function() { const uuid = targetElement.dataset.itemUuid; const verb = targetElement.dataset.itemVerb; + if (userClick && targetElement.classList.contains('expanded') && targetElement.classList.contains('indented')) { + document.getElementById(`wall-item-sub-thread-wrapper-${id}`).innerHTML = ''; + document.getElementById(`wall-item-sub-thread-wrapper-${id}`).classList.remove('item-indent'); + targetElement.classList.remove('expanded', 'indented'); + document.getElementById('thread-wrapper-' + id).classList.remove('item-highlight'); + return; + } + + if (userClick && targetElement.classList.contains('expanded')) { + document.getElementById(`wall-item-sub-thread-wrapper-${id}`).classList.toggle('item-indent'); + targetElement.classList.add('indented'); + return; + } + + targetElement.classList.add('expanded'); + if (!userClick) { + targetElement.classList.add('indented'); + } + request(id, mid, verb, parent, uuid, userClick); }); @@ -1425,11 +1444,6 @@ function request(id, mid, verb, parent, uuid, userClick) { updateRelativeTime('.autotime'); collapseHeight(); - const icon = document.querySelector('#wall-item-comment-' + id); - if (icon) { - icon.classList.add('disabled'); - } - if (userClick) { loading.style.display = 'none'; document.dispatchEvent(new CustomEvent('hz:sse_setNotificationsStatus', { detail: b64mids })); @@ -1543,6 +1557,7 @@ const autoExpand = (function () { async function autoExpand(id) { const loading = document.getElementById('like-rotator-' + id); + clickedElements.clear(); try { // Step 1: Ensure initial button is clicked |