From 0c66b6678c18f4efbe6f7b4222f9a38b0125a938 Mon Sep 17 00:00:00 2001 From: Khaled Garbaya Date: Tue, 26 Sep 2017 14:35:53 +0200 Subject: [PATCH] feat(courses): Add Landing Page content modules --- routes/index.js | 7 +++++-- services/contentful.js | 7 +++++++ views/course.pug | 2 +- views/index.pug | 23 ++++++++++++++++------ views/mixins/_copyModule.pug | 8 ++++++++ views/mixins/_courseCard.pug | 2 +- views/mixins/_heroImageModule.pug | 6 ++++++ views/mixins/_highlightedCourse.pug | 7 +++++++ views/mixins/_highlightedLessonsModule.pug | 9 +++++++++ views/mixins/_lesson.pug | 7 +++++++ 10 files changed, 68 insertions(+), 10 deletions(-) create mode 100644 views/mixins/_copyModule.pug create mode 100644 views/mixins/_heroImageModule.pug create mode 100644 views/mixins/_highlightedCourse.pug create mode 100644 views/mixins/_highlightedLessonsModule.pug create mode 100644 views/mixins/_lesson.pug diff --git a/routes/index.js b/routes/index.js index 5a20a0c..eb68a34 100644 --- a/routes/index.js +++ b/routes/index.js @@ -1,9 +1,12 @@ const express = require('express') +const {getLandingPage} = require('../services/contentful') const router = express.Router() /* GET home page. */ -router.get('/', function (req, res, next) { - res.render('index', { title: 'Welcome to Contentful university' }) +router.get('/', async function (req, res, next) { + const landingPage = await getLandingPage() + console.log(landingPage.fields.contentModules[1].fields) + res.render('index', { landingPage }) }) module.exports = router diff --git a/services/contentful.js b/services/contentful.js index b56a814..6e4300d 100644 --- a/services/contentful.js +++ b/services/contentful.js @@ -7,12 +7,19 @@ exports.initClient = (config = {space: process.env.CF_SPACE, accessToken: proces client = createClient(config) previewClient = createClient({...config, host: 'preview.contentful.com'}) } + exports.getCourses = () => { // to get all the courses we simply request from Contentful all the entries // with the content_type `course` return client.getEntries({content_type: 'course'}) } +exports.getLandingPage = () => { + // our Home page is fully configureable via contentful + return client.getEntries({content_type: 'landingPage', 'fields.slug': 'contentful-university'}) + .then((response) => response.items[0]) +} + exports.getCourse = (slug) => { // the SDK support link resolution only when you request the collection endpoint // That's why we are using getEntries with a query instead of getEntry(entryId) diff --git a/views/course.pug b/views/course.pug index 6339383..4ce2383 100644 --- a/views/course.pug +++ b/views/course.pug @@ -5,7 +5,7 @@ block content if lesson p= lesson.fields.description else - p= course.fields.description + p= course.fields.description ul each lesson in course.fields.lessons li diff --git a/views/index.pug b/views/index.pug index 1816ec1..9cfd8d8 100644 --- a/views/index.pug +++ b/views/index.pug @@ -1,11 +1,22 @@ extends layout +include mixins/_copyModule +include mixins/_heroImageModule +include mixins/_highlightedCourse +include mixins/_highlightedLessonsModule + block content .container - section.hero - .hero__image - .featured-cards-list - .featured-cards__list - .featured-cards__list - .featured-cards__list + each module in landingPage.fields.contentModules + case module.sys.contentType.sys.id + when 'landingPageModuleCopy' + +copyModule(module) + when 'landingPageModuleHeroImage' + +heroImageModule(module) + + when 'landingPageModuleHighlightedCourse' + +highlightedCourseModule(module) + + when 'landingPageModuleHighlightedLessons' + +highlightLessonsModule(module) diff --git a/views/mixins/_copyModule.pug b/views/mixins/_copyModule.pug new file mode 100644 index 0000000..b410bca --- /dev/null +++ b/views/mixins/_copyModule.pug @@ -0,0 +1,8 @@ +mixin copyModule(module) + .module + .module__copy + h1.module__copy__title #{module.fields.title} + h3.module__copy__headline #{module.fields.headline} + div.module__copy__copy #{module.fields.copy} + + diff --git a/views/mixins/_courseCard.pug b/views/mixins/_courseCard.pug index c996fbd..fe2c82a 100644 --- a/views/mixins/_courseCard.pug +++ b/views/mixins/_courseCard.pug @@ -1,7 +1,7 @@ mixin courseCard(course = {fields: {title: '', description: '', categories: [], slug: ''}}) .course .course__categories - if(course.fields.categories) + if course.fields.categories each category in course.fields.categories a.course__categories--category(href=`categories/${category.fields.slug}`) #{category.title} h1.course__title #{course.fields.title} diff --git a/views/mixins/_heroImageModule.pug b/views/mixins/_heroImageModule.pug new file mode 100644 index 0000000..616c843 --- /dev/null +++ b/views/mixins/_heroImageModule.pug @@ -0,0 +1,6 @@ +mixin heroImageModule(module) + .module + .module__heroImage + h1.module__heroImage__title #{module.fields.title} + h2.module__heroImage__headline #{module.fields.headline} + img.module__heroImage__image(src=`${module.fields.backgroundImage.fields.file.url}` alt=`${module.fields.backgroundImage.fields.title}`) diff --git a/views/mixins/_highlightedCourse.pug b/views/mixins/_highlightedCourse.pug new file mode 100644 index 0000000..70315ce --- /dev/null +++ b/views/mixins/_highlightedCourse.pug @@ -0,0 +1,7 @@ +include ./_courseCard + +mixin highlightedCourseModule(module) + .module + .module__higlightedCourse + h1.module__higlightedCourse__title #{module.fields.title} + +courseCard(module.course) diff --git a/views/mixins/_highlightedLessonsModule.pug b/views/mixins/_highlightedLessonsModule.pug new file mode 100644 index 0000000..4891fa5 --- /dev/null +++ b/views/mixins/_highlightedLessonsModule.pug @@ -0,0 +1,9 @@ +include _lesson + +mixin _highlightLessonsModule(module) + .module + .module__higlightedLessons + h1.module__higlightedLessons__title #{module.fields.title} + each lesson in module.fields.lessons + +lesson(lesson) + diff --git a/views/mixins/_lesson.pug b/views/mixins/_lesson.pug new file mode 100644 index 0000000..52b7402 --- /dev/null +++ b/views/mixins/_lesson.pug @@ -0,0 +1,7 @@ +mixin lesson(lesson) + .lesson + h1.lesson__tilte #{lesson.fields.title} + div.lesson__shortDescription #{lesson.fields.shortDescription} + img.lesson__image(src=`${lesson.fields.image.fields.file.url}` alt=`${lesson.fields.image.fields.title}`) + +