App constructor

App(String header, { String? left = 'Left', String? right = 'Right', String? enter = 'Enter', dynamic onLeft(App app)?, dynamic onRight(App app)?, dynamic onEnter(App app)?, })

Implementation

App(
  String header, {
  this.left = 'Left',
  this.right = 'Right',
  this.enter = 'Enter',
  this.onLeft,
  this.onRight,
  this.onEnter,
}) {
  document.head!.title = 'Snowqueen';

  final headerDiv = DivElement()
    ..id = 'header'
    ..text = header;

  _app.children.add(headerDiv);

  _toast = DivElement()..className = 'toast';
  _toast.text = 'This is a toast message';
  _app.children.add(_toast);

  _content = DivElement()..id = 'content';
  _app.children.add(_content);

  final softkeys = DivElement()..className = 'softkeys';

  softkeys.children.addAll([
    if (left != null)
      DivElement()
        ..className = 'softkey softkey-left'
        ..innerText = left!,
    if (enter != null)
      DivElement()
        ..className = 'softkey softkey-center'
        ..innerText = enter!,
    if (right != null)
      DivElement()
        ..className = 'softkey softkey-right'
        ..innerText = right!,
  ]);
  _app.children.add(softkeys);

  void handleKeyDown(evt) {
    final target = switch (evt.key) {
      'SoftLeft' => onLeft,
      'SoftRight' => onRight,
      'Enter' => (_) => _content.children.elementAt(focused).click,
      _ => null,
    };

    if (target == null) return;
    target(this);
  }

  document.addEventListener('keydown', handleKeyDown);

  void handleKeydown(e) {
    switch (e.key) {
      case 'ArrowUp':
        nav(-1);
        break;
      case 'ArrowDown':
        nav(1);
        break;
      case 'ArrowRight':
        nav(1);
        break;
      case 'ArrowLeft':
        nav(-1);
        break;
    }
  }

  document.activeElement!.addEventListener('keydown', handleKeydown);
}