diff --git a/src/main.tsx b/src/main.tsx index 436ab9414..a89a4c57c 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -31,6 +31,8 @@ type OV = mobx.IObservableValue; type OArr = mobx.IObservableArray; type OMap = mobx.ObservableMap; +type VisType = "visible" | ""; + type HeightChangeCallbackType = (lineNum : number, newHeight : number, oldHeight : number) => void; type RendererComponentProps = {sw : ScreenWindow, line : LineType, width : number, staticRender : boolean, visible : OV, onHeightChange : HeightChangeCallbackType, collapsed : boolean}; @@ -687,17 +689,51 @@ class LineCmd extends React.Component<{sw : ScreenWindow, line : LineType, width this.props.collapsed.set(!isCollapsed); })(); } + + getLineDomId() : string { + let {line} = this.props; + return "line-" + getLineId(line); + } + + renderSimple() { + let {sw, line, width, topBorder} = this.props; + let cmd = GlobalModel.getCmd(line); + let usedRows = sw.getUsedRows(line, cmd, width); + let mainDivCn = cn( + "line", + "line-cmd", + {"top-border": topBorder}, + ); + // header is 36px tall, padding+border = 6px + // zero-terminal is 0px + // terminal-wrapper overhead is 11px (margin/padding) + // each terminal line 16px + // inner-height, if zero-lines => 42 + // else: 53+(lines*16) + let height = 42; // height of zero height terminal + if (usedRows > 0) { + height = 53 + termHeightFromRows(usedRows); + } + return ( +
+ +
+ ); + } render() { let {sw, line, width, staticRender, visible, topBorder} = this.props; let model = GlobalModel; let lineid = line.lineid; let isVisible = visible.get(); + if (staticRender || !isVisible) { + return this.renderSimple(); + } let formattedTime = getLineDateTimeStr(line.ts); let cmd = model.getCmd(line); if (cmd == null) { return ( -
+
[cmd not found '{line.cmdid}']
); @@ -734,6 +770,7 @@ class LineCmd extends React.Component<{sw : ScreenWindow, line : LineType, width if (line.renderer == "image") { RendererComponent = ImageRenderer; } + return (