Anyone can create and share a Discove Plugin
Discove plugins define one or more javascript regular expressions that are run on each Cove item to test if the Plugin should be displayed for this Cove item.
If the Cove item text matches the Regex, the Plugin will be rendered for each Regex match.
Discove plugins are HTML strings that can use the full spectrum of web technologies, including loading javascript, that are securely loaded into the Cove via an iframe with a different origin.
Plugins can be installed by a user for all the Coves they view, or by Cove Creators for their Coves.
Plugins need context to be able to render dynamic content, based on the content of a Cove Item. All mentions of $$discoveContextInjection$$ in your HTML string will be replaced with a javascript object of the form below. A way to use this would be to set this to a javascript variable via var context = $$discoveContextInjection$$. In addition, $$match1$$, $$match2$$, … will be replaced with value of the nth JS Regex capture group
{
// item text content
t: string,
// search query
q?: string,
// index of the Plugin's regexes that was triggered
matchGroupNum,
// the regex match (item in result of .matchAll())
match,
// all matches (result of .matchAll())
matches,
// Page background color: string
bg,
// Current color mode: 'dark' | 'light'
cm,
// Current page text color: string
c,
// feed item type: 'cast' | 'profile' | 'text'
type,
// feed item object (Cast or Profile or Text)
item,
// is user logged in and has an fid: 'true' | 'false'
a,
// ith plugin match rule: number (0,1,...)
i,
// jth match of this plugin match rule: number (0,1,...)
j
}
df/spotify - Spotify music embedsRegex: https://open\\.spotify\\.com/([a-z]+)/([0-9a-z\\?=]+)
This regex uses two capture groups, in the form of the parantheses to extract the two parts of the spotify url we need
Flags: gi
Seamless: true
Width: 400px
Height: 400px
HTML:
<!DOCTYPE html>
<html>
<head>
</head>
<body style="margin:0;">
<iframe style="border-radius: 12px" src="<https://open.spotify.com/embed/$$match1$$/$$match2$$?utm_source=generator>" width="100%" height="380" frameborder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</body>
</html>