# `ImageDimensions`

An image's width and height in pixels: `1920x1080`.

Use it for photos and pictures. `media.fit` scales one to fit inside another. For video, use [`VideoResolution`](/docs/types/type-video-resolution.md). For a physical box, use [`Dimensions`](/docs/types/type-dimensions.md).

## Shape

| Field | Type | Required? |
|---|---|---|
| `width` | `Int` | Yes |
| `height` | `Int` | Yes |

## Example

```jadpo
ImageDimensions { width: 1920 height: 1080 }
```

`text.parse(raw, as: ImageDimensions)` reads one from text that comes from outside. Text that isn't one at all fails `malformed`, such as `0x1080`, `1920x0` or `1920X1080`.

This operation gives one: `media.fit`.

## Good to know

- Each side must be at least 1.
- `==` tells you whether two are the same. `<` and `list.sort_by` don't take it, so sort by one of its parts instead.

## In JSON

An object of its parts, in a request, a response or `json.write`:

```json
{"width":1,"height":1}
{"width":4000,"height":3000}
{"width":320,"height":240}
```

## Details

<details>
<summary>Text form, storage, how it is shown, and operations</summary>

`ImageDimensions` is in the group Media and visual, and has been in Jadpo since 0.1.0.

### Text form

`text.from` writes one standard text form, the same form `text.parse` reads back: `1x1`, `4000x3000` and `320x240`.

### How it is stored

It is stored in 2 columns, each named for the field, `_` and its suffix. This is `320x240`:

| Column | Type | Holds |
|---|---|---|
| `<field>_width` | `integer` | `320` |
| `<field>_height` | `integer` | `240` |

### How it is shown to people

`text.format(value, locale:)` shows it to people in their locale.

With `locale: Locale.en_gb`:

| Value | Shown |
|---|---|
| `1x1` | `1x1` |
| `4000x3000` | `4000x3000` |
| `320x240` | `320x240` |
| `2147483647x1` | `2147483647x1` |

### Operations

- `media.fit(dimensions: ImageDimensions, within: ImageDimensions) -> ImageDimensions`: `dimensions` scaled to fit inside `within`, keeping its aspect ratio and never made larger, each side rounded down to a whole pixel and never below 1, as CSS's `object-fit: scale-down` fits an image: `media.fit(photo, within: tile)`.

It also takes `text.parse`, `text.from`, `text.format`, `json.read`, `json.write` and `==`. [How every standard type behaves](/docs/every-standard-type-meets-one-contract.md) says how they work.

</details>