2026-03-23 15:32:43 +01:00
|
|
|
/**
|
|
|
|
|
* Handles the click event to copy text and toggle the button icon.
|
|
|
|
|
* @param {PointerEvent} event
|
|
|
|
|
*/
|
|
|
|
|
async function handleCopyClick(event) {
|
|
|
|
|
const btn = event.currentTarget;
|
|
|
|
|
const url = btn.dataset.shareCopy;
|
|
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
await globalThis.navigator.clipboard.writeText(url);
|
|
|
|
|
|
|
|
|
|
// Swap UI state
|
|
|
|
|
const original = btn.innerHTML;
|
|
|
|
|
btn.innerHTML = '<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>';
|
|
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
btn.innerHTML = original;
|
|
|
|
|
}, 1500);
|
2026-03-23 18:45:22 +01:00
|
|
|
} catch {
|
|
|
|
|
// Clipboard API not available
|
2026-03-23 15:32:43 +01:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
Add social sharing buttons and QR code for events
Public event page:
- Share buttons: X (Twitter), Facebook, Instagram (copy link), TikTok (copy link), copy link
- Buttons use url_encode for share URLs with event title + URL
- Instagram/TikTok copy to clipboard (no direct share URL support)
- Consistent brutal design with aria-labels
Organizer dashboard:
- Share X, Facebook, copy link buttons per event in events list
- QR code download button per event
- Route /mon-compte/evenement/{id}/qrcode: generates 400px PNG QR code via Endroid
- QR code points to public event URL, downloaded as qrcode-{slug}.png
JS module:
- assets/modules/share.js: initShare() handles data-share-copy buttons
- Copies URL to clipboard, shows checkmark for 1.5s then restores icon
- 4 tests (no buttons, copy, checkmark restore, multiple buttons)
Social icons already displayed via _social_icons.html.twig component
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-23 15:11:53 +01:00
|
|
|
export function initShare() {
|
2026-03-23 15:32:43 +01:00
|
|
|
const shareButtons = document.querySelectorAll('[data-share-copy]');
|
|
|
|
|
shareButtons.forEach(btn => {
|
|
|
|
|
btn.addEventListener('click', handleCopyClick);
|
|
|
|
|
});
|
Add social sharing buttons and QR code for events
Public event page:
- Share buttons: X (Twitter), Facebook, Instagram (copy link), TikTok (copy link), copy link
- Buttons use url_encode for share URLs with event title + URL
- Instagram/TikTok copy to clipboard (no direct share URL support)
- Consistent brutal design with aria-labels
Organizer dashboard:
- Share X, Facebook, copy link buttons per event in events list
- QR code download button per event
- Route /mon-compte/evenement/{id}/qrcode: generates 400px PNG QR code via Endroid
- QR code points to public event URL, downloaded as qrcode-{slug}.png
JS module:
- assets/modules/share.js: initShare() handles data-share-copy buttons
- Copies URL to clipboard, shows checkmark for 1.5s then restores icon
- 4 tests (no buttons, copy, checkmark restore, multiple buttons)
Social icons already displayed via _social_icons.html.twig component
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-23 15:11:53 +01:00
|
|
|
}
|