1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
|
import chalk from "chalk";
import { type Key } from 'node:readline';
import { type Screen } from "./screen.ts";
export abstract class Element {
focusable: boolean = false;
focused: boolean = false;
// screen property is asigned by the addElement function of Scren
//@ts-ignore
screen: Screen;
abstract render(): void;
onkeypres(key: Key): void {};
}
export class Text extends Element {
text: string;
br: boolean;
constructor(text: string, br = false) {
super();
this.text = text;
}
render() {
process.stdout.write(this.text)
}
}
export class HR extends Element {
constructor() {
super()
}
render(): void {
console.log('-'.repeat(process.stdout.columns))
}
}
export class BR extends Element {
constructor() {
super()
}
render(): void {
console.log()
}
}
export class Input extends Element {
focusable: boolean = true;
value: string = "";
height: number = 1;
heightOffser: number = 1;
grow: number = 1;
textarea = false;
br = false;
isPassword: boolean = false;
render(): void {
let text = this.value
if (this.isPassword) text = text.replace(/[^]/g, '*');
if (this.focused) text += "_"
process.stdout.write(text)
}
onkeypres(key: Key): void {
//@ts-ignore
if (key.meta || key.code || ["return", "backspace"].includes(key.name)) {
switch (key.name) {
case "return":
if(this.textarea) {
this.value += '\n'
break;
}
this.focused = false;
const focusableIDs = Object.keys(this.screen.getFocusable());
const focusedIndex = focusableIDs.indexOf(this.screen.focusedElementId);
this.screen.focus(focusableIDs[(focusedIndex + 1) % focusableIDs.length]);
break;
case "backspace":
const prevValue = '' + this.value
// logs.push(`doing backspace : before ${prevValue}, after ${prevValue.substring(0, prevValue.length - 1)} : 0-${prevValue.length - 1}`)
this.value = prevValue.substring(0, prevValue.length - 1)
break;
}
this.screen.render()
return;
}
// check if the character ism't typable
// checks:
// sequience length > 1 (eg ^[ ^[[A)
// key name != sequence (and if name exists)
//@ts-ignore
if (!key.sequence || key.sequence.length > 1 || key.name != key.sequence?.toLowerCase() && !["space"].includes(key.name) && key.name) return;
this.value += key.sequence;
this.screen.render()
}
constructor(isPassword: boolean = false, br: boolean = false, textarea: boolean = false, height: number = 1, heightOffset: boolean = false, grow: boolean = false) {
super()
this.br = br
this.isPassword = isPassword;
this.textarea = textarea;
this.height = height;
this.heightOffset = heightOffset;
this.grow = grow;
}
}
export class Button extends Text {
focusable: boolean = true;
onclick: ()=>void;
constructor (text: string, onclick=()=>{}) {
super(text);
this.onclick = onclick
}
render(): void {
process.stdout.write(`(${(this.focused ? chalk.bgWhite : (a:string)=>a)(this.text)})`)
}
onkeypres(key: Key): void {
//@ts-ignore
if (["return", "space"].includes(key.name)) {
this.onclick.call(this.screen)
}
}
}
|