flo-bit.dev
your personal website on atproto - mirror
blento.app
1import type { CardDefinition } from '../../types';
2import CreateAppleMusicCardModal from './CreateAppleMusicCardModal.svelte';
3import AppleMusicCard from './AppleMusicCard.svelte';
4
5const cardType = 'apple-music-embed';
6
7export const AppleMusicCardDefinition = {
8 type: cardType,
9 contentComponent: AppleMusicCard,
10 creationModalComponent: CreateAppleMusicCardModal,
11 createNew: (item) => {
12 item.cardType = cardType;
13 item.cardData = {};
14 item.w = 4;
15 item.mobileW = 8;
16 item.h = 5;
17 item.mobileH = 10;
18 },
19
20 onUrlHandler: (url, item) => {
21 const match = matchAppleMusicUrl(url);
22 if (!match) return null;
23
24 item.cardData.appleMusicType = match.type;
25 item.cardData.appleMusicId = match.id;
26 item.cardData.appleMusicStorefront = match.storefront;
27 item.cardData.href = url;
28
29 item.w = 4;
30 item.mobileW = 8;
31 item.h = 5;
32 item.mobileH = 10;
33
34 return item;
35 },
36
37 urlHandlerPriority: 2,
38
39 name: 'Apple Music Embed',
40 canResize: true,
41 minW: 4,
42 minH: 5,
43
44 keywords: ['music', 'apple', 'playlist', 'album'],
45 groups: ['Media'],
46 icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-4"><path d="M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.317-1.31-1.062-2.31-2.18-3.043a5.022 5.022 0 00-1.877-.726 10.496 10.496 0 00-1.564-.15c-.04-.003-.083-.01-.124-.013H5.986c-.152.01-.303.017-.455.026-.747.043-1.49.123-2.193.4-1.336.53-2.3 1.452-2.865 2.78-.192.448-.292.925-.363 1.408-.056.392-.088.785-.1 1.18 0 .032-.007.062-.01.093v12.223c.01.14.017.283.027.424.05.815.154 1.624.497 2.373.65 1.42 1.738 2.353 3.234 2.802.42.127.856.187 1.293.228.555.053 1.11.06 1.667.06h11.03a12.5 12.5 0 001.57-.1c.822-.106 1.596-.35 2.295-.81a5.046 5.046 0 001.88-2.207c.186-.42.293-.87.37-1.324.113-.675.138-1.358.137-2.04-.002-3.8 0-7.595-.003-11.393zm-6.423 3.99v5.712c0 .417-.058.827-.244 1.206-.29.59-.76.962-1.388 1.14-.35.1-.706.157-1.07.173-.95.042-1.8-.6-1.965-1.483-.18-.965.46-1.97 1.553-2.142.238-.037.48-.065.72-.082.39-.03.78-.056 1.168-.1.207-.02.357-.127.404-.334a1.14 1.14 0 00.025-.26V9.97a.48.48 0 00-.357-.47c-.107-.033-.218-.06-.33-.073-.565-.065-1.13-.118-1.696-.18l-3.535-.38c-.043-.004-.088-.005-.13 0a.334.334 0 00-.32.334c-.003.06 0 .12 0 .18v7.63c0 .4-.046.793-.216 1.16-.293.635-.792 1.03-1.466 1.205-.32.082-.647.136-.978.152-.93.043-1.764-.585-1.95-1.443-.2-.924.39-1.893 1.397-2.1.36-.073.724-.118 1.088-.158.274-.03.55-.06.82-.105.164-.027.3-.1.367-.27a.77.77 0 00.048-.268V7.762c0-.282.07-.53.275-.735a1.09 1.09 0 01.49-.282c.333-.093.674-.143 1.012-.18l3.384-.38c.56-.063 1.12-.123 1.68-.187.321-.037.642-.063.96-.04.37.03.658.2.86.518.088.138.135.292.148.453.016.224.02.448.02.672v2.533z"/></svg>`
47} as CardDefinition & { type: typeof cardType };
48
49// Match Apple Music album and playlist URLs
50// Examples:
51// https://music.apple.com/us/album/midnights/1649434004
52// https://music.apple.com/us/playlist/todays-hits/pl.f4d106fed2bd41149aaacabb233eb5eb
53function matchAppleMusicUrl(
54 url: string | undefined
55): { type: 'album' | 'playlist'; id: string; storefront: string } | null {
56 if (!url) return null;
57
58 const pattern = /music\.apple\.com\/([a-z]{2})\/(album|playlist)\/[^/]+\/([a-zA-Z0-9.]+)/;
59 const match = url.match(pattern);
60
61 if (match) {
62 return {
63 storefront: match[1],
64 type: match[2] as 'album' | 'playlist',
65 id: match[3]
66 };
67 }
68
69 return null;
70}