From 2e94d59028b4a877ee129c7ecbfc1d7c20bf09a8 Mon Sep 17 00:00:00 2001
From: OFF0 <offbyn@protonmail.com>
Date: Thu, 8 Dec 2022 07:52:03 +0100
Subject: [PATCH] feed: fix expand long notes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Text notes longer than 280 are shortened and appended with '…' to
indicate that this note can be expanded, but this dotdotdot was
real text and was not removed once the note is expanded.

Changed to showing the dots through CSS and only if the attribute
exists, so it does not show on expanded notes.
---
 src/cards.css |  5 +++++
 src/main.js   | 10 +++++-----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/cards.css b/src/cards.css
index acfef0e..2e2c6d1 100644
--- a/src/cards.css
+++ b/src/cards.css
@@ -110,3 +110,8 @@
   top: -100vh;
   width: .4rem;
 }
+
+[data-append]::after {
+  color: var(--color-accent);
+  content: "…";
+}
diff --git a/src/main.js b/src/main.js
index d04076b..25ffeae 100644
--- a/src/main.js
+++ b/src/main.js
@@ -169,7 +169,7 @@ const elemCanvas = (text) => {
 function createTextNote(evt, relay) {
   const {host, img, isReply, name, replies, time, userName} = getMetadata(evt, relay);
   const isLongContent = evt.content.trimRight().length > 280;
-  const content = isLongContent ? `${evt.content.slice(0, 280)}…` : evt.content;
+  const content = isLongContent ? evt.content.slice(0, 280) : evt.content;
   const hasReactions = reactionMap[evt.id]?.length > 0;
   const didReact = hasReactions && !!reactionMap[evt.id].find(reaction => reaction.pubkey === pubkey);
   const replyFeed = replies[0] ? replies.map(e => replyDomMap[e.id] = createTextNote(e, relay)) : [];
@@ -604,10 +604,10 @@ privateKeyInput.value = localStorage.getItem('private_key');
 pubKeyInput.value = localStorage.getItem('pub_key');
 
 document.body.addEventListener('click', (e) => {
-  const append = e.target.closest('[data-append]');
-  if (append) {
-    append.textContent += append.dataset.append;
-    delete append.dataset.append;
+  const container = e.target.closest('[data-append]');
+  if (container) {
+    container.append(...multilineText(container.dataset.append));
+    delete container.dataset.append;
     return;
   }
   const back = e.target.closest('[name="back"]')