Composable useEmbedCodes.ts + composant EmbedCodes.vue #21

New issue

Open

opened 2026-04-13 23:57:55 +02:00 by Balam · 0 comments

Balam commented

2026-04-13 23:57:55 +02:00

Owner

Objectif

Générer et afficher les 8 codes d'intégration pour chaque image (calqués sur postimages).

Fichiers

app/composables/useEmbedCodes.ts
app/components/EmbedCodes.vue

Codes générés (8)

Code	Description
Lien	URL de la page image
Lien direct	URL WebP servi par Nginx
Markdown	Lien cliquable Markdown
Markdown direct	Image Markdown avec URL directe
Vignette forums	BBCode avec vignette IPX
Vignette sites web	HTML avec vignette IPX
Lien direct forums	BBCode avec image directe
Lien direct sites web	HTML avec image directe + dimensions

La vignette utilise IPX : /_ipx/w_300,h_300,fit_cover/uploads/processed/{uuid}.webp

EmbedCodes.vue

Un onglet par code
Bouton copier (Clipboard API)
Feedback visuel après copie

Dépend de

#13 (server route image)
#14 (page image où le composant est affiché)

Validation

Les 8 codes sont corrects et les URLs valides
Bouton copier fonctionne sur mobile et desktop

## Objectif Générer et afficher les **8 codes d'intégration** pour chaque image (calqués sur postimages). ## Fichiers - `app/composables/useEmbedCodes.ts` - `app/components/EmbedCodes.vue` ## Codes générés (8) | Code | Description | |------|-------------| | **Lien** | URL de la page image | | **Lien direct** | URL WebP servi par Nginx | | **Markdown** | Lien cliquable Markdown | | **Markdown direct** | Image Markdown avec URL directe | | **Vignette forums** | BBCode avec vignette IPX | | **Vignette sites web** | HTML avec vignette IPX | | **Lien direct forums** | BBCode avec image directe | | **Lien direct sites web** | HTML avec image directe + dimensions | La vignette utilise IPX : `/_ipx/w_300,h_300,fit_cover/uploads/processed/{uuid}.webp` ## EmbedCodes.vue - Un onglet par code - Bouton copier (Clipboard API) - Feedback visuel après copie ## Dépend de - #13 (server route image) - #14 (page image où le composant est affiché) ## Validation - Les **8 codes** sont corrects et les URLs valides - Bouton copier fonctionne sur mobile et desktop

Balam added this to the Phase 5 — Page image + Embed milestone

2026-04-13 23:57:55 +02:00

Balam added this to the Galerie V1 project

2026-04-13 23:58:49 +02:00