dp-gif-picker
A "GIF" button that opens a searchable GIPHY panel. Picking a GIF stores it as an ordinary
attachment through POST /giphy/attach and hands it to the surrounding form's dp-upload, which
adds it to the hidden attachment_uids field. A GIF is therefore never pasted into the text: it
renders in the attachment gallery exactly like an uploaded file and is removed from the form the
same way.
Source: static/js/components/AppGifPicker.js. Server: routers/giphy.py.
Availability#
The GIPHY API key is entered by an administrator in the Giphy service (/admin/services) and never reaches
the browser: every search runs on the server. The element asks GET /giphy/status once per page
and hides itself when no key is configured, so a site without GIPHY shows no button at all.
Attributes#
| Attribute | Default | Description |
|---|---|---|
endpoint |
/giphy |
Base URL of the GIPHY routes. |
limit |
24 |
Number of GIFs requested per search (1-50). |
Behaviour#
- Trending GIFs load when the panel first opens; typing searches after a 350 ms pause.
- Escape or a click outside closes the panel; on phones (480px and below) it becomes a bottom sheet.
- Each member may make 30 GIF searches per minute; beyond that the panel says to wait.
- The panel always shows "Powered by GIPHY".
Events#
dp-gif:attached (bubbles, detail is the attachment record {uid, url, original_filename, ...}).
A dp-upload in attachment mode inside the same <form> listens for it.
Usage#
Place it beside the form's dp-upload:
<dp-upload multiple></dp-upload>
<dp-gif-picker></dp-gif-picker>
It is wired into the post composer, every comment form and the direct-message input.