open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Clean up embed rewrite code

Browse Source
This commit is contained in:
Austin Chen 2022-08-11 11:00:58 -07:00
parent b81fb80f7b
commit 2affed814f
1 changed files with 38 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
web/components/editor/embed-modal.tsx
View File

@ -7,65 +7,49 @@ import { Modal } from '../layout/modal'
import { Row } from '../layout/row' import { Row } from '../layout/row'
import { Spacer } from '../layout/spacer' import { Spacer } from '../layout/spacer'
function isValidIframe(text: string) { type EmbedPattern = {
return /^<iframe.*<\/iframe>$/.test(text) // Regex should have a single capture group.
regex: RegExp
rewrite: (text: string) => string
} }
// A valid tweet URL looks like 'https://twitter.com/username/status/123456789' const embedPatterns: EmbedPattern[] = [
// Return the tweetId if the URL is valid, otherwise return null. {
function getTweetId(text: string) { regex: /^(<iframe.*<\/iframe>)$/,
const match = text.match(/^https?:\/\/twitter\.com\/.*\/status\/(\d+)/) rewrite: (text: string) => text,
return match ? match[1] : null },
} {
regex: /^https?:\/\/manifold\.markets\/([^\/]+\/[^\/]+)/,
// Manifold URL: https://manifold.markets/Austin/will-manifold-ever-be-worth-1b rewrite: (slug) =>
function getManifoldSlug(text: string) { `<iframe src="https://manifold.markets/embed/${slug}"></iframe>`,
const match = text.match(/^https?:\/\/manifold\.markets\/([^\/]+\/[^\/]+)/) },
return match ? match[1] : null {
} regex: /^https?:\/\/twitter\.com\/.*\/status\/(\d+)/,
rewrite: (id) => `<tiptap-tweet tweetid="t${id}"></tiptap-tweet>`,
// Youtube URL: 'https://www.youtube.com/watch?v=ziq7FUKpCS8' },
function getYoutubeId(text: string) { {
const match = text.match(/^https?:\/\/www\.youtube\.com\/watch\?v=([^&]+)/) regex: /^https?:\/\/www\.youtube\.com\/watch\?v=([^&]+)/,
return match ? match[1] : null rewrite: (id) =>
} `<iframe src="https://www.youtube.com/embed/${id}"></iframe>`,
},
// Metaculus URL: 'https://www.metaculus.com/questions/5320/chinese-annexation-of-half-of-taiwan-by-2050/' {
function getMetaculusId(text: string) { regex: /^https?:\/\/www\.metaculus\.com\/questions\/(\d+)/,
const match = text.match(/^https?:\/\/www\.metaculus\.com\/questions\/(\d+)/) rewrite: (id) =>
return match ? match[1] : null `<iframe src="https://www.metaculus.com/questions/embed/${id}"></iframe>`,
} },
{
function isValidUrl(text: string) { regex: /^(https?:\/\/.*)/,
// Conjured by Codex rewrite: (url) => `<iframe src="${url}"></iframe>`,
return /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/.test( },
text ]
)
}
function embedCode(text: string) { function embedCode(text: string) {
if (isValidIframe(text)) { for (const pattern of embedPatterns) {
return text const match = text.match(pattern.regex)
} else if (getTweetId(text)) { if (match) {
// Append a leading 't', to prevent tweetId from being interpreted as a number. return pattern.rewrite(match[1])
// If it's a number, there may be numeric precision issues. }
return `<tiptap-tweet tweetid="t${getTweetId(text)}"></tiptap-tweet>`
} else if (getManifoldSlug(text)) {
return `<iframe src="https://manifold.markets/embed/${getManifoldSlug(
text
)}"></iframe>`
} else if (getYoutubeId(text)) {
return `<iframe src="https://www.youtube.com/embed/${getYoutubeId(
text
)}"></iframe>`
} else if (getMetaculusId(text)) {
return `<iframe src="https://www.metaculus.com/questions/embed/${getMetaculusId(
text
)}"></iframe>`
} else if (isValidUrl(text)) {
return `<iframe src="${text}"></iframe>`
} }
// Return null if the text is not embeddable.
return null return null
} }