fix(mixins): Add locale/api and active link

This commit is contained in:
Khaled Garbaya
2017-09-28 13:51:53 +02:00
committed by Benedikt Rötsch
parent 07c5cc77b0
commit 713f554609
9 changed files with 32 additions and 25 deletions

6
app.js
View File

@@ -1,5 +1,6 @@
require('dotenv').config({ path: 'variables.env' }) require('dotenv').config({ path: 'variables.env' })
const express = require('express') const express = require('express')
const url = require('url')
const path = require('path') const path = require('path')
const helpers = require('./helpers') const helpers = require('./helpers')
// const favicon = require('serve-favicon') // const favicon = require('serve-favicon')
@@ -31,6 +32,11 @@ app.use(express.static(path.join(__dirname, 'public')))
// Pass custo helpers to all our templates // Pass custo helpers to all our templates
app.use(function (req, res, next) { app.use(function (req, res, next) {
res.locals.helpers = helpers res.locals.helpers = helpers
const qs = url.parse(req.url).query
res.locals.queryString = qs ? `?${qs}` : ''
res.locals.query = req.query
res.locals.currentPath = req.path
console.log(req.path)
next() next()
}) })

View File

@@ -9,8 +9,8 @@ router.get('/', async function (req, res, next) {
let courses = [] let courses = []
let categories = [] let categories = []
try { try {
courses = await getCourses() courses = await getCourses(req.query.locale, req.query.api)
categories = await getCategories() categories = await getCategories(req.query.locale, req.query.api)
} catch (e) { } catch (e) {
console.log('Error ', e) console.log('Error ', e)
} }
@@ -23,7 +23,7 @@ router.get('/categories/:category', async function (req, res, next) {
let courses = [] let courses = []
let categories = [] let categories = []
try { try {
courses = await getCoursesByCategory(req.params.category) courses = await getCoursesByCategory(req.params.category, req.query.locale, req.query.api)
categories = await getCategories() categories = await getCategories()
} catch (e) { } catch (e) {
console.log('Error ', e) console.log('Error ', e)
@@ -33,7 +33,7 @@ router.get('/categories/:category', async function (req, res, next) {
/* GET course detail. */ /* GET course detail. */
router.get('/:slug', async function (req, res, next) { router.get('/:slug', async function (req, res, next) {
let course = await getCourse(req.params.slug) let course = await getCourse(req.params.slug, req.query.locale, req.query.api)
const lessons = course.fields.lessons const lessons = course.fields.lessons
const lessonIndex = lessons.findIndex((lesson) => lesson.fields.slug === req.params.lslug) const lessonIndex = lessons.findIndex((lesson) => lesson.fields.slug === req.params.lslug)
const lesson = lessons[lessonIndex] const lesson = lessons[lessonIndex]
@@ -42,7 +42,7 @@ router.get('/:slug', async function (req, res, next) {
/* GET course lesson detail. */ /* GET course lesson detail. */
router.get('/:cslug/lessons/:lslug', async function (req, res, next) { router.get('/:cslug/lessons/:lslug', async function (req, res, next) {
let course = await getCourse(req.params.cslug) let course = await getCourse(req.params.cslug, req.query.locale, req.query.api)
const lessons = course.fields.lessons const lessons = course.fields.lessons
const lessonIndex = lessons.findIndex((lesson) => lesson.fields.slug === req.params.lslug) const lessonIndex = lessons.findIndex((lesson) => lesson.fields.slug === req.params.lslug)
const lesson = lessons[lessonIndex] const lesson = lessons[lessonIndex]

View File

@@ -4,7 +4,7 @@ const router = express.Router()
/* GET home page. */ /* GET home page. */
router.get('/', async function (req, res, next) { router.get('/', async function (req, res, next) {
const landingPage = await getLandingPage() const landingPage = await getLandingPage(req.query.locale, req.query.api)
res.render('index', { title: 'Contentful University', landingPage }) res.render('index', { title: 'Contentful University', landingPage })
}) })

View File

@@ -5,7 +5,7 @@ let cpaClient = null
exports.initClient = (config = {space: process.env.CF_SPACE, accessToken: process.env.CF_ACCESS_TOKEN}) => { exports.initClient = (config = {space: process.env.CF_SPACE, accessToken: process.env.CF_ACCESS_TOKEN}) => {
cdaClient = createClient(config) cdaClient = createClient(config)
cpaClient = createClient({...config, host: 'preview.contentful.com'}) cpaClient = createClient({space: process.env.CF_SPACE, accessToken: process.env.CF_PREVIEW_ACCESS_TOKEN, host: 'preview.contentful.com'})
} }
exports.getCourses = (locale = 'en-US', api = `cda`) => { exports.getCourses = (locale = 'en-US', api = `cda`) => {

View File

@@ -1,4 +1,5 @@
NODE_ENV=development NODE_ENV=development
CF_SPACE=82t39nctsu20 CF_SPACE=82t39nctsu20
CF_ACCESS_TOKEN=8a3a5137487cc1d04203ee1ff206075bc5dd74342f6b53eb302111fe8d2f235e CF_ACCESS_TOKEN=8a3a5137487cc1d04203ee1ff206075bc5dd74342f6b53eb302111fe8d2f235e
CF_PREVIEW_ACCESS_TOKEN=03265bbaa6138a24cbe370685b2c9993038ee9b6a3b011f30d5c86f7ea885fb3
PORT=3000 PORT=3000

View File

@@ -13,7 +13,7 @@ block content
each l in course.fields.lessons each l in course.fields.lessons
if l.fields if l.fields
li li
a(href=`/courses/${course.fields.slug}/lessons/${l.fields.slug}`) #{l.fields.title} a(href=`/courses/${course.fields.slug}/lessons/${l.fields.slug}${queryString}`) #{l.fields.title}
section.wrapper-with-sidebar__content section.wrapper-with-sidebar__content
h1= course.fields.title h1= course.fields.title
@@ -21,7 +21,7 @@ block content
+lesson(lesson) +lesson(lesson)
if lessonIndex + 1< lessons.length if lessonIndex + 1< lessons.length
if lessons[lessonIndex + 1].fields if lessons[lessonIndex + 1].fields
a.cta(href=`/courses/${course.fields.slug}/lessons/${lessons[lessonIndex + 1].fields.slug}`) View next lesson a.cta(href=`/courses/${course.fields.slug}/lessons/${lessons[lessonIndex + 1].fields.slug}${queryString}`) View next lesson
else else
p !{helpers.markdown(course.fields.description)} p !{helpers.markdown(course.fields.description)}
a.cta(href=`/courses/${course.fields.slug}/lessons/${course.fields.lessons[0].fields.slug}`) Start course a.cta(href=`/courses/${course.fields.slug}/lessons/${course.fields.lessons[0].fields.slug}${queryString}`) Start course

View File

@@ -12,7 +12,7 @@ block content
a.active(href=`/courses`) All courses a.active(href=`/courses`) All courses
each category in categories each category in categories
li li
a(href=`/courses/categories/${category.sys.id}`) #{category.fields.title} a(href=`/courses/categories/${category.sys.id}${queryString}`) #{category.fields.title}
section.wrapper-with-sidebar__content section.wrapper-with-sidebar__content
h1= title h1= title
.courses.grid-list-small .courses.grid-list-small

View File

@@ -17,23 +17,23 @@ html
fieldset fieldset
label(for='api') API type: label(for='api') API type:
select(name='api' onChange='this.form.submit()') select(name='api' onChange='this.form.submit()')
option(value='CDA') Delivery API option(value='cda' selected=query.api === 'cda') Delivery API
option(value='CPA') Preview API option(value='cpa' selected=query.api === 'cpa') Preview API
fieldset fieldset
label(for='locale') Language: label(for='locale') Language:
select(name='locale' onChange='this.form.submit()') select(name='locale' onChange='this.form.submit()')
option(value='en-US') English option(value='en-US' selected=query.locale === 'en-US') English
option(value='de-DE') German option(value='de-DE' selected=query.locale === 'de-DE') German
nav.header__navigation nav.header__navigation
ul ul
li li
a.active(href='/') Home a(href=`/${queryString}` class=(currentPath === '/'? 'active' : '')) Home
li li
a(href='/courses') Courses a(href=`/courses${queryString}` class=(currentPath.startsWith('/courses') ? 'active' : '') ) Courses
li li
a(href='/about') About a(href=`/about${queryString}` class=(currentPath.startsWith('/about') ? 'active' : '')) About
li li
a(href='/settings') Settings a(href=`/settings${queryString}` class=(currentPath.startsWith('/settings') ? 'active' : '')) Settings
#main__content #main__content
block content block content
@@ -45,13 +45,13 @@ html
nav.footer__navigation nav.footer__navigation
ul ul
li li
a.active(href='/') Home a(href=`/${queryString}` class=(currentPath === '/'? 'active' : '')) Home
li li
a(href='/courses') Courses a(href=`/courses${queryString}` class=(currentPath.startsWith('/courses') ? 'active' : '') ) Courses
li li
a(href='/about') About a(href=`/about${queryString}` class=(currentPath.startsWith('/about') ? 'active' : '')) About
li li
a(href='/settings') Settings a(href=`/settings${queryString}` class=(currentPath.startsWith('/settings') ? 'active' : '')) Settings
.footer__apps .footer__apps
a(href='#') a(href='#')
img(src='/images/app-store-badge.png') img(src='/images/app-store-badge.png')

View File

@@ -3,10 +3,10 @@ mixin courseCard(course = {fields: {title: '', description: '', categories: [],
.course-card__categories .course-card__categories
if(course.fields.categories) if(course.fields.categories)
each category in course.fields.categories each category in course.fields.categories
a.course-card__category(href=`/courses/categories/${category.sys.id}`) #{category.fields.title} a.course-card__category(href=`/courses/categories/${category.sys.id}${queryString}`) #{category.fields.title}
h2.course-card__title= course.fields.title h2.course-card__title= course.fields.title
.course-card__description-wrapper .course-card__description-wrapper
p !{helpers.markdown(course.fields.shortDescription)} p !{helpers.markdown(course.fields.shortDescription)}
.course-card__link-wrapper .course-card__link-wrapper
a.course-card__link(href=`/courses/${course.fields.slug}`) view course a.course-card__link(href=`/courses/${course.fields.slug}${queryString}`) view course