redirecter for ao3 that adds opengraph metadata

move stuff to opengraph-image.jsx files

Changed files
+133 -7
src
app
generator
series
works
[workId]
+1 -1
src/app/generator/page.js
···
const fn = async () => {
if (!addr) return;
const params = new URLSearchParams(props)
-
const image = await fetch(`/${addr}/preview?${params.toString()}`)
if (image.status !== 200) return;
const imageBlob = await image.blob()
const reader = new FileReader()
···
const fn = async () => {
if (!addr) return;
const params = new URLSearchParams(props)
+
const image = await fetch(`/${addr}/opengraph-image?${params.toString()}`)
if (image.status !== 200) return;
const imageBlob = await image.blob()
const reader = new FileReader()
+43
src/app/series/[seriesId]/opengraph-image.jsx
···
···
+
import { getSeries } from "@fujocoded/ao3.js"
+
import sanitizeData from "@/lib/sanitizeData.js"
+
import OGImage from "@/lib/ogimage.js"
+
import baseFonts from "@/lib/baseFonts.js"
+
import titleFonts from "@/lib/titleFonts.js"
+
+
export const size = {
+
width: 1600,
+
height: 900,
+
}
+
export const alt = 'fixAO3'
+
+
export const contentType = 'image/webp'
+
+
export default async function Image({params}) {
+
const { seriesId } = await params
+
const props = new URLSearchParams({
+
theme: 'ao3',
+
baseFont: 'bricolagegrotesque',
+
titleFont: 'stacksansnotch',
+
category: true,
+
rating: true,
+
warnings: false,
+
charTags: false,
+
relTags: false,
+
freeTags: false,
+
summary: true,
+
wordcount: true,
+
chapters: true,
+
postedAt: true,
+
updatedAt: false,
+
summaryType: 'basic',
+
customSummary: ''
+
})
+
const addr = `series/${seriesId}`
+
const data = await getSeries({seriesId: seriesId})
+
const imageParams = await sanitizeData({type: 'series', data: data, props: props})
+
const theme = imageParams.theme
+
const baseFont = baseFonts[imageParams.baseFont].displayName
+
const titleFont = titleFonts[imageParams.titleFont].displayName
+
const opts = imageParams.opts
+
return OGImage({theme: theme, baseFont: baseFont, titleFont: titleFont, image: imageParams, addr: addr, opts: opts})
+
}
+1 -2
src/app/series/[seriesId]/page.js
···
title: title,
description: description,
openGraph: {
-
description: description,
-
images: [`/${addr}/preview`]
}
}
}
···
title: title,
description: description,
openGraph: {
+
description: description
}
}
}
+43
src/app/works/[workId]/chapters/[chapterId]/opengraph-image.jsx
···
···
+
import { getWork } from "@fujocoded/ao3.js"
+
import sanitizeData from "@/lib/sanitizeData.js"
+
import OGImage from "@/lib/ogimage.js"
+
import baseFonts from "@/lib/baseFonts.js"
+
import titleFonts from "@/lib/titleFonts.js"
+
+
export const size = {
+
width: 1600,
+
height: 900,
+
}
+
export const alt = 'fixAO3'
+
+
export const contentType = 'image/webp'
+
+
export default async function Image({params}) {
+
const { workId, chapterId } = await params
+
const props = new URLSearchParams({
+
theme: 'ao3',
+
baseFont: 'bricolagegrotesque',
+
titleFont: 'stacksansnotch',
+
category: true,
+
rating: true,
+
warnings: false,
+
charTags: false,
+
relTags: false,
+
freeTags: false,
+
summary: true,
+
wordcount: true,
+
chapters: true,
+
postedAt: true,
+
updatedAt: false,
+
summaryType: 'basic',
+
customSummary: ''
+
})
+
const addr = `works/${workId}/chapters/${chapterId}`
+
const data = await getWork({workId: workId, chapterId: chapterId})
+
const imageParams = await sanitizeData({type: 'work', data: data, props: props})
+
const theme = imageParams.theme
+
const baseFont = baseFonts[imageParams.baseFont].displayName
+
const titleFont = titleFonts[imageParams.titleFont].displayName
+
const opts = imageParams.opts
+
return OGImage({theme: theme, baseFont: baseFont, titleFont: titleFont, image: imageParams, addr: addr, opts: opts})
+
}
+1 -2
src/app/works/[workId]/chapters/[chapterId]/page.js
···
title: title,
description: description,
openGraph: {
-
description: description,
-
images: [`/${addr}/preview`]
}
}
}
···
title: title,
description: description,
openGraph: {
+
description: description
}
}
}
+43
src/app/works/[workId]/opengraph-image.jsx
···
···
+
import { getWork } from "@fujocoded/ao3.js"
+
import sanitizeData from "@/lib/sanitizeData.js"
+
import OGImage from "@/lib/ogimage.js"
+
import baseFonts from "@/lib/baseFonts.js"
+
import titleFonts from "@/lib/titleFonts.js"
+
+
export const size = {
+
width: 1600,
+
height: 900,
+
}
+
export const alt = 'fixAO3'
+
+
export const contentType = 'image/webp'
+
+
export default async function Image({params}) {
+
const { workId } = await params
+
const props = new URLSearchParams({
+
theme: 'ao3',
+
baseFont: 'bricolagegrotesque',
+
titleFont: 'stacksansnotch',
+
category: true,
+
rating: true,
+
warnings: false,
+
charTags: false,
+
relTags: false,
+
freeTags: false,
+
summary: true,
+
wordcount: true,
+
chapters: true,
+
postedAt: true,
+
updatedAt: false,
+
summaryType: 'basic',
+
customSummary: ''
+
})
+
const addr = `works/${workId}`
+
const data = await getWork({workId: workId})
+
const imageParams = await sanitizeData({type: 'work', data: data, props: props})
+
const theme = imageParams.theme
+
const baseFont = baseFonts[imageParams.baseFont].displayName
+
const titleFont = titleFonts[imageParams.titleFont].displayName
+
const opts = imageParams.opts
+
return OGImage({theme: theme, baseFont: baseFont, titleFont: titleFont, image: imageParams, addr: addr, opts: opts})
+
}
+1 -2
src/app/works/[workId]/page.js
···
title: title,
description: description,
openGraph: {
-
description: description,
-
images: [`/${addr}/preview`]
}
}
}
···
title: title,
description: description,
openGraph: {
+
description: description
}
}
}