purserj/angrybeanie-front-end
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

Updates to fully integrate podcasts into the site

Browse source
This commit is contained in:
James Purser 2022-06-28 09:28:00 +10:00
parent 4a13a87a51
commit 47cc80e747
5 changed files with 25 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/episodepager.js
View file

@ -16,12 +16,12 @@ const EpisodePager = ({ episodedata, config, showdata }) => {
}
return (
<div className="episode_pages col-xs-12">
<div className="main_content col-md-9 col-sm-12">
<div className="show_episodes">
{episodedata.data.map((episode) => (
<div key={episode.attributes.Slug} className="episode">
<div className="episode_title" id ={episode.Title}>
<Link href={episode.attributes.podcast_sery.data.attributes.Slug + "/" + episode.attributes.Slug}>{episode.attributes.Title}</Link>
<Link href={episode.attributes.podcast_sery.data.attributes.Slug + "/episodes/" + episode.attributes.Slug}>{episode.attributes.Title}</Link>
</div>
<div className="content-date">
{episode.attributes.publishedAt}

2
components/episodesidebar.js
View file

@ -7,7 +7,7 @@ const EpisodeSideBar = (epdata) => {
<hr />
{epdata.epdata.data.map((episode) => (
<div key={episode.Slug}>
<h2><Link href="/podcasts/shows/[show_slug]/[slug]" as={"/podcasts/shows/" + episode.attributes.podcast_sery.data.attributes.Slug + "/" + episode.attributes.Slug}>{episode.attributes.Title}</Link></h2>
<h2><Link href="/podcasts/shows/[show_slug]/episodes/[slug]" as={"/podcasts/shows/" + episode.attributes.podcast_sery.data.attributes.Slug + "/episodes/" + episode.attributes.Slug}>{episode.attributes.Title}</Link></h2>
<div dangerouslySetInnerHTML={{__html: episode.Description}} />
<hr />
</div>

24
components/showsidebar.js
View file

@ -1,13 +1,25 @@
import Image from 'next/image';
import { Link } from 'react-router-dom';
import config from '../data/internal/config'
const ShowSideBar = (props) => (
const ShowSideBar = (props) => {
console.log(props.props.data[0].attributes)
return(
<div className="side_content col-md-3">
<Image
src={props.props.serverRuntimeConfig.base_path + props.props.showdata.logo.src}
height={props.props.showdata.logo.height}
width={props.props.showdata.logo.width}
src={config.siteURL + props.props.data[0].attributes.Logo.data.attributes.url}
height={props.props.data[0].attributes.Logo.data.attributes.height}
width={props.props.data[0].attributes.Logo.data.attributes.width}
/>
</div>
);
<div dangerouslySetInnerHTML={{ __html: props.props.data[0].attributes.Description }}></div>
<h2>Feeds</h2>
<div><a href={props.props.data[0].attributes.iTunesLink}>
<img src="/images/iTunes.png" alt="Get it on iTunes"></img>
</a></div>
<div><a href={props.props.data[0].attributes.rssLink+".xml"}>
<img src="/images/rss.png" alt="RSS Feed"></img>
</a></div>
</div>);
}
export default ShowSideBar

5
pages/index.js
View file

@ -39,7 +39,6 @@ export async function getStaticProps(context) {
const artdata = await res.json()
const article = artdata.data[0].attributes
console.log(article)
const epdata = await getLatestPodcastEpisode()
@ -75,7 +74,7 @@ function HomePage (props) {
<div className="card-img-top">
{/* <img src={props.episodedata.Logo.data.attributes.url} alt={episode.show} height={props.episodedata.Logo.data.attributes.height}></img> */}
<Image
src={props.article.FeatureImage.data.attributes.formats.thumbnail.url}
src={props.siteConfig.siteURL+props.article.FeatureImage.data.attributes.formats.thumbnail.url}
alt={props.article.Title}
layout="fixed"
height={props.article.FeatureImage.data.attributes.formats.thumbnail.height}
@ -98,7 +97,7 @@ function HomePage (props) {
<div className="card-img-top">
{/* <img src={props.episodedata.Logo.data.attributes.url} alt={episode.show} height={props.episodedata.Logo.data.attributes.height}></img> */}
<Image
src={props.episodedata.Logo.data.attributes.formats.thumbnail.url}
src={props.siteConfig.SiteURL+props.episodedata.Logo.data.attributes.formats.thumbnail.url}
alt={episode.show}
layout="fixed"
height={props.episodedata.Logo.data.attributes.formats.thumbnail.height}

2
pages/podcasts/shows/[podcast].js
View file

@ -3,6 +3,7 @@ import "../../../components/main.js"
import Layout from "../../../components/main.js"
import EpisodePager from "../../../components/episodepager.js"
import { getPodcastSeries, getPodcastSeriesEpisodes } from '../../../data/external/cms.js'
import ShowSideBar from '../../../components/showsidebar.js'
export async function getServerSideProps(context) {
const { serverRuntimeConfig, publicRuntimeConfig } = getConfig()
@ -33,6 +34,7 @@ const Podcast = (props) => (
<Layout pagedata={props.pagedata} sections={props.sections} showdata={props.showdata}>
<h1>{props.showdata.title}</h1>
<EpisodePager episodedata={props.epdata} config={props.serverRuntimeConfig} showdata={props.showdata}/>
<ShowSideBar props={props.showdata}></ShowSideBar>
</Layout>
)