angrybeanie-front-end/pages/gallery/[gallery].js

57 lines
No EOL
2.3 KiB
JavaScript

import "../../components/main.js"
import getConfig from 'next/config'
import Layout from "../../components/main.js"
import { getGallery, getGalleryImages } from "../../data/external/cms.js"
import GalleryPager from "../../components/gallerypager.js"
import Head from 'next/head'
import config from "../../data/internal/config.js"
import GalleryCarousel from "../../components/gallerycarousel.js"
export async function getServerSideProps(context) {
const gallery = await getGallery(context.params.gallery)
if(context.query.page == null || context.query.page == '0') {
var page = 1;
} else {
var page = Number(context.query.page)
}
const galleryImages = await getGalleryImages(context.params.gallery, page, 9)
const { serverRuntimeConfig } = getConfig()
const pagedata = {
'title': "Angry Beanie - " + gallery.data[0].attributes.Title
}
const og_image = serverRuntimeConfig.media_path + galleryImages.data[0].attributes.Image.data.attributes.formats.large.url
return {
props: {pagedata, gallery: gallery.data[0], galleryImages, serverRuntimeConfig, og_image},
}
}
const Gallery = ({pagedata, gallery, galleryImages, serverRuntimeConfig, og_image}) => {
if (!gallery) return null
return(
<Layout pagedata={pagedata}>
<Head>
<meta name="twitter:card" content={ gallery.attributes.Title } key="twcard" />
<meta name="twitter:creator" content="angrybeanie" key="twhandle" />
<meta name="og:url" content={config.siteURL + "/galleries/" + gallery.attributes.Slug}></meta>
<meta name="og:type" content="Photo Gallery"></meta>
<meta name="og:title" content={ gallery.attributes.Title } key="title"></meta>
<meta name="og:image" content={og_image}></meta>
<meta name="og:description" content={ gallery.attributes.Description } key="description"></meta>
</Head>
<h1 className="page_title col-sm-12">{gallery.attributes.Title}</h1>
<GalleryCarousel galleryImages={galleryImages} basepath={serverRuntimeConfig.media_path} gallery={gallery}></GalleryCarousel>
<GalleryPager galleryImages={galleryImages} basepath={serverRuntimeConfig.media_path} gallery={gallery}></GalleryPager>
</Layout>
)
}
export default Gallery