Fix reply text

src/snek/static/base.css

@@ -368,7 +368,7 @@ input[type="text"], .chat-input textarea {
   }
 }
 
-.message.switch-user + .message, .message.long-time + .message, .message:first-child {
+.message.switch-user + .message, .message.long-time + .message, .message-list-bottom + .message{
   .time {
     display: block;
     opacity: 1;

src/snek/static/message-list.js

@@ -13,6 +13,44 @@ export class ReplyEvent extends Event {
     constructor(messageTextTarget) {
       super('reply', { bubbles: true, composed: true });
       this.messageTextTarget = messageTextTarget;
+
+      const newMessage = messageTextTarget.cloneNode(true);
+      newMessage.style.maxHeight = "0"
+      messageTextTarget.parentElement.insertBefore(newMessage, messageTextTarget);
+
+      newMessage.querySelectorAll('.embed-url-link').forEach(link => {
+        link.remove()
+      })
+
+      newMessage.querySelectorAll('picture').forEach(picture => {
+        const img = picture.querySelector('img');
+        if (img) {
+          picture.replaceWith(img);
+        }
+      })
+
+      newMessage.querySelectorAll('img').forEach(img => {
+        const src = img.src || img.currentSrc;
+        img.replaceWith(document.createTextNode(src));
+      })
+
+      newMessage.querySelectorAll('iframe').forEach(iframe => {
+        const src = iframe.src || iframe.currentSrc;
+        iframe.replaceWith(document.createTextNode(src));
+      })
+
+      newMessage.querySelectorAll('a').forEach(a => {
+        const href = a.getAttribute('href');
+        const text = a.innerText || a.textContent;
+        if (text === href || text === '') {
+          a.replaceWith(document.createTextNode(href));
+        } else {
+          a.replaceWith(document.createTextNode(`[${text}](${href})`));
+        }
+      })
+
+      this.replyText = newMessage.innerText.replaceAll("\n\n", "\n").trim();
+      newMessage.remove()
     }
 }
 
@@ -136,7 +174,7 @@ class MessageList extends HTMLElement {
       });
     }, {
       root: this,
-        threshold: 0.1
+      threshold: 0,
     })
 
     for(const c of this.children) {
@@ -145,6 +183,11 @@ class MessageList extends HTMLElement {
           this.messageMap.set(c.dataset.uid, c);
       }
     }
+
+    this.endOfMessages = document.createElement('div');
+    this.endOfMessages.classList.add('message-list-bottom');
+    this.prepend(this.endOfMessages);
+
     this.scrollToBottom(true);
   }
 
@@ -188,7 +231,6 @@ class MessageList extends HTMLElement {
       };
       document.addEventListener('keydown', escListener);
     })
-
   }
   isElementVisible(element) {
     if (!element) return false;
@@ -201,13 +243,13 @@ class MessageList extends HTMLElement {
     );
   }
   isScrolledToBottom() {
-    return this.isElementVisible(this.firstElementChild);
+    return this.isElementVisible(this.endOfMessages);
   }
   scrollToBottom(force = false, behavior= 'instant') {
     if (force || !this.isScrolledToBottom()) {
-      this.firstElementChild.scrollIntoView({ behavior, block: 'start' });
+      this.firstElementChild.scrollIntoView({ behavior, block: 'end' });
       setTimeout(() => {
-        this.firstElementChild.scrollIntoView({ behavior, block: 'start' });
+        this.firstElementChild.scrollIntoView({ behavior, block: 'end' });
       }, 200);
     }
   }
@@ -241,7 +283,6 @@ class MessageList extends HTMLElement {
 
   upsertMessage(data) {
     let message = this.messageMap.get(data.uid);
-    const newMessage = !!message;
     if (message) {
         message.parentElement?.removeChild(message);
     }
@@ -262,7 +303,7 @@ class MessageList extends HTMLElement {
 
     const scrolledToBottom = this.isScrolledToBottom();
     this.prepend(message);
-    if (scrolledToBottom) this.scrollToBottom(true, !newMessage ? 'smooth' : 'auto');
+    if (scrolledToBottom) this.scrollToBottom(true);
   }
 }
 

src/snek/templates/web.html

@@ -139,12 +139,13 @@ chatInputField.textarea.focus();
 
 // --- Reply helper ---
 function replyMessage(message) {
-    chatInputField.value = "```markdown\n> " + (message || '').split("\n").join("\n> ") + "\n```\n";
+    chatInputField.value = "```markdown\n> " + (message || '').trim().split("\n").join("\n> ") + "\n```\n";
+    chatInputField.textarea.dispatchEvent(new Event('change', { bubbles: true }));
     chatInputField.focus();
 }
 
 messagesContainer.addEventListener("reply", (e) => {
-    const messageText = e.messageTextTarget.textContent.trim();
+    const messageText = e.replyText || e.messageTextTarget.textContent.trim();
     replyMessage(messageText);
 })