558 lines
13 KiB
TypeScript
558 lines
13 KiB
TypeScript
import path from 'path'
|
|
import { getFileByPath } from 'payload/uploads'
|
|
import { fileURLToPath } from 'url'
|
|
|
|
import { buildConfigWithDefaults } from '../buildConfigWithDefaults.js'
|
|
import { devUser } from '../credentials.js'
|
|
import removeFiles from '../helpers/removeFiles.js'
|
|
import { AdminThumbnailFunction } from './collections/AdminThumbnailFunction/index.js'
|
|
import { AdminThumbnailSize } from './collections/AdminThumbnailSize/index.js'
|
|
import { Uploads1 } from './collections/Upload1/index.js'
|
|
import { Uploads2 } from './collections/Upload2/index.js'
|
|
import {
|
|
audioSlug,
|
|
enlargeSlug,
|
|
focalNoSizesSlug,
|
|
mediaSlug,
|
|
reduceSlug,
|
|
relationSlug,
|
|
unstoredMediaSlug,
|
|
versionSlug,
|
|
} from './shared.js'
|
|
const filename = fileURLToPath(import.meta.url)
|
|
const dirname = path.dirname(filename)
|
|
|
|
export default buildConfigWithDefaults({
|
|
collections: [
|
|
{
|
|
slug: relationSlug,
|
|
fields: [
|
|
{
|
|
name: 'image',
|
|
type: 'upload',
|
|
relationTo: 'media',
|
|
},
|
|
{
|
|
name: 'versionedImage',
|
|
type: 'upload',
|
|
relationTo: versionSlug,
|
|
},
|
|
],
|
|
},
|
|
{
|
|
slug: audioSlug,
|
|
fields: [
|
|
{
|
|
name: 'audio',
|
|
type: 'upload',
|
|
filterOptions: {
|
|
mimeType: {
|
|
in: ['audio/mpeg'],
|
|
},
|
|
},
|
|
relationTo: 'media',
|
|
},
|
|
],
|
|
},
|
|
{
|
|
slug: 'gif-resize',
|
|
fields: [],
|
|
upload: {
|
|
formatOptions: {
|
|
format: 'gif',
|
|
},
|
|
imageSizes: [
|
|
{
|
|
name: 'small',
|
|
formatOptions: { format: 'gif', options: { quality: 90 } },
|
|
height: 100,
|
|
width: 100,
|
|
},
|
|
{
|
|
name: 'large',
|
|
formatOptions: { format: 'gif', options: { quality: 90 } },
|
|
height: 1000,
|
|
width: 1000,
|
|
},
|
|
],
|
|
mimeTypes: ['image/gif'],
|
|
resizeOptions: {
|
|
height: 200,
|
|
position: 'center',
|
|
width: 200,
|
|
},
|
|
staticDir: path.resolve(dirname, './media-gif'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'no-image-sizes',
|
|
fields: [],
|
|
upload: {
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
resizeOptions: {
|
|
height: 200,
|
|
position: 'center',
|
|
width: 200,
|
|
},
|
|
staticDir: path.resolve(dirname, './no-image-sizes'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'object-fit',
|
|
fields: [],
|
|
upload: {
|
|
imageSizes: [
|
|
{
|
|
name: 'fitContain',
|
|
fit: 'contain',
|
|
height: 300,
|
|
width: 400,
|
|
},
|
|
{
|
|
name: 'fitInside',
|
|
fit: 'inside',
|
|
height: 400,
|
|
width: 300,
|
|
},
|
|
{
|
|
name: 'fitCover',
|
|
fit: 'cover',
|
|
height: 300,
|
|
width: 900,
|
|
},
|
|
{
|
|
name: 'fitOutside',
|
|
fit: 'outside',
|
|
height: 200,
|
|
width: 900,
|
|
},
|
|
],
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
staticDir: path.resolve(dirname, './object-fit'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'crop-only',
|
|
fields: [],
|
|
upload: {
|
|
focalPoint: false,
|
|
imageSizes: [
|
|
{
|
|
name: 'focalTest',
|
|
height: 300,
|
|
width: 400,
|
|
},
|
|
{
|
|
name: 'focalTest2',
|
|
height: 300,
|
|
width: 600,
|
|
},
|
|
{
|
|
name: 'focalTest3',
|
|
height: 300,
|
|
width: 900,
|
|
},
|
|
],
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
staticDir: path.resolve(dirname, './crop-only'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'focal-only',
|
|
fields: [],
|
|
upload: {
|
|
crop: false,
|
|
imageSizes: [
|
|
{
|
|
name: 'focalTest',
|
|
height: 300,
|
|
width: 400,
|
|
},
|
|
{
|
|
name: 'focalTest2',
|
|
height: 300,
|
|
width: 600,
|
|
},
|
|
{
|
|
name: 'focalTest3',
|
|
height: 300,
|
|
width: 900,
|
|
},
|
|
],
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
staticDir: path.resolve(dirname, './focal-only'),
|
|
},
|
|
},
|
|
{
|
|
slug: focalNoSizesSlug,
|
|
fields: [],
|
|
upload: {
|
|
crop: false,
|
|
focalPoint: true,
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
staticDir: path.resolve(dirname, './focal-no-sizes'),
|
|
},
|
|
},
|
|
{
|
|
slug: mediaSlug,
|
|
fields: [],
|
|
upload: {
|
|
staticDir: path.resolve(dirname, './media'),
|
|
// crop: false,
|
|
// focalPoint: false,
|
|
formatOptions: {
|
|
format: 'png',
|
|
options: { quality: 90 },
|
|
},
|
|
imageSizes: [
|
|
{
|
|
name: 'maintainedAspectRatio',
|
|
crop: 'center',
|
|
formatOptions: { format: 'png', options: { quality: 90 } },
|
|
height: undefined,
|
|
position: 'center',
|
|
width: 1024,
|
|
},
|
|
{
|
|
name: 'differentFormatFromMainImage',
|
|
formatOptions: { format: 'jpg', options: { quality: 90 } },
|
|
height: undefined,
|
|
width: 200,
|
|
},
|
|
{
|
|
name: 'maintainedImageSize',
|
|
height: undefined,
|
|
width: undefined,
|
|
},
|
|
{
|
|
name: 'maintainedImageSizeWithNewFormat',
|
|
formatOptions: { format: 'jpg', options: { quality: 90 } },
|
|
height: undefined,
|
|
width: undefined,
|
|
},
|
|
{
|
|
name: 'accidentalSameSize',
|
|
height: 80,
|
|
position: 'top',
|
|
width: 320,
|
|
},
|
|
{
|
|
name: 'tablet',
|
|
height: 480,
|
|
width: 640,
|
|
},
|
|
{
|
|
name: 'mobile',
|
|
crop: 'left top',
|
|
height: 240,
|
|
width: 320,
|
|
},
|
|
{
|
|
name: 'icon',
|
|
height: 16,
|
|
width: 16,
|
|
},
|
|
{
|
|
name: 'focalTest',
|
|
height: 300,
|
|
width: 400,
|
|
},
|
|
{
|
|
name: 'focalTest2',
|
|
height: 300,
|
|
width: 600,
|
|
},
|
|
{
|
|
name: 'focalTest3',
|
|
height: 300,
|
|
width: 900,
|
|
},
|
|
{
|
|
name: 'focalTest4',
|
|
height: 400,
|
|
width: 300,
|
|
},
|
|
{
|
|
name: 'focalTest5',
|
|
height: 600,
|
|
width: 300,
|
|
},
|
|
{
|
|
name: 'focalTest6',
|
|
height: 800,
|
|
width: 300,
|
|
},
|
|
{
|
|
name: 'focalTest7',
|
|
height: 300,
|
|
width: 300,
|
|
},
|
|
],
|
|
},
|
|
},
|
|
{
|
|
slug: enlargeSlug,
|
|
fields: [],
|
|
upload: {
|
|
imageSizes: [
|
|
{
|
|
name: 'accidentalSameSize',
|
|
height: 80,
|
|
width: 320,
|
|
withoutEnlargement: false,
|
|
},
|
|
{
|
|
name: 'sameSizeWithNewFormat',
|
|
formatOptions: { format: 'jpg', options: { quality: 90 } },
|
|
height: 80,
|
|
width: 320,
|
|
withoutEnlargement: false,
|
|
},
|
|
{
|
|
name: 'resizedLarger',
|
|
height: 480,
|
|
width: 640,
|
|
withoutEnlargement: false,
|
|
},
|
|
{
|
|
name: 'resizedSmaller',
|
|
height: 50,
|
|
width: 180,
|
|
},
|
|
{
|
|
name: 'widthLowerHeightLarger',
|
|
fit: 'contain',
|
|
height: 300,
|
|
width: 300,
|
|
},
|
|
],
|
|
mimeTypes: [
|
|
'image/png',
|
|
'image/jpg',
|
|
'image/jpeg',
|
|
'image/gif',
|
|
'image/svg+xml',
|
|
'audio/mpeg',
|
|
],
|
|
staticDir: path.resolve(dirname, './media/enlarge'),
|
|
},
|
|
},
|
|
{
|
|
slug: reduceSlug,
|
|
fields: [],
|
|
upload: {
|
|
imageSizes: [
|
|
{
|
|
name: 'accidentalSameSize',
|
|
height: 80,
|
|
width: 320,
|
|
withoutEnlargement: false,
|
|
},
|
|
{
|
|
name: 'sameSizeWithNewFormat',
|
|
formatOptions: { format: 'jpg', options: { quality: 90 } },
|
|
height: 80,
|
|
width: 320,
|
|
withoutReduction: true,
|
|
},
|
|
{
|
|
name: 'resizedLarger',
|
|
height: 480,
|
|
width: 640,
|
|
},
|
|
{
|
|
name: 'resizedSmaller',
|
|
height: 50,
|
|
width: 180,
|
|
withoutReduction: true,
|
|
},
|
|
],
|
|
mimeTypes: [
|
|
'image/png',
|
|
'image/jpg',
|
|
'image/jpeg',
|
|
'image/gif',
|
|
'image/svg+xml',
|
|
'audio/mpeg',
|
|
],
|
|
staticDir: path.resolve(dirname, './media/reduce'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'media-trim',
|
|
fields: [],
|
|
upload: {
|
|
imageSizes: [
|
|
{
|
|
name: 'trimNumber',
|
|
height: undefined,
|
|
trimOptions: 0,
|
|
width: 1024,
|
|
},
|
|
{
|
|
name: 'trimString',
|
|
height: undefined,
|
|
trimOptions: 0,
|
|
width: 1024,
|
|
},
|
|
{
|
|
name: 'trimOptions',
|
|
height: undefined,
|
|
trimOptions: {
|
|
background: '#000000',
|
|
threshold: 50,
|
|
},
|
|
width: 1024,
|
|
},
|
|
],
|
|
mimeTypes: ['image/png', 'image/jpg', 'image/jpeg'],
|
|
staticDir: path.resolve(dirname, './media-trim'),
|
|
trimOptions: 0,
|
|
},
|
|
},
|
|
{
|
|
slug: unstoredMediaSlug,
|
|
fields: [],
|
|
upload: {
|
|
disableLocalStorage: true,
|
|
},
|
|
},
|
|
{
|
|
slug: 'externally-served-media',
|
|
fields: [],
|
|
upload: {
|
|
// Either use another web server like `npx serve -l 4000` (http://localhost:4000) or use the static server from the previous collection to serve the media folder (http://localhost:3000/media)
|
|
staticDir: path.resolve(dirname, './media'),
|
|
},
|
|
},
|
|
Uploads1,
|
|
Uploads2,
|
|
AdminThumbnailFunction,
|
|
AdminThumbnailSize,
|
|
{
|
|
slug: 'optional-file',
|
|
fields: [],
|
|
upload: {
|
|
filesRequiredOnCreate: false,
|
|
staticDir: path.resolve(dirname, './optional'),
|
|
},
|
|
},
|
|
{
|
|
slug: 'required-file',
|
|
fields: [],
|
|
upload: {
|
|
filesRequiredOnCreate: true,
|
|
staticDir: path.resolve(dirname, './required'),
|
|
},
|
|
},
|
|
{
|
|
slug: versionSlug,
|
|
fields: [
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
},
|
|
],
|
|
upload: {
|
|
filesRequiredOnCreate: true,
|
|
staticDir: path.resolve(dirname, `./${versionSlug}`),
|
|
},
|
|
versions: {
|
|
drafts: true,
|
|
},
|
|
},
|
|
],
|
|
onInit: async (payload) => {
|
|
const uploadsDir = path.resolve(dirname, './media')
|
|
removeFiles(path.normalize(uploadsDir))
|
|
|
|
await payload.create({
|
|
collection: 'users',
|
|
data: {
|
|
email: devUser.email,
|
|
password: devUser.password,
|
|
},
|
|
})
|
|
|
|
// Create image
|
|
const imageFilePath = path.resolve(dirname, './image.png')
|
|
const imageFile = await getFileByPath(imageFilePath)
|
|
|
|
const { id: uploadedImage } = await payload.create({
|
|
collection: mediaSlug,
|
|
data: {},
|
|
file: imageFile,
|
|
})
|
|
|
|
const { id: versionedImage } = await payload.create({
|
|
collection: versionSlug,
|
|
data: {
|
|
_status: 'published',
|
|
title: 'upload',
|
|
},
|
|
file: imageFile,
|
|
})
|
|
|
|
await payload.create({
|
|
collection: relationSlug,
|
|
data: {
|
|
image: uploadedImage,
|
|
versionedImage,
|
|
},
|
|
})
|
|
|
|
// Create audio
|
|
const audioFilePath = path.resolve(dirname, './audio.mp3')
|
|
const audioFile = await getFileByPath(audioFilePath)
|
|
|
|
const file = await payload.create({
|
|
collection: mediaSlug,
|
|
data: {},
|
|
file: audioFile,
|
|
})
|
|
|
|
await payload.create({
|
|
collection: audioSlug,
|
|
data: {
|
|
audio: file.id,
|
|
},
|
|
})
|
|
|
|
// Create admin thumbnail media
|
|
await payload.create({
|
|
collection: AdminThumbnailSize.slug,
|
|
data: {},
|
|
file: {
|
|
...audioFile,
|
|
name: 'audio-thumbnail.mp3', // Override to avoid conflicts
|
|
},
|
|
})
|
|
|
|
await payload.create({
|
|
collection: AdminThumbnailSize.slug,
|
|
data: {},
|
|
file: {
|
|
...imageFile,
|
|
name: `thumb-${imageFile.name}`,
|
|
},
|
|
})
|
|
|
|
await payload.create({
|
|
collection: AdminThumbnailFunction.slug,
|
|
data: {},
|
|
file: {
|
|
...imageFile,
|
|
name: `function-image-${imageFile.name}`,
|
|
},
|
|
})
|
|
},
|
|
serverURL: undefined,
|
|
upload: {
|
|
// debug: true,
|
|
abortOnLimit: true,
|
|
limits: {
|
|
fileSize: 2_000_000, // 2MB
|
|
},
|
|
},
|
|
})
|