mirror of
https://github.com/wavetermdev/waveterm.git
synced 2024-12-21 16:38:23 +01:00
layout tests, checkpoint
This commit is contained in:
sawka
parent
fe3ffd1545
commit
e0427e5ed4
@ -1,3 +1,4 @@
|
||||
github.com/aws/aws-sdk-go-v2/service/s3 v1.27.11 h1:3/gm/JTX9bX8CpzTgIlrtYpB3EVBDxyg/GY/QdcIEZw=
|
||||
github.com/google/go-querystring v1.1.0 h1:AnCroh3fv4ZBgVIf1Iwtovgjaw/GiKJo8M8yD/fhyJ8=
|
||||
github.com/kevinburke/ssh_config v1.2.0 h1:x584FjTGwHzMwvHx18PXxbBVzfnxogHaAReU4gf13a4=
|
||||
github.com/kevinburke/ssh_config v1.2.0/go.mod h1:CT57kijsi8u/K/BOFA39wgDQJ9CxiF4nAY/ojJ6r6mM=
|
||||
|
||||
@ -8,6 +8,10 @@
|
||||
}
|
||||
|
||||
:root {
|
||||
/* updated by GlobalModel to user's preferred fontsize */
|
||||
--termfontsize: 12px;
|
||||
--termlineheight: 15px;
|
||||
|
||||
--fa-style-family: "Font Awesome 6 Sharp";
|
||||
}
|
||||
|
||||
|
||||
@ -753,32 +753,6 @@ class LineCmd extends React.Component<
|
||||
/>
|
||||
</If>
|
||||
</ErrorBoundary>
|
||||
<If condition={cmd.getRtnState()}>
|
||||
<div
|
||||
key="rtnstate"
|
||||
className="cmd-rtnstate"
|
||||
style={{
|
||||
visibility: cmd.getStatus() == "done" ? "visible" : "hidden",
|
||||
}}
|
||||
>
|
||||
<If condition={rsdiff == null || rsdiff == ""}>
|
||||
<div className="cmd-rtnstate-label">state unchanged</div>
|
||||
<div className="cmd-rtnstate-sep"></div>
|
||||
</If>
|
||||
<If condition={rsdiff != null && rsdiff != ""}>
|
||||
<div className="cmd-rtnstate-label">new state</div>
|
||||
<div className="cmd-rtnstate-sep"></div>
|
||||
<div className="cmd-rtnstate-diff" style={{ fontSize: rtnStateDiffSize }}>
|
||||
<div className="cmd-rtnstate-diff-inner">{this.rtnStateDiff.get()}</div>
|
||||
</div>
|
||||
</If>
|
||||
</div>
|
||||
</If>
|
||||
<If condition={isSelected && !isFocused && rendererType == "terminal"}>
|
||||
<div className="cmd-hints">
|
||||
<div className="hint-item color-nohover-white">focus line ({renderCmdText("L")})</div>
|
||||
</div>
|
||||
</If>
|
||||
</If>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -23,18 +23,9 @@
|
||||
|
||||
.line.line-cmd {
|
||||
flex-direction: column;
|
||||
scroll-margin-bottom: 20px;
|
||||
scroll-margin-bottom: var(--termlineheight);
|
||||
position: relative;
|
||||
|
||||
.plus {
|
||||
opacity: 0.5;
|
||||
}
|
||||
&:hover {
|
||||
.plus {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-message {
|
||||
color: @term-yellow;
|
||||
}
|
||||
@ -45,13 +36,14 @@
|
||||
padding-bottom: 0.7rem;
|
||||
width: 100%;
|
||||
line-height: 1.2;
|
||||
height: calc(var(--termlineheight) * 2);
|
||||
|
||||
&.is-expanded {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
&.hide-prompt {
|
||||
height: 32px;
|
||||
height: calc(var(--termlineheight) * 2);
|
||||
}
|
||||
|
||||
.line-icon {
|
||||
@ -81,16 +73,12 @@
|
||||
display: block;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.meta.meta-line1 {
|
||||
margin-left: 2px;
|
||||
color: rgba(@base-color, 0.6) !important;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
&.has-rtnstate .terminal-wrapper {
|
||||
padding-bottom: 0;
|
||||
.meta.meta-line1 {
|
||||
margin-left: 2px;
|
||||
color: rgba(@base-color, 0.6) !important;
|
||||
font-size: var(--termfontsize);
|
||||
}
|
||||
}
|
||||
|
||||
.image-wrapper {
|
||||
@ -113,11 +101,6 @@
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.terminal {
|
||||
margin-right: 8px;
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
&.cmd-done .terminal .xterm-cursor {
|
||||
display: none;
|
||||
}
|
||||
@ -208,7 +191,6 @@
|
||||
|
||||
.simple-line-header {
|
||||
display: flex;
|
||||
margin-top: 5px;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
@ -350,14 +332,9 @@
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.simple-line-status {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.user {
|
||||
color: lighten(@soft-blue, 10%);
|
||||
font-weight: bold;
|
||||
margin-top: 1px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
@ -365,12 +342,10 @@
|
||||
.termopts,
|
||||
.renderer {
|
||||
display: flex;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.renderer {
|
||||
margin-left: 3px;
|
||||
margin-top: 5px;
|
||||
svg {
|
||||
width: 1em;
|
||||
margin-right: 0.5em;
|
||||
@ -381,7 +356,6 @@
|
||||
.settings {
|
||||
display: none;
|
||||
margin-left: 0.5em;
|
||||
margin-top: 0.65em;
|
||||
cursor: pointer;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
@ -396,7 +370,6 @@
|
||||
}
|
||||
|
||||
.termopts {
|
||||
margin-top: 5px;
|
||||
display: none;
|
||||
.resize-button {
|
||||
cursor: pointer;
|
||||
@ -407,7 +380,6 @@
|
||||
|
||||
.metapart-mono {
|
||||
margin-left: 8px;
|
||||
margin-top: 4px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@ -482,10 +454,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.line:nth-child(2) {
|
||||
padding-top: 1px;
|
||||
}
|
||||
|
||||
.lines-spacer {
|
||||
flex-grow: 1;
|
||||
}
|
||||
@ -493,7 +461,8 @@
|
||||
.line-sep {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 1em;
|
||||
height: var(--termlineheight);
|
||||
font-size: var(--termfontsize);
|
||||
color: rgba(@base-color, 0.5);
|
||||
}
|
||||
|
||||
|
||||
@ -8,6 +8,7 @@ import { sprintf } from "sprintf-js";
|
||||
import { App } from "@/app/app";
|
||||
import * as DOMPurify from "dompurify";
|
||||
import { loadFonts } from "./util/util";
|
||||
import * as textmeasure from "./util/textmeasure";
|
||||
|
||||
// @ts-ignore
|
||||
let VERSION = __WAVETERM_VERSION__;
|
||||
@ -33,5 +34,6 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
(window as any).mobx = mobx;
|
||||
(window as any).sprintf = sprintf;
|
||||
(window as any).DOMPurify = DOMPurify;
|
||||
(window as any).textmeasure = textmeasure;
|
||||
|
||||
console.log("WaveTerm", VERSION, BUILD);
|
||||
|
||||
@ -189,6 +189,10 @@ class Model {
|
||||
}
|
||||
return fontSize;
|
||||
});
|
||||
mobx.autorun(() => {
|
||||
const fontSize = this.termFontSize.get();
|
||||
this._setCssTermFontSize(fontSize);
|
||||
});
|
||||
getApi().onTCmd(this.onTCmd.bind(this));
|
||||
getApi().onICmd(this.onICmd.bind(this));
|
||||
getApi().onLCmd(this.onLCmd.bind(this));
|
||||
@ -345,16 +349,10 @@ class Model {
|
||||
return appconst.ProdServerEndpoint;
|
||||
}
|
||||
|
||||
setTermFontSize(fontSize: number) {
|
||||
if (fontSize < appconst.MinFontSize) {
|
||||
fontSize = appconst.MinFontSize;
|
||||
}
|
||||
if (fontSize > appconst.MaxFontSize) {
|
||||
fontSize = appconst.MaxFontSize;
|
||||
}
|
||||
mobx.action(() => {
|
||||
this.termFontSize.set(fontSize);
|
||||
})();
|
||||
_setCssTermFontSize(fontSize: number) {
|
||||
const root = document.documentElement;
|
||||
root.style.setProperty("--termfontsize", fontSize + "px");
|
||||
root.style.setProperty("--termlinehight", Math.ceil(fontSize * 1.2) + "px");
|
||||
}
|
||||
|
||||
getBaseWsHostPort(): string {
|
||||
|
||||
76
wavesrv/pkg/sstore/disp.go
Normal file
76
wavesrv/pkg/sstore/disp.go
Normal file
@ -0,0 +1,76 @@
|
||||
// Copyright 2023, Command Line Inc.
|
||||
// SPDX-License-Identifier: Apache-2.0
|
||||
|
||||
package sstore
|
||||
|
||||
import "sync"
|
||||
|
||||
// This file contains structures related to holding display state for screens / UI
|
||||
|
||||
const (
|
||||
// ideal sizes for Sections/Zone
|
||||
// we allow these to drift a bit to deal with adding/removing lines
|
||||
DispZoneLines = 16 * 16
|
||||
DispSectionLines = 16
|
||||
DispMaxRatio = 1.6
|
||||
)
|
||||
|
||||
// this will be a map at some point when we have multiple windows, singleton for now
|
||||
var GlobalDisplayState *DispWindowInfo
|
||||
|
||||
// (row, px) <- we use this format so JS is
|
||||
type DispHeight [2]int
|
||||
type DispLineRange [2]int // [start, end] (inclusive). set to [0,0] if no lines
|
||||
|
||||
// this struct comes from the FE
|
||||
type DispWindowInfo struct {
|
||||
Lock *sync.Mutex `json:"-"`
|
||||
ActiveSessionId string `json:"activesessionid"`
|
||||
ActiveScreenId string `json:"activescreenid"`
|
||||
Screens map[string]DispScreenInfo `json:"screens"` // key is "sessionid:screenid" (not a struct for JS integration)
|
||||
}
|
||||
|
||||
type DispScreenInfo struct {
|
||||
SessionId string `json:"sessionid"`
|
||||
ScreenId string `json:"screenid"`
|
||||
SelectedLine int `json:"selectedline"`
|
||||
AnchorLine int `json:"anchorline"`
|
||||
AnchorOffset int `json:"anchoroffset"`
|
||||
}
|
||||
|
||||
type DispZoneInfo struct {
|
||||
ScreenId string `json:"screenid"`
|
||||
ZoneId int `json:"zoneid"`
|
||||
Height DispHeight `json:"height"`
|
||||
NumLines int `json:"numlines"`
|
||||
LineRange DispLineRange `json:"linerange"`
|
||||
}
|
||||
|
||||
type DispSectionInfo struct {
|
||||
ScreenId string `json:"screenid"`
|
||||
ZoneId int `json:"zoneid"`
|
||||
SectionId int `json:"sectionid"`
|
||||
Height DispHeight `json:"height"`
|
||||
LineRange DispLineRange `json:"linerange"`
|
||||
Parts []DispLineInfo `json:"parts"`
|
||||
}
|
||||
|
||||
// includes separators. combined into one struct for efficiency / JS transport
|
||||
type DispLineInfo struct {
|
||||
// for separators
|
||||
IsSep bool `json:"issep,omitempty"`
|
||||
SepString string `json:"sepstring,omitempty"`
|
||||
|
||||
// for lines
|
||||
LineId string `json:"lineid,omitempty"`
|
||||
LineNum int `json:"linenum,omitempty"`
|
||||
LineType string `json:"linetype,omitempty"`
|
||||
Ts int64 `json:"ts,omitempty"`
|
||||
Status string `json:"status,omitempty"`
|
||||
Renderer string `json:"renderer,omitempty"`
|
||||
Prompt string `json:"prompt,omitempty"`
|
||||
CmdStr string `json:"cmdstr,omitempty"`
|
||||
Min bool `json:"min,omitempty"`
|
||||
TermOpts string `json:"termopts,omitempty"`
|
||||
Height DispHeight `json:"height,omitempty"`
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user