diff --git a/examples/article.html b/examples/article.html index 172cc9c..3631bf1 100644 --- a/examples/article.html +++ b/examples/article.html @@ -2,20 +2,29 @@ - - + + + diff --git a/src/components/d-front-matter.js b/src/components/d-front-matter.js index 27c06a9..6c2e084 100644 --- a/src/components/d-front-matter.js +++ b/src/components/d-front-matter.js @@ -1,15 +1,19 @@ -import ymlParse from 'js-yaml'; +// import ymlParse from 'js-yaml'; export function parseFrontmatter(element) { const scriptTag = element.querySelector('script'); if (scriptTag) { - const yml = scriptTag.textContent; - const data = ymlParse.safeLoad(yml); - return data; + const type = scriptTag.getAttribute('type'); + if (type.split('/')[1] == 'json') { + const content = scriptTag.textContent; + return JSON.parse(content); + } else { + console.error('Distill only supoprts JSON frontmatter tags anymore; no more YAML.'); + } } else { console.error('You added a frontmatter tag but did not provide a script tag with front matter data in it. Please take a look at our templates.'); - return {}; } + return {}; } export class FrontMatter extends HTMLElement { diff --git a/src/front-matter.js b/src/front-matter.js index 503fc28..bcab128 100644 --- a/src/front-matter.js +++ b/src/front-matter.js @@ -15,11 +15,18 @@ const RFC = function(date) { class Author { - constructor(name='', personalURL='', affiliation='', affiliationURL='') { - this.name = name; // 'Chris Olah' - this.personalURL = personalURL; // 'https://colah.github.io' - this.affiliation = affiliation; // 'Google Brain' - this.affiliationURL = affiliationURL; // 'https://g.co/brain' + // constructor(name='', personalURL='', affiliation='', affiliationURL='') { + // this.name = name; // 'Chris Olah' + // this.personalURL = personalURL; // 'https://colah.github.io' + // this.affiliation = affiliation; // 'Google Brain' + // this.affiliationURL = affiliationURL; // 'https://g.co/brain' + // } + + constructor(object) { + this.name = object.author; // 'Chris Olah' + this.personalURL = object.authorURL; // 'https://colah.github.io' + this.affiliation = object.affiliation; // 'Google Brain' + this.affiliationURL = object.affiliationURL; // 'https://g.co/brain' } // 'Chris' @@ -113,38 +120,7 @@ export class FrontMatter { this.title = data.title; this.publishedDate = new Date(data.published); this.description = data.description; - const zipped = data.authors.map( (author, index) => [author, data.affiliations[index]]); - this.authors = zipped.map( ([authorEntry, affiliationEntry]) => { - const author = new Author(); - - // try to get name and personal url - switch (typeof authorEntry) { - case 'object': - author.name = Object.keys(authorEntry)[0]; - author.personalURL = authorEntry[author.name]; - break; - case 'string': - author.name = authorEntry; - break; - default: - throw new Error('Invalid type in frontmatter author field: ' + authorEntry); - } - - // try to get affiliation name and affiliation url - switch (typeof affiliationEntry) { - case 'object': - author.affiliation = Object.keys(affiliationEntry)[0]; - author.affiliationURL = affiliationEntry[author.affiliation]; - break; - case 'string': - author.affiliation = affiliationEntry; - break; - default: - throw new Error('Invalid type in frontmatter affiliation field: ' + affiliationEntry); - } - - return author; - }); + this.authors = data.authors.map( (authorObject) => new Author(authorObject)); } //