mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
SnapOtterandGitHub
ecc0a45f0e
* fix(docs): keep gray-matter on js-yaml 3 so the docs site builds The js-yaml >=4.2.0 override from #257 forced js-yaml 4 onto gray-matter (used by vitepress and vitepress-plugin-llms), which calls the removed yaml.safeLoad and broke `vitepress build`. Scope a gray-matter>js-yaml ^3.14.1 override so gray-matter keeps the v3 API (build-time, trusted frontmatter only) while app code stays on js-yaml 4.2.0+. * docs: add per-tool reference pages for all 157 tools, with a modality sidebar Generate /tools/<id> pages for the 104 tools that lacked one (video 29, audio 17, document 36, data 10, and 12 newer image tools), matching the existing page format (API endpoint, parameters from the OpenAPI spec, curl example, response, notes). Async/AI tools document the 202+SSE flow and feature-bundle requirement. Sidebar: add Video / Audio / PDF & Documents / Data groups with per-tool links, fold the 12 new image tools into the existing image categories, and replace the placeholder rest.md-anchor group. Docs site builds cleanly (157 pages, no dead links).
60 lines
2.3 KiB
Markdown
60 lines
2.3 KiB
Markdown
---
|
|
description: Generate a tiny low-quality image placeholder with base64 data URI.
|
|
---
|
|
|
|
# LQIP Placeholder
|
|
|
|
Generate a tiny low-quality image placeholder (LQIP) from a source image. Returns a small placeholder file along with a base64 data URI, ready-to-use HTML `<img>` tag, and CSS `background-image` snippet for immediate embedding.
|
|
|
|
## API Endpoint
|
|
|
|
`POST /api/v1/tools/lqip-placeholder`
|
|
|
|
Accepts multipart form data with an image file and a JSON `settings` field.
|
|
|
|
## Parameters
|
|
|
|
| Parameter | Type | Required | Default | Description |
|
|
|-----------|------|----------|---------|-------------|
|
|
| width | integer | No | `16` | Target width in pixels (4-64) |
|
|
| blur | number | No | `2` | Blur radius for the blur strategy (0-20) |
|
|
| strategy | string | No | `"blur"` | Placeholder strategy: `blur`, `pixelate`, or `solid` |
|
|
| format | string | No | `"webp"` | Output format: `webp`, `png`, or `jpeg` |
|
|
| quality | integer | No | `50` | Output quality (1-100) |
|
|
|
|
## Example Request
|
|
|
|
```bash
|
|
curl -X POST http://localhost:1349/api/v1/tools/lqip-placeholder \
|
|
-H "Authorization: Bearer si_your-api-key" \
|
|
-F "file=@photo.jpg" \
|
|
-F 'settings={"width": 20, "strategy": "blur", "format": "webp"}'
|
|
```
|
|
|
|
## Example Response
|
|
|
|
```json
|
|
{
|
|
"jobId": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
|
|
"downloadUrl": "/api/v1/download/a1b2c3d4-e5f6-7890-abcd-ef1234567890/photo.webp",
|
|
"originalSize": 2450000,
|
|
"processedSize": 280,
|
|
"dataUri": "data:image/webp;base64,UklGR...",
|
|
"width": 20,
|
|
"height": 13,
|
|
"bytes": 280,
|
|
"strategy": "blur",
|
|
"html": "<img src=\"data:image/webp;base64,UklGR...\" width=\"20\" height=\"13\" alt=\"\" />",
|
|
"css": "background-image: url(data:image/webp;base64,UklGR...);"
|
|
}
|
|
```
|
|
|
|
## Notes
|
|
|
|
- The `dataUri` field contains the complete data URI, ready for use in `src` attributes or CSS without any additional requests.
|
|
- The `html` and `css` fields provide copy-paste snippets for common use cases.
|
|
- The `blur` strategy produces a soft, blurred thumbnail. The `pixelate` strategy creates a blocky mosaic. The `solid` strategy returns a single averaged color.
|
|
- Typical placeholder sizes are 200-500 bytes, making them suitable for inlining directly in HTML.
|
|
- Height is calculated automatically to preserve the source image's aspect ratio.
|
|
- HEIC, RAW, PSD, and SVG inputs are automatically decoded before processing.
|