Update file-manager/app.py

file-manager/app.py

@@ -1,4 +1,4 @@
-import os, shutil, html, urllib.parse, pty, select, termios, struct, fcntl, signal, threading, json
+import os, shutil, html, urllib.parse, pty, select, termios, struct, fcntl, signal, threading, json, time
 from flask import Flask, request, redirect, send_file, Response
 from werkzeug.middleware.dispatcher import DispatcherMiddleware
 from werkzeug.serving import run_simple
@@ -21,28 +21,31 @@ def mask_secrets(text):
     return "".join(out)
 
 # =================================================================
-# PERSISTENT PTY SHELL  (real terminal: buffering, prompts, input,
-# cd persistence, colors). Starts at the system root "/".
+# PERSISTENT PTY SHELL with scrollback (reattachable). Starts at "/".
 # =================================================================
+SCROLLBACK_LIMIT = 200_000   # chars of history kept per shell
+
 class PtyShell:
-    def __init__(self):
+    def __init__(self, name):
+        self.name = name
+        self.created = time.time()
         self.pid, self.fd = pty.fork()
         if self.pid == 0:
             os.environ["TERM"] = "xterm-256color"
-            os.chdir("/")                       # start at the system root
+            os.chdir("/")
             os.execvp("bash", ["bash", "-i"])
         else:
             flags = fcntl.fcntl(self.fd, fcntl.F_GETFL)
             fcntl.fcntl(self.fd, fcntl.F_SETFL, flags | os.O_NONBLOCK)
             self._set_size(40, 120)
-            self.buffer = ""
+            self.history = ""      # full scrollback (for reattach)
+            self.pending = {}      # per-viewer unread cursor: viewer_id -> index into history
             self.lock = threading.Lock()
             threading.Thread(target=self._reader, daemon=True).start()
 
     def _set_size(self, rows, cols):
         try:
-            fcntl.ioctl(self.fd, termios.TIOCSWINSZ,
-                        struct.pack("HHHH", rows, cols, 0, 0))
+            fcntl.ioctl(self.fd, termios.TIOCSWINSZ, struct.pack("HHHH", rows, cols, 0, 0))
         except Exception:
             pass
 
@@ -55,7 +58,9 @@ class PtyShell:
                     if not data:
                         break
                     with self.lock:
-                        self.buffer += data.decode(errors="replace")
+                        self.history += data.decode(errors="replace")
+                        if len(self.history) > SCROLLBACK_LIMIT:
+                            self.history = self.history[-SCROLLBACK_LIMIT:]
             except OSError:
                 break
 
@@ -65,11 +70,16 @@ class PtyShell:
         except OSError:
             pass
 
-    def read_new(self):
+    def snapshot(self):
+        # full history — used when (re)attaching to replay what happened
+        with self.lock:
+            return mask_secrets(self.history), len(self.history)
+
+    def read_from(self, cursor):
+        # incremental output since a given cursor position
         with self.lock:
-            data = self.buffer
-            self.buffer = ""
-        return mask_secrets(data)
+            new = self.history[cursor:]
+            return mask_secrets(new), len(self.history)
 
     def alive(self):
         try:
@@ -84,16 +94,32 @@ class PtyShell:
         except OSError:
             pass
 
-# --- Multiple independent PTY shells, keyed by session id ---
-_shells = {}
+# --- Session manager: named shells that outlive browser tabs ---
+_shells = {}          # name -> PtyShell
+_counter = {"n": 0}
+_slock = threading.Lock()
+
+def create_shell():
+    with _slock:
+        _counter["n"] += 1
+        name = f"Terminal {_counter['n']}"
+        _shells[name] = PtyShell(name)
+        return name
 
-def get_shell(sid):
-    sh = _shells.get(sid)
-    if sh is None or not sh.alive():
-        sh = PtyShell()
-        _shells[sid] = sh
+def get_shell(name):
+    sh = _shells.get(name)
+    if sh and not sh.alive():
+        del _shells[name]
+        return None
     return sh
 
+def list_shells():
+    # prune dead ones, return live session names
+    for n in list(_shells.keys()):
+        if not _shells[n].alive():
+            del _shells[n]
+    return sorted(_shells.keys(), key=lambda n: _shells[n].created)
+
 PAGE = """<!doctype html><html><head><title>Box</title>
 <style>
 body{{font-family:monospace;margin:20px;background:#0b0b0b;color:#eee}}
@@ -101,77 +127,168 @@ a{{color:#29BEFD;text-decoration:none}} a:hover{{text-decoration:underline}}
 table{{border-collapse:collapse;width:100%}} td,th{{padding:4px 8px;border-bottom:1px solid #222;text-align:left}}
 .bar{{background:#1a1a1a;padding:10px;margin-bottom:10px;border-radius:6px}}
 .tabs a{{margin-right:14px;font-weight:bold}}
-textarea{{width:100%;background:#000;color:#47E6C1;border:1px solid #333;padding:8px}}
+.tab{{display:inline-block;padding:6px 14px;margin-right:6px;background:#1a1a1a;border-radius:6px 6px 0 0;cursor:pointer}}
+.tab.active{{background:#F46821;color:#fff}}
 pre{{background:#000;color:#e6e6e6;padding:12px;border-radius:6px;overflow:auto;height:60vh;white-space:pre-wrap}}
 input[type=text]{{background:#000;color:#eee;border:1px solid #333;padding:8px;font-family:monospace}}
+textarea{{width:100%;background:#000;color:#47E6C1;border:1px solid #333;padding:8px}}
 button{{background:#F46821;color:#fff;border:0;padding:8px 14px;border-radius:4px;cursor:pointer}}
 </style></head><body>
-<div class="tabs bar"><a href="/fm/">📁 Files</a>
-<a href="/fm/term" target="_blank">🖥️ New Terminal</a>
+<div class="tabs bar"><a href="/fm/">📁 Files</a><a href="/fm/term">🖥️ Terminals</a>
 <a href="/reload">♻️ Reload</a><a href="/gpuinfo">🎮 GPU</a>
 <span style="color:#777">test mode · ephemeral</span></div>
 {body}</body></html>"""
 
-# ---------------- TERMINAL PAGE (xterm.js, unique session per tab) ----------------
+# ---------------- WINDOWS-11-STYLE TERMINAL WORKSPACE ----------------
 @app.route("/term")
 def term_page():
     body = """
-    <div class="bar"><b>Live terminal (xterm.js)</b> — each tab is its own shell, starts at /.</div>
-    <div id="term" style="height:70vh;background:#000;border-radius:6px"></div>
+    <div class="bar">
+      <b>Terminals</b> — sessions live on the box and survive closing the browser.
+      <span style="color:#777">Reopen this page anytime to reattach.</span>
+    </div>
+    <div id="tabs"></div>
+    <div id="term" style="height:68vh;background:#000;border-radius:0 6px 6px 6px"></div>
+
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@5.3.0/css/xterm.css"/>
     <script src="https://cdn.jsdelivr.net/npm/xterm@5.3.0/lib/xterm.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/xterm-addon-fit@0.8.0/lib/xterm-addon-fit.js"></script>
     <script>
-      const SID = (crypto.randomUUID ? crypto.randomUUID()
-                   : String(Date.now()) + Math.random());
-      const term = new Terminal({convertEol:false, cursorBlink:true,
-                                 fontFamily:'monospace', fontSize:13});
-      const fit = new FitAddon.FitAddon();
-      term.loadAddon(fit);
-      term.open(document.getElementById('term'));
-      fit.fit();
-      window.addEventListener('resize', () => fit.fit());
-
-      term.onData(d => {
-        fetch('/fm/term_in', {method:'POST',
-          headers:{'Content-Type':'application/json'},
-          body: JSON.stringify({sid: SID, data: d})});
-      });
-
-      async function poll(){
-        try{
-          const r = await fetch('/fm/term_out?sid=' + SID);
-          const j = await r.json();
-          if(j.data) term.write(j.data);
-        }catch(e){}
-        setTimeout(poll, 200);
+      let term, fit, current = null, cursor = 0, pollTimer = null;
+
+      function initTerm(){
+        document.getElementById('term').innerHTML = '';
+        term = new Terminal({convertEol:false, cursorBlink:true, fontFamily:'monospace', fontSize:13});
+        fit = new FitAddon.FitAddon();
+        term.loadAddon(fit);
+        term.open(document.getElementById('term'));
+        fit.fit();
+        term.onData(d => {
+          if(!current) return;
+          fetch('/fm/term_in', {method:'POST', headers:{'Content-Type':'application/json'},
+            body: JSON.stringify({name: current, data: d})});
+        });
+      }
+      window.addEventListener('resize', () => { if(fit) fit.fit(); });
+
+      async function refreshTabs(){
+        const r = await fetch('/fm/term_list');
+        const names = (await r.json()).sessions;
+        const wrap = document.getElementById('tabs');
+        wrap.innerHTML = '';
+        names.forEach(n => {
+          const t = document.createElement('span');
+          t.className = 'tab' + (n===current ? ' active':'');
+          t.textContent = n + '  ✕';
+          t.onclick = (e) => { attach(n); };
+          // click the ✕ area to close
+          t.oncontextmenu = (e)=>{ e.preventDefault(); closeSession(n); };
+          wrap.appendChild(t);
+        });
+        const add = document.createElement('span');
+        add.className = 'tab'; add.textContent = '＋ New';
+        add.onclick = newSession;
+        wrap.appendChild(add);
+        // if current session vanished, attach to first available
+        if(current && !names.includes(current)){ current = null; }
+        if(!current && names.length){ attach(names[0]); }
+      }
+
+      async function attach(name){
+        current = name; cursor = 0;
+        initTerm();
+        // replay full scrollback so you see what happened while away
+        const r = await fetch('/fm/term_snapshot?name=' + encodeURIComponent(name));
+        const j = await r.json();
+        term.write(j.data); cursor = j.cursor;
+        refreshTabs();
+        startPoll();
       }
-      poll();
+
+      function startPoll(){
+        if(pollTimer) clearTimeout(pollTimer);
+        async function poll(){
+          if(current){
+            try{
+              const r = await fetch('/fm/term_out?name=' + encodeURIComponent(current) + '&cursor=' + cursor);
+              const j = await r.json();
+              if(j.gone){ current = null; refreshTabs(); return; }
+              if(j.data) term.write(j.data);
+              cursor = j.cursor;
+            }catch(e){}
+          }
+          pollTimer = setTimeout(poll, 200);
+        }
+        poll();
+      }
+
+      async function newSession(){
+        const r = await fetch('/fm/term_new', {method:'POST'});
+        const j = await r.json();
+        await refreshTabs();
+        attach(j.name);
+      }
+
+      async function closeSession(name){
+        await fetch('/fm/term_close', {method:'POST', headers:{'Content-Type':'application/json'},
+          body: JSON.stringify({name})});
+        if(current===name) current=null;
+        refreshTabs();
+      }
+
+      // boot
+      (async () => {
+        await refreshTabs();
+        const r = await fetch('/fm/term_list');
+        const names = (await r.json()).sessions;
+        if(!names.length){ await newSession(); }
+      })();
     </script>"""
     return Response(PAGE.format(body=body))
 
+@app.route("/term_list")
+def term_list():
+    return Response(json.dumps({"sessions": list_shells()}), mimetype="application/json")
+
+@app.route("/term_new", methods=["POST"])
+def term_new():
+    return Response(json.dumps({"name": create_shell()}), mimetype="application/json")
+
+@app.route("/term_close", methods=["POST"])
+def term_close():
+    name = request.get_json(force=True).get("name")
+    sh = _shells.get(name)
+    if sh:
+        sh.kill()
+        del _shells[name]
+    return Response(json.dumps({"ok": True}), mimetype="application/json")
+
+@app.route("/term_snapshot")
+def term_snapshot():
+    sh = get_shell(request.args.get("name", ""))
+    if not sh:
+        return Response(json.dumps({"data": "", "cursor": 0, "gone": True}), mimetype="application/json")
+    data, cursor = sh.snapshot()
+    return Response(json.dumps({"data": data, "cursor": cursor}), mimetype="application/json")
+
 @app.route("/term_in", methods=["POST"])
 def term_in():
-    data = request.get_json(force=True)
-    get_shell(data.get("sid", "default")).write(data.get("data", ""))
-    return Response(json.dumps({"ok": True}), mimetype="application/json")
+    d = request.get_json(force=True)
+    sh = get_shell(d.get("name", ""))
+    if sh:
+        sh.write(d.get("data", ""))
+    return Response(json.dumps({"ok": bool(sh)}), mimetype="application/json")
 
 @app.route("/term_out")
 def term_out():
-    sid = request.args.get("sid", "default")
-    return Response(json.dumps({"data": get_shell(sid).read_new()}), mimetype="application/json")
-
-@app.route("/term_reset", methods=["POST"])
-def term_reset():
-    data = request.get_json(force=True)
-    sid = data.get("sid", "default")
-    if sid in _shells:
-        _shells[sid].kill()
-        del _shells[sid]
-    get_shell(sid)
-    return Response(json.dumps({"ok": True}), mimetype="application/json")
+    sh = get_shell(request.args.get("name", ""))
+    if not sh:
+        return Response(json.dumps({"gone": True}), mimetype="application/json")
+    cursor = int(request.args.get("cursor", 0))
+    data, newcur = sh.read_from(cursor)
+    return Response(json.dumps({"data": data, "cursor": newcur}), mimetype="application/json")
 
-# ---------------- FILE MANAGER ----------------
+# ---------------- FILE MANAGER (unchanged) ----------------
 @app.route("/")
 def browse():
     path = os.path.abspath(request.args.get("path", "/"))
@@ -285,7 +402,7 @@ def touch():
     if name:
         full = os.path.join(base, name)
         if not os.path.exists(full):
-            open(full, "a").close()   # create empty file
+            open(full, "a").close()
         return redirect(f"/fm/edit?path={urllib.parse.quote(full)}")
     return redirect(f"/fm/?path={urllib.parse.quote(base)}")
 
@@ -309,4 +426,4 @@ def delete():
 
 if __name__ == "__main__":
     wrapped = DispatcherMiddleware(Flask("empty"), {"/fm": app})
-    run_simple("0.0.0.0", 9001, wrapped, threaded=True)   # threaded for concurrent poll+input
+    run_simple("0.0.0.0", 9001, wrapped, threaded=True)