> ## Documentation Index
> Fetch the complete documentation index at: https://ej3mplo.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Controller and keyboard

> ejg.input: navigation actions and control hints.

```js theme={null}
ejg.input.on("nav", (e) => {
  // e.action: up down left right accept back x y lb rb lt rt menu view
  // e.source: "keyboard" | "gamepad"; e.repeat: while held down
  if (e.action === "back" && somethingOpen) { close(); e.preventDefault(); }
});
```

Keyboard: arrows, Enter/Space (accept), Esc/Backspace (back), **E** (x),
**F** (y), Page Up/Page Down (lb/rb), Tab (rb). **Ctrl+E** (Explore) and **Ctrl+J**
(Downloads) are handled by the host.

If you do not mark a `back` as handled, the host uses it: it closes whatever it
has open and, in Big Picture with nothing open, opens the quick menu. The
controller's Guide button always opens the host's quick menu.

## Control hints (controller or keyboard)

`ejg.input.source` says what was used last (`"gamepad"`, `"keyboard"` or
`"mouse"`) and `ejg.input.pad` says which controller it is (`"xbox"`, `"playstation"`,
`"nintendo"` or `"generic"`). The `<html>` element carries `data-input` and `data-pad`,
and `ejg.on("input", …)` reports changes. The easiest way is the kit:

```js theme={null}
import { hints } from "/_sdk/kit/hints.js";
const bar = hints(document.querySelector("#hints"), [["accept", "Jugar"], ["back", "Atrás"], ["y", "Favorito"]]);
bar.set([["accept", "Instalar"]]);   // change the texts when you need to
```

With a PlayStation controller you see ✕ ○ △ □. With an Xbox one, A B X Y in their
colors. With a keyboard, Enter, Esc, E and F. It updates itself. CSS trick:
`html[data-input="mouse"] .hints { display: none; }`.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.