diff --git a/src/main.tsx b/src/main.tsx
index 3d2f44b9..c777c8b2 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -14,6 +14,11 @@ import {GlobalModel, GlobalCommandRunner, Session, Cmd, Window, Screen, ScreenWi
dayjs.extend(localizedFormat)
+const CellHeightPx = 16;
+const CellWidthPx = 8;
+const RemotePtyRows = 10;
+const RemotePtyCols = 80;
+
type InterObsValue = {
sessionid : string,
windowid : string,
@@ -343,11 +348,9 @@ class LineCmd extends React.Component<{sw : ScreenWindow, line : LineType, width
);
}
let termLoaded = this.termLoaded.get();
- let cellHeightPx = 16;
- let cellWidthPx = 8;
- let termWidth = Math.max(Math.trunc((width - 20)/cellWidthPx), 10);
+ let termWidth = Math.max(Math.trunc((width - 20)/CellWidthPx), 10);
let usedRows = sw.getUsedRows(cmd, width);
- let totalHeight = cellHeightPx * usedRows;
+ let totalHeight = CellHeightPx * usedRows;
let remote = model.getRemote(cmd.remoteId);
let status = cmd.getStatus();
let termOpts = cmd.getTermOpts();
@@ -679,6 +682,14 @@ class InfoMsg extends React.Component<{}, {}> {
}
return s.substr(slashIdx+1);
}
+
+ @boundMethod
+ clickTermBlock(e : any) {
+ let inputModel = GlobalModel.inputModel;
+ if (inputModel.remoteTermWrap != null) {
+ inputModel.remoteTermWrap.terminal.focus();
+ }
+ }
render() {
let model = GlobalModel;
@@ -688,6 +699,9 @@ class InfoMsg extends React.Component<{}, {}> {
let line : string = null;
let istr : string = null;
let idx : number = 0;
+ let ptyRemoteId = (infoMsg == null ? null : infoMsg.ptyremoteid);
+ let isTermFocused = (inputModel.remoteTermWrap == null ? false : inputModel.remoteTermWrap.isFocused.get());
+ console.log("ptyremoteid", ptyRemoteId);
return (
@@ -707,6 +721,12 @@ class InfoMsg extends React.Component<{}, {}> {
+
0}>
diff --git a/src/model.ts b/src/model.ts
index 184ebf89..b706cc59 100644
--- a/src/model.ts
+++ b/src/model.ts
@@ -11,6 +11,8 @@ import {WSControl} from "./ws";
var GlobalUser = "sawka";
const DefaultCellWidth = 8;
const DefaultCellHeight = 16;
+const RemotePtyRows = 10; // also in main.tsx
+const RemotePtyCols = 80;
function widthToCols(width : number) : number {
let cols = Math.trunc((width - 25) / DefaultCellWidth) - 1;
@@ -635,8 +637,6 @@ class InputModel {
infoMsg : OV = mobx.observable.box(null);
infoTimeoutId : any = null;
-
- ptyRemoteId : OV = mobx.observable.box(null);
remoteTermWrap : TermWrap;
constructor() {
@@ -668,6 +668,14 @@ class InputModel {
}
}
+ getPtyRemoteId() : string {
+ let info = this.infoMsg.get();
+ if (info == null || isBlank(info.ptyremoteid)) {
+ return null;
+ }
+ return info.ptyremoteid;
+ }
+
hasFocus() : boolean {
let mainInputElem = document.getElementById("main-cmd-input");
if (document.activeElement == mainInputElem) {
@@ -994,6 +1002,7 @@ class InputModel {
this._clearInfoTimeout();
mobx.action(() => {
this.infoMsg.set(info);
+ this.syncTermWrap();
if (info == null) {
this.infoShow.set(false);
}
@@ -1041,6 +1050,7 @@ class InputModel {
this.infoShow.set(false);
if (setNull) {
this.infoMsg.set(null);
+ this.syncTermWrap();
}
})();
}
@@ -1093,10 +1103,40 @@ class InputModel {
this.resetHistory();
this.dropModHistory(false);
this.infoMsg.set(null);
+ this.syncTermWrap();
this._clearInfoTimeout();
})();
}
+ termKeyHandler(e : any) : void {
+ console.log("term-remote key", e);
+ }
+
+ syncTermWrap() : void {
+ let infoMsg = this.infoMsg.get();
+ let remoteId = (infoMsg == null ? null : infoMsg.ptyremoteid);
+ let curTermRemoteId = (this.remoteTermWrap == null ? null : this.remoteTermWrap.termContext.remoteId);
+ if (remoteId == curTermRemoteId) {
+ return;
+ }
+ if (this.remoteTermWrap != null) {
+ this.remoteTermWrap.dispose();
+ this.remoteTermWrap = null;
+ console.log("dispose termwrap");
+ }
+ if (remoteId != null) {
+ let elem = document.getElementById("term-remote");
+ if (elem == null) {
+ console.log("ERROR null term-remote element");
+ }
+ else {
+ let termOpts = {rows: RemotePtyRows, cols: RemotePtyCols, flexrows: false, maxptysize: 64*1024};
+ this.remoteTermWrap = new TermWrap(elem, {remoteId: remoteId}, RemotePtyRows, termOpts, null, this.termKeyHandler.bind(this));
+ console.log("make termwrap", this.remoteTermWrap);
+ }
+ }
+ }
+
getCurLine() : string {
let model = GlobalModel;
let hidx = this.historyIndex.get();
@@ -1418,7 +1458,7 @@ class Model {
}
else {
// remote update
- let activeRemoteId = this.inputModel.ptyRemoteId.get();
+ let activeRemoteId = this.inputModel.getPtyRemoteId();
if (activeRemoteId != ptyMsg.remoteid || this.inputModel.remoteTermWrap == null) {
return;
}
diff --git a/src/sh2.less b/src/sh2.less
index 41f82b78..85e55d9b 100644
--- a/src/sh2.less
+++ b/src/sh2.less
@@ -409,6 +409,18 @@ html, body, #main {
}
}
+.cmd-input-info {
+ .terminal-wrapper {
+ background-color: #000;
+ padding: 2px 10px 5px 4px;
+ margin: 5px 5px 10px 5px;
+ box-shadow: 0 0 1px 1px rgba(255, 255, 255, 0.3);
+ &.focus {
+ box-shadow: 0 0 3px 3px rgba(255, 255, 255, 0.3);
+ }
+ }
+}
+
.line {
padding: 10px 5px 5px 5px;
margin: 0px 5px 5px 5px;
diff --git a/src/term.ts b/src/term.ts
index cc4f28d1..1b2c8025 100644
--- a/src/term.ts
+++ b/src/term.ts
@@ -63,9 +63,14 @@ class TermWrap {
this.atRowMax = true;
this.usedRows = mobx.observable.box(termOpts.rows);
}
- let cols = Math.trunc((winSize.width - 25) / DefaultCellWidth) - 1;
- cols = boundInt(cols, MinTermCols, MaxTermCols);
- this.termSize = {rows: termOpts.rows, cols: cols};
+ if (winSize == null) {
+ this.termSize = {rows: termOpts.rows, cols: termOpts.cols};
+ }
+ else {
+ let cols = Math.trunc((winSize.width - 25) / DefaultCellWidth) - 1;
+ cols = boundInt(cols, MinTermCols, MaxTermCols);
+ this.termSize = {rows: termOpts.rows, cols: cols};
+ }
this.terminal = new Terminal({rows: this.termSize.rows, cols: this.termSize.cols, fontSize: 14, theme: {foreground: "#d3d7cf"}});
this.terminal._core._inputHandler._parser.setErrorHandler((state) => {
this.numParseErrors++;
diff --git a/src/types.ts b/src/types.ts
index 01bbe909..e826ae4e 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -270,6 +270,7 @@ type InfoType = {
infocomps? : string[],
infocompsmore? : boolean,
timeoutms? : number,
+ ptyremoteid? : string,
};
type HistoryQueryOpts = {