# Imaging

## Overview

Smartstore provides an imaging pipeline backed by [SixLabors ImageSharp](https://docs.sixlabors.com/). Images can be loaded, transformed and re-encoded on the fly. Results are cached under `media/Thumbs` so repeated requests are served quickly.

## Processing images

`IImageProcessor` orchestrates resizing and encoding. Describe the operation with `ProcessImageQuery` and pass it to `ProcessImageAsync`:

```csharp
var query = new ProcessImageQuery("~/wwwroot/images/sample.jpg")
{
    MaxWidth = 300,
    MaxHeight = 200,
    Quality = 80,
    ScaleMode = "crop"
};

using var result = await _imageProcessor.ProcessImageAsync(query);
await result.Image.SaveAsync("~/wwwroot/output/thumb.jpg");
```

### Query tokens

`ProcessImageQuery` accepts these standard tokens:

| Token    | Description                                                   |
| -------- | ------------------------------------------------------------- |
| `w`, `h` | width/height in pixels                                        |
| `size`   | apply same size to both dimensions                            |
| `q`      | JPEG quality (0-100)                                          |
| `m`      | scale mode (`max`, `crop`, `pad`, `stretch`, `boxpad`, `min`) |
| `pos`    | crop anchor (`top`, `bottom-right`, …)                        |

Tokens are validated so unsupported sizes or values are rejected before processing.

## Caching and URLs

The processor cooperates with `IImageCache` and `IMediaService` to produce predictable thumb paths like `/media/thumbs/0001/1234567-photo-w300-h200.jpg`. `MediaService.GetUrl` generates these URLs and the cache ensures that subsequent requests reuse the processed file.

## Extensibility

Two events wrap the pipeline:

* `ImageProcessingEvent` fires before transformations are applied, enabling custom effects.
* `ImageProcessedEvent` runs after processing to inspect or replace the result.

You can adjust defaults such as quality, resampling mode and cache location via `MediaSettings`.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dev.smartstore.com/framework/content/imaging.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.