examples/basic-app.js


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

// Basic app demo:
// - Structuring a basic element tree
// - Creating a pane and text input
// - Using content width/height to layout elements
// - Subclassing a FocusElement and using its focused method
// - Sending a quit-app request via Control-C
//
// This script cannot actually be used on its own; see the examples on
// interfaces (command-line-interface.js and telnet-interface.js) for a
// working demo.

import {TextInput} from 'tui-lib/ui/controls'
import {Pane} from 'tui-lib/ui/presentation'
import {FocusElement} from 'tui-lib/ui/primitives'

export default class AppElement extends FocusElement {
  constructor() {
    super()

    this.pane = new Pane()
    this.addChild(this.pane)

    this.textInput = new TextInput()
    this.pane.addChild(this.textInput)
  }

  fixLayout() {
    this.w = this.parent.contentW
    this.h = this.parent.contentH

    this.pane.w = this.contentW
    this.pane.h = this.contentH

    this.textInput.x = 4
    this.textInput.y = 2
    this.textInput.w = this.pane.contentW - 8
  }

  focused() {
    this.root.select(this.textInput)
  }

  keyPressed(keyBuf) {
    if (keyBuf[0] === 0x03) { // 0x03 is Control-C
      this.emit('quitRequested')
      return 
    }

    super.keyPressed(keyBuf)
  }
}