# Owner: glow
# KeyID: E65A8520F36AEE13CFE4F56BEB8FE331063A4794
# Key: https://glow.li/pgp
# Verify: curl "https://glow.li/posts/pkmn/index.html.asc" | gpg
-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA512

+++
{
    "css": ["iframe.css"],
    "date": "2023-05-25",
    "description": "I converted all Pokémon sprites to ANSI, so you can view them in you terminal (or browser)",
    "layout": "post",
    "sharingimage": "media/images/pkmn-preview",
    "tags": [
        "Technology",
        "Showcase",
        "Terminal",
        "Web_Development",
        "Project",
        "CLI"
    ],
    "title": "pkmn.li: Pokémon sprites in your terminal"
}
+++
<div class="iframe-wrapper ratio-square">
    <iframe title="<?= pkmnUrl(true) ?>" src="<?= pkmnUrl(true, "gen5/") ?>"></iframe>
</div>

I converted all Pokémon sprites to ANSI, so you can view them in you terminal (or browser).

## Get a random Pokémon in your terminal

```
curl <?= pkmnUrl() ?>

```

You can also view it in the browser: [<?= pkmnUrl() ?>](<?= pkmnUrl(true) ?>)

You will need [true color support](https://github.com/termstandard/colors#fully-supporting) in your terminal.

<!--more-->

[toc]

## Get a specific Pokémon

```
curl <?= pkmnUrl(false,"25/"); ?>

```

[<?= pkmnUrl(true,"25/") ?>](<?= pkmnUrl(true,"25/") ?>)

### Get a random Pokémon from a specific generation

<?php

foreach (['gen1', 'gen2', 'gen3', 'gen4', 'gen5', 'gen6', 'gen7', 'icons'] as $path) {?>

#### <?= $path ?>

<div class="iframe-wrapper ratio-square">
    <iframe title="<?= pkmnUrl(true, "{$path}/") ?>" src="<?= pkmnUrl(true,"{$path}/25") ?>"></iframe>
</div>

```
curl <?= pkmnUrl(false,"{$path}/"); ?>

```

[<?= pkmnUrl(true,"{$path}/") ?>](<?= pkmnUrl(true,"{$path}/") ?>)

<?php } ?>

## Other languages

If you want to have the names and flavor text in another language you can use the `lang` parameter.

```
curl <?= pkmnUrl(false,"?lang=de"); ?>

curl <?= pkmnUrl(false,"25/?lang=es"); ?>

```

- - [<?= pkmnUrl(false,"?lang=de") ?>](<?= pkmnUrl(true,"?lang=de") ?>)
- - [<?= pkmnUrl(false,"25/?lang=es") ?>](<?= pkmnUrl(true,"25/?lang=es") ?>)

### The following languages are available

- - `ja-Hrkt`
- - `roomaji`
- - `ko`
- - `zh-Hant`
- - `fr`
- - `de`
- - `es`
- - `it`
- - `en`
- - `cs`
- - `ja`
- - `zh-Hans`
- - `pt-BR`

## Data

I am using the [PokeAPI sprites](https://github.com/PokeAPI/sprites) for the images and the [PokeAPI api-data](https://github.com/PokeAPI/api-data) for the flavor text (Pokédex entries). I am generating all Pokémon from the static data in the repositories. I am not actually using the PokeAPI.

## Creating ANSI from the sprites

To create the ANSI from the sprites I am using the Rust program [viu](https://github.com/atanunq/viu).
Generating html from ANSI is actually rather difficult. Unlike with [<?= aareUrl(); ?>](<?= postUrl('aare.li'); ?>), where I am using [ansi-escape-to-html](https://github.com/neilime/ansi-escapes-to-html) directly in the PHP script, this doesn't work with the Pokémon sprites as they are true color (24 million colors). I haven't found a php package that supports true color ANSI. But the Python package [ansi2html](https://github.com/pycontribs/ansi2html) does, so I am using that.
-----BEGIN PGP SIGNATURE-----

iQIzBAEBCgAdFiEE5lqFIPNq7hPP5PVr64/jMQY6R5QFAmd9D6kACgkQ64/jMQY6
R5TC8xAAozss8SSHeZoMczxGe9sl5BMMtDkMwNymnETHnyVixUtGnKi/Iu931bE1
6RhdgDcJSDddZ4rKDbKZo9bY+uXg1v/d6SgzcGKe4OYClc86ugD+3zlxFysQv5wh
ECWa/d5XM/YBZHxZEJiixbXwVNlXO9JA9LHtG4VwCZOOaq6bC/CHYxVoY0buVTbo
VaEd8R/OZuoP32n6tVS6fKNojKKQXQOp+IuDmOa5QNdjEwhNg7RMhagpr9srS08Q
rtgcLU2hW1b8Id3k0lF9vbgCVoi10CJAkEFcBUqDPFfsNOxE9+eukylzLlN1aohX
gRzQGuLkruEUWqNN8B5ygyxuuQfjiBlJkPD4WUwlRxWf/FnIQvYmd4pHHhG+FkVH
SUvAo9fqQ1v/mlCzxtq3jPIZO54FP/EMwefxk9nEo8XTdvcuilNvfYK7heEyK9p7
aaS8orN9w2GtA++Ui3iDZGdd9YqDOV19YAwB5eruqLqpO7N/c24EhH75S2ApzW34
oeOZ0qEfMGi6ee8mlkHahrHDzoMaRJE6HNxl31CQiZpP93TgBJIzOiYlA3PA1tK6
Pw1yZ4USbekLp3CsCOWQ9iGQJF7mkUEK+izhFwsnxxFCYshXkufI4bcLfSD/TxDn
myDT1NDZ8fUEMATNprvfg0WWJyM7iLm9AEKC4h2RlNccW3kpGFM=
=iL7N
-----END PGP SIGNATURE-----