Upload 2 files

public/app.js

@@ -453,4 +453,41 @@ async function ensureShellularRunning() {
 })();
 
 // Expose for inline onclick in HTML
-window.restartShellular = restartShellular;
+window.restartShellular = restartShellular;
+/* ── SSH / Termius credentials ───────────────────────────────────────────────── */
+let sshRevealed = false;
+
+window.toggleSshPass = function () {
+  sshRevealed = !sshRevealed;
+  const el  = $('ssh-pass');
+  const btn = $('ssh-reveal');
+  el.classList.toggle('ssh-blur', !sshRevealed);
+  btn.textContent = sshRevealed ? 'Hide' : 'Show';
+};
+
+async function pollSshInfo() {
+  if (!token) { setTimeout(pollSshInfo, 1500); return; }
+  try {
+    const res = await authFetch('/api/ssh-info');
+    if (!res || !res.ok) { setTimeout(pollSshInfo, 5000); return; }
+    const d = await res.json();
+
+    if (d.ready) {
+      $('ssh-host').textContent = d.host;
+      $('ssh-port').textContent = d.port;
+      $('ssh-user').textContent = d.username;
+      $('ssh-pass').textContent = d.password;
+      $('ssh-waiting').classList.add('hidden');
+      $('ssh-creds').classList.remove('hidden');
+      // Tunnel is up — no need to keep polling
+    } else {
+      // Not ready yet — keep polling every 4 s
+      setTimeout(pollSshInfo, 4000);
+    }
+  } catch {
+    setTimeout(pollSshInfo, 5000);
+  }
+}
+
+// Kick off SSH polling shortly after page load
+setTimeout(pollSshInfo, 800);

public/index.html

@@ -105,6 +105,43 @@
             <button class="btn btn-primary" onclick="restartShellular()">Try again</button>
           </div>
         </div>
+
+        <!-- ── SSH / Termius credentials ───────────────────────────────── -->
+        <div class="ssh-box">
+          <div class="ssh-box-title">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="ssh-icon"><rect x="2" y="11" width="20" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>
+            SSH · Termius Access
+          </div>
+
+          <div id="ssh-waiting" class="ssh-waiting">
+            <div class="loader loader-sm"></div>
+            <span>Opening tunnel&hellip;</span>
+          </div>
+
+          <div id="ssh-creds" class="ssh-creds hidden">
+            <div class="ssh-row">
+              <span class="ssh-label">Host</span>
+              <code id="ssh-host" class="ssh-val"></code>
+              <button class="btn-copy" data-target="ssh-host">Copy</button>
+            </div>
+            <div class="ssh-row">
+              <span class="ssh-label">Port</span>
+              <code id="ssh-port" class="ssh-val"></code>
+              <button class="btn-copy" data-target="ssh-port">Copy</button>
+            </div>
+            <div class="ssh-row">
+              <span class="ssh-label">User</span>
+              <code id="ssh-user" class="ssh-val">root</code>
+              <button class="btn-copy" data-target="ssh-user">Copy</button>
+            </div>
+            <div class="ssh-row">
+              <span class="ssh-label">Password</span>
+              <code id="ssh-pass" class="ssh-val ssh-blur"></code>
+              <button id="ssh-reveal" class="btn-copy" onclick="toggleSshPass()">Show</button>
+              <button class="btn-copy" data-target="ssh-pass">Copy</button>
+            </div>
+          </div>
+        </div>
       </section>
 
       <!-- First-time setup card (hidden once secrets are saved) -->