termcontext for remoteid terminals

src/model.ts

@@ -322,7 +322,7 @@ class ScreenWindow {
         }
         let cols = widthToCols(width);
         let usedRows = GlobalModel.getTUR(this.sessionId, cmdId, cols);
-        termWrap = new TermWrap(elem, this.sessionId, cmdId, usedRows, cmd.getTermOpts(), {height: 0, width: width}, cmd.handleKey.bind(cmd));
+        termWrap = new TermWrap(elem, {sessionId: this.sessionId, cmdId: cmdId}, usedRows, cmd.getTermOpts(), {height: 0, width: width}, cmd.handleKey.bind(cmd));
         this.terms[cmdId] = termWrap;
         return;
     }
@@ -636,6 +636,9 @@ class InputModel {
     infoMsg : OV<InfoType> = mobx.observable.box(null);
     infoTimeoutId : any = null;
 
+    ptyRemoteId : OV<string> = mobx.observable.box(null);
+    remoteTermWrap : TermWrap;
+
     constructor() {
         this.filteredHistoryItems = mobx.computed(() => {
             return this._getFilteredHistoryItems();
@@ -1404,12 +1407,25 @@ class Model {
     runUpdate_internal(genUpdate : UpdateMessage, uiContext : UIContextType, interactive : boolean) {
         if ("ptydata64" in genUpdate) {
             let ptyMsg : PtyDataUpdateType = genUpdate;
-            let activeScreen = this.getActiveScreen();
+            if (isBlank(ptyMsg.remoteid)) {
-            if (!activeScreen || activeScreen.sessionId != ptyMsg.sessionid) {
+                // regular update
+                let activeScreen = this.getActiveScreen();
+                if (!activeScreen || activeScreen.sessionId != ptyMsg.sessionid) {
+                    return;
+                }
+                activeScreen.updatePtyData(ptyMsg);
+                return;
+            }
+            else {
+                // remote update
+                let activeRemoteId = this.inputModel.ptyRemoteId.get();
+                if (activeRemoteId != ptyMsg.remoteid || this.inputModel.remoteTermWrap == null) {
+                    return;
+                }
+                let ptyData = base64ToArray(ptyMsg.ptydata64);
+                this.inputModel.remoteTermWrap.updatePtyData(ptyMsg.ptypos, ptyData);
                 return;
             }
-            activeScreen.updatePtyData(ptyMsg);
-            return;
         }
         let update : ModelUpdateType = genUpdate;
         if ("sessions" in update) {

src/term.ts

@@ -31,11 +31,12 @@ function boundInt(ival : number, minVal : number, maxVal : number) : number {
     return ival;
 }
 
+type TermContext = {sessionId? : string, cmdId? : string, remoteId? : string};
+
 // cmd-instance
 class TermWrap {
     terminal : any;
-    sessionId : string;
+    termContext : TermContext;
-    cmdId : string;
     atRowMax : boolean;
     usedRows : mobx.IObservableValue<number>;
     isFocused : mobx.IObservableValue<boolean> = mobx.observable.box(false, {name: "focus"});
@@ -49,9 +50,8 @@ class TermWrap {
     numParseErrors : number = 0;
     termSize : TermWinSize;
 
-    constructor(elem : Element, sessionId : string, cmdId : string, usedRows : number, termOpts : TermOptsType, winSize : WindowSize, keyHandler : (event : any) => void) {
+    constructor(elem : Element, termContext : TermContext, usedRows : number, termOpts : TermOptsType, winSize : WindowSize, keyHandler : (event : any) => void) {
-        this.sessionId = sessionId;
+        this.termContext = termContext;
-        this.cmdId = cmdId;
         this.connectedElem = elem;
         this.flexRows = termOpts.flexrows ?? false;
         this.winSize = winSize;
@@ -140,6 +140,12 @@ class TermWrap {
         if (this.terminal == null) {
             return;
         }
+        if (!this.flexRows) {
+            return;
+        }
+        if (this.termContext.remoteId != null) {
+            return;
+        }
         if (forceFull) {
             this.atRowMax = false;
         }
@@ -156,12 +162,12 @@ class TermWrap {
                 return;
             }
             this.usedRows.set(tur);
-            GlobalModel.setTUR(this.sessionId, this.cmdId, this.termSize, tur);
+            GlobalModel.setTUR(this.termContext.sessionId, this.termContext.cmdId, this.termSize, tur);
             if (this.connectedElem) {
                 let resizeEvent = new CustomEvent("termresize", {
                     bubbles: true,
                     detail: {
-                        cmdId: this.cmdId,
+                        cmdId: this.termContext.cmdId,
                         oldUsedRows: oldUsedRows,
                         newUsedRows: tur,
                     },
@@ -190,13 +196,22 @@ class TermWrap {
         this.updateUsedRows(true);
     }
 
+    _getReloadUrl() : string {
+        if (this.termContext.remoteId != null) {
+            return sprintf("http://localhost:8080/api/remote-pty?remoteid=%s", this.termContext.remoteId);
+        }
+        else {
+            return sprintf("http://localhost:8080/api/ptyout?sessionid=%s&cmdid=%s", this.termContext.sessionId, this.termContext.cmdId);
+        }
+    }
+
     reloadTerminal(delayMs : number) {
         if (this.terminal == null) {
             return;
         }
         this.reloading = true;
         this.terminal.reset();
-        let url = sprintf("http://localhost:8080/api/ptyout?sessionid=%s&cmdid=%s", this.sessionId, this.cmdId);
+        let url = this._getReloadUrl();
         let ptyOffset = 0;
         fetch(url).then((resp) => {
             if (!resp.ok) {
@@ -236,7 +251,7 @@ class TermWrap {
             return;
         }
         if (pos > this.ptyPos) {
-            throw new Error(sprintf("invalid pty-update, data-pos[%d] does not match term-pos[%d] cmdid[%s]", pos, this.ptyPos, this.cmdId));
+            throw new Error(sprintf("invalid pty-update, data-pos[%d] does not match term-pos[%d] cmdid[%s]", pos, this.ptyPos, JSON.stringify(this.termContext)));
         }
         if (pos < this.ptyPos) {
             let diff = this.ptyPos - pos;

src/types.ts

@@ -229,6 +229,7 @@ type CmdDataType = {
 type PtyDataUpdateType = {
     sessionid : string,
     cmdid : string,
+    remoteid : string,
     ptypos : number,
     ptydata64 : string,
     ptydatalen : number,