only allow input while connecting

This commit is contained in:
sawka 2022-09-16 12:02:46 -07:00
parent 44e014b1ae
commit 1d3d19b7c3
3 changed files with 43 additions and 1 deletions

View File

@ -777,10 +777,13 @@ class InfoMsg extends React.Component<{}, {}> {
</If>
</div>
</If>
<div className={cn("terminal-wrapper", {"focus": isTermFocused})} style={{overflowY: "hidden", display: (ptyRemoteId == null ? "none" : "block"), width: CellWidthPx*RemotePtyCols+15}}>
<div className={cn("terminal-wrapper", {"focus": isTermFocused}, (remote != null ? "status-" + remote.status : null))} style={{overflowY: "hidden", display: (ptyRemoteId == null ? "none" : "block"), width: CellWidthPx*RemotePtyCols+15}}>
<If condition={!isTermFocused}>
<div className="term-block" onClick={this.clickTermBlock}></div>
</If>
<If condition={inputModel.showNoInputMsg.get()}>
<div className="term-tag">input is only allowed while status is 'connecting'</div>
</If>
<div className="terminal" id="term-remote" data-remoteid={ptyRemoteId} style={{height: CellHeightPx*RemotePtyRows}}></div>
</div>
<If condition={infoMsg && infoMsg.infocomps != null && infoMsg.infocomps.length > 0}>

View File

@ -637,6 +637,8 @@ class InputModel {
infoMsg : OV<InfoType> = mobx.observable.box(null);
infoTimeoutId : any = null;
remoteTermWrap : TermWrap;
showNoInputMsg : OV<boolean> = mobx.observable.box(false);
showNoInputTimeoutId : any = null;
constructor() {
this.filteredHistoryItems = mobx.computed(() => {
@ -644,6 +646,22 @@ class InputModel {
});
}
setShowNoInputMsg(val : boolean) {
mobx.action(() => {
if (this.showNoInputTimeoutId != null) {
clearTimeout(this.showNoInputTimeoutId);
this.showNoInputTimeoutId = null;
}
if (val) {
this.showNoInputMsg.set(true);
this.showNoInputTimeoutId = setTimeout(() => this.setShowNoInputMsg(false), 2000);
}
else {
this.showNoInputMsg.set(false);
}
})();
}
_focusCmdInput() : void {
let elem = document.getElementById("main-cmd-input");
if (elem != null) {
@ -1108,6 +1126,14 @@ class InputModel {
}
termKeyHandler(remoteId : string, event : any) : void {
let remote = GlobalModel.getRemote(remoteId);
if (remote == null) {
return;
}
if (remote.status != "connecting") {
this.setShowNoInputMsg(true);
return;
}
let inputPacket : RemoteInputPacketType = {
type: "remoteinput",
remoteid: remoteId,

View File

@ -411,6 +411,7 @@ html, body, #main {
.cmd-input-info {
.terminal-wrapper {
position: relative;
background-color: #000;
padding: 2px 10px 5px 4px;
margin: 5px 5px 10px 5px;
@ -418,6 +419,18 @@ html, body, #main {
&.focus {
box-shadow: 0 0 3px 3px rgba(255, 255, 255, 0.3);
}
.term-tag {
position: absolute;
top: 0;
right: 0;
background-color: @term-red;
color: white;
z-index: 10;
font-size: 10px;
padding: 4px;
font-family: 'JetBrains Mono', monospace;
}
}
}