Update web/superball.html

web/superball.html

@@ -27,7 +27,6 @@
 
     <!-- FINAL EVENT SECTION -->
     <div class="section">
-      <h2>Final Event (What gets posted at the end)</h2>
       <div class="input-group">
         <div class="tabs">
           <div class="tab active" data-tab="tab1">Post</div>
@@ -45,6 +44,9 @@
           <h3>Reply</h3>
           <label for="reply-id">EventId/NoteId/Nevent:</label>
           <textarea id="reply-id" placeholder="Enter the nevent for the note..."></textarea>
+
+          <label for="fetched-event-display" id="fetched-event-label" style="display: none;">Event Replying To:</label>
+          <div id="fetched-event-display" class="fetched-event"></div>
           <label for="reply-content">Message Content:</label>
           <textarea id="reply-content" rows="3" placeholder="Enter your message content..."></textarea>
         </div>
@@ -81,6 +83,7 @@
       </div>
       <button onclick="createFinalEvent()">Create Event That Will Be Published Publicly</button>
 
+      <h2 style="padding-top: 16px;">Final Event (What gets posted at the end)</h2>
       <div id="final-event-display" class="json-display"></div>
     </div>
 
@@ -257,6 +260,11 @@
       const name = profile.name || profile.display_name || profile.displayName || 'Anonymous User';
       const about = profile.about || '';
       const picture = profile.picture || '';
+      const display_name = profile.display_name || '';
+      const website = profile.website || '';
+      const banner = profile.banner || '';
+      const nip05 = profile.nip05 || '';
+      const lud16 = profile.lud16 || '';
 
       document.getElementById('profile-name').textContent = name;
 
@@ -264,6 +272,17 @@
         document.getElementById('profile-picture').src = picture;
       }
 
+      // Edit Profile section
+
+      document.getElementById('name').textContent = name;
+      document.getElementById('about').textContent = about;
+      document.getElementById('profile-pic').textContent = picture;
+      document.getElementById('display-name').textContent = display_name;
+      document.getElementById('website').textContent = website;
+      document.getElementById('banner').textContent = banner;
+      document.getElementById('nip05').textContent = nip05;
+      document.getElementById('lud16').textContent = lud16;
+
       console.log('SUCCESS', `Profile displayed: ${name}`);
     }
 
@@ -303,7 +322,8 @@
             { url: 'wss://relay.primal.net', type: 'both' },
             { url: 'wss://nos.lol', type: 'both' },
             { url: 'wss://relay.damus.io', type: 'both' },
-            { url: 'wss://offchain.pub', type: 'both' }
+            { url: 'wss://offchain.pub', type: 'both' },
+            { url: 'ws://localhost:3334', type: 'both' }
           ];
           return userRelays;
         }
@@ -935,7 +955,13 @@
         }
 
         try {
+
+          document.getElementById('fetched-event-display').textContent = 'Loading event...';
+          document.getElementById('fetched-event-display').style.display = 'block';
+          document.getElementById('fetched-event-label').style.display = 'block';
           [ replyEvent, replyTags ] = await loadReplyTagsForEvent(eventId, knownRelays);
+          console.log("Event replying to: ", replyEvent)
+          document.getElementById('fetched-event-display').textContent = replyEvent.content;
         } catch (error) {
           alert('Error fetching reply event', error.message);
           return;
@@ -2219,6 +2245,9 @@
       // Clear UI elements
       document.getElementById('post-content').value = '';
       document.getElementById('final-event-display').textContent = '';
+      document.getElementById('fetched-event-display').textContent = '';
+      document.getElementById('fetched-event-display').style.display = 'none';
+      document.getElementById('fetched-event-label').style.display = 'none';
       document.getElementById('bounces-container').innerHTML = '';
 
       // Hide the Add Bounce button since no final event exists