diff --git a/examples/article.html b/examples/article.html index 6f2f262..796cd36 100644 --- a/examples/article.html +++ b/examples/article.html @@ -1,8 +1,6 @@ - - @@ -10,7 +8,7 @@ - - +

We often think of Momentum as a means of dampening oscillations and speeding up the iterations, leading to faster convergence. But it has other interesting behavior. It allows a larger range of step-sizes to be used, and creates its own oscillations. What is going on?

- + 1

A Brief Survey of Techniques

diff --git a/src/components/d-byline.js b/src/components/d-byline.js index ddee1cd..ba8c209 100644 --- a/src/components/d-byline.js +++ b/src/components/d-byline.js @@ -22,13 +22,13 @@ export function bylineTemplate(frontMatter) {

Published

${frontMatter.publishedDate ? ` -

${frontMatter.publishedMonth}. ${frontMatter.publishedDay} ${frontMatter.publishedYear}

` : ` +

${frontMatter.publishedMonth} ${frontMatter.publishedDay}, ${frontMatter.publishedYear}

` : `

Not published yet.

`}

DOI

${frontMatter.doi ? ` -

${frontMatter.doi}

` : ` +

${frontMatter.doi}

` : `

No DOI yet.

`}
diff --git a/src/components/d-citation-list.js b/src/components/d-citation-list.js index d0ec7fb..124e05b 100644 --- a/src/components/d-citation-list.js +++ b/src/components/d-citation-list.js @@ -53,7 +53,9 @@ export class CitationList extends HTMLElement { static get is() { return 'd-citation-list'; } connectedCallback() { - this.style.display = 'none'; + if (!this.hasAttribute('distill-prerendered')) { + this.style.display = 'none'; + } } set citations(citations) { diff --git a/src/controller.js b/src/controller.js index 3a93f02..e7d1932 100644 --- a/src/controller.js +++ b/src/controller.js @@ -73,6 +73,7 @@ export const Controller = { onBibliographyChanged(event) { console.info('BibliographyChanged'); const citationListTag = document.querySelector('d-citation-list'); + const bibliography = event.detail; frontMatter.bibliography = bibliography; @@ -89,11 +90,15 @@ export const Controller = { return; } - const entries = new Map(frontMatter.citations.map( citationKey => { - return [citationKey, frontMatter.bibliography.get(citationKey)]; - })); - citationListTag.citations = entries; + if (citationListTag.hasAttribute('distill-prerendered')) { + console.info('Citation list was prerendered; not updating it.'); + } else { + const entries = new Map(frontMatter.citations.map( citationKey => { + return [citationKey, frontMatter.bibliography.get(citationKey)]; + })); + citationListTag.citations = entries; + } }, onFootnoteChanged() { diff --git a/src/front-matter.js b/src/front-matter.js index f247974..f0383d3 100644 --- a/src/front-matter.js +++ b/src/front-matter.js @@ -1,5 +1,5 @@ const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']; -const months = ['Jan', 'Feb', 'March', 'April', 'May', 'June', 'July', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec']; +const months = ['Jan.', 'Feb.', 'March', 'April', 'May', 'June', 'July', 'Aug.', 'Sept.', 'Oct.', 'Nov.', 'Dec.']; const zeroPad = n => n < 10 ? '0' + n : n; const RFC = function(date) { @@ -83,7 +83,7 @@ export function mergeFromYMLFrontmatter(target, source) { export class FrontMatter { constructor() { - this.title = ''; // 'Attention and Augmented Recurrent Neural Networks' + this.title = 'unnamed article'; // 'Attention and Augmented Recurrent Neural Networks' this.description = ''; // 'A visual overview of neural attention...' this.authors = []; // Array of Author(s) @@ -227,6 +227,22 @@ export class FrontMatter { return zeroPad(this.publishedDate.getDate()); } + get publishedISODateOnly() { + return this.publishedDate.toISOString().split('T')[0]; + } + + get volume() { + const volume = this.publishedYear - 2015; + if (volume < 1) { + throw new Error('Invalid publish date detected during computing volume'); + } + return volume; + } + + get issue() { + return this.publishedDate.getMonth() + 1; + } + // 'Olah & Carter', get concatenatedAuthors() { if (this.authors.length > 2) { diff --git a/src/transforms.js b/src/transforms.js index 9286ffa..cc80b65 100644 --- a/src/transforms.js +++ b/src/transforms.js @@ -24,6 +24,7 @@ import TOC from './transforms/toc'; import Typeset from './transforms/typeset'; import Polyfills from './transforms/polyfills'; import CitationList from './transforms/citation-list'; +import Reorder from './transforms/reorder'; const transforms = new Map([ ['HTML', HTML], @@ -36,6 +37,7 @@ const transforms = new Map([ ['Typeset', Typeset], ['Polyfills', Polyfills], ['CitationList', CitationList], + ['Reorder', Reorder] // keep last ]); /* Distill Transforms */ diff --git a/src/transforms/citation-list.js b/src/transforms/citation-list.js index 373fe1b..f155e1b 100644 --- a/src/transforms/citation-list.js +++ b/src/transforms/citation-list.js @@ -7,5 +7,6 @@ export default function(dom, data) { return [citationKey, data.bibliography.get(citationKey)]; })); renderCitationList(citationListTag, entries, dom); + citationListTag.setAttribute('distill-prerendered', 'true'); } } diff --git a/src/transforms/meta.js b/src/transforms/meta.js index b8e03f6..a02231d 100644 --- a/src/transforms/meta.js +++ b/src/transforms/meta.js @@ -1,3 +1,5 @@ +// TODO: rewrite as template to make order dependencies easier + import favicon from '../assets/distill-favicon.base64'; import escape from 'escape-html'; @@ -16,37 +18,39 @@ export default function(dom, data) { `); + if (data.title) { + appendHead(` + ${escape(data.title)} + `); + } + if (data.url) { appendHead(` `); } - if (data.title) { - appendHead(` - ${data.title} - `); - } if (data.publishedDate){ appendHead(` - - - + + + + `); } (data.authors || []).forEach((a) => { appendHtml(head, ` - `); + `); }); appendHead(` - - + + @@ -56,8 +60,8 @@ export default function(dom, data) { appendHead(` - - + + @@ -143,13 +147,13 @@ function citation_meta_content(ref){ return content; // arXiv is not considered a journal, so we don't need journal/volume/issue } if ('journal' in ref){ - content += `citation_journal_title=${ref.journal};`; + content += `citation_journal_title=${escape(ref.journal)};`; } if ('volume' in ref) { - content += `citation_volume=${ref.volume};`; + content += `citation_volume=${escape(ref.volume)};`; } if ('issue' in ref || 'number' in ref){ - content += `citation_number=${ref.issue || ref.number};`; + content += `citation_number=${escape(ref.issue || ref.number)};`; } return content; } diff --git a/src/transforms/optional-components.js b/src/transforms/optional-components.js index 9409c67..e7897b4 100644 --- a/src/transforms/optional-components.js +++ b/src/transforms/optional-components.js @@ -8,56 +8,50 @@ // if authors, no byline -> add byline export default function(dom, data) { - const article = dom.querySelector('d-article'); + const body = dom.body; + const article = body.querySelector('d-article'); + + // If we don't have an article tag, something weird is going on—giving up. if (!article) { console.warn('No d-article tag found; skipping adding optional components!'); return; } + let byline = dom.querySelector('d-byline'); + if (!byline) { + if (data.authors) { + byline = dom.createElement('d-byline'); + body.insertBefore(byline, article); + } else { + console.warn('No authors found in front matter; please add them before submission!'); + } + } + + let title = dom.querySelector('d-title'); + if (!title) { + let title = dom.createElement('d-title'); + body.insertBefore(title, byline); + } + + let h1 = title.querySelector('h1'); + if (!h1) { + h1 = dom.createElement('h1'); + h1.textContent = data.title; + title.insertBefore(h1, title.firstChild); + } + const hasPassword = typeof data.password !== 'undefined'; - let interstitial = dom.querySelector('d-interstitial'); + let interstitial = body.querySelector('d-interstitial'); if (hasPassword && !interstitial) { const inBrowser = typeof window !== 'undefined'; const onLocalhost = inBrowser && window.location.hostname.includes('localhost'); if (!inBrowser || !onLocalhost) { interstitial = dom.createElement('d-interstitial'); interstitial.password = data.password; - dom.body.insertBefore(interstitial, dom.body.firstChild); + body.insertBefore(interstitial, body.firstChild); } } - // let h1 = dom.querySelector('h1'); - // if (h1) { - // if (!data.title) { - // data.title = h1.textContent; - // } - // } else { - // if (data.title) { - // let headline = dom.createElement('d-title'); - // let h1 = dom.createElement('h1'); - // headline.appendChild(h1); - // h1.textContent = data.title; - // abstract.parentNode.insertBefore(headline, abstract); - // } - // if (data.description) { - // const h2 = dom.createElement('h2'); - // h2.textContent = data.description; - // article.insertBefore(h2, h1.nextSibling); - // } - // } - - let byline = dom.querySelector('d-byline'); - if (!byline && data.authors) { - byline = dom.createElement('d-byline'); - article.parentNode.insertBefore(byline, article); - // const skipTags = ['H1', 'FIGURE', 'D-ABSTRACT']; - // let candidate = h1; - // while (skipTags.indexOf(candidate.tagName) !== -1) { - // candidate = candidate.nextSibling; - // } - // article.insertBefore(byline, candidate); - } - let appendix = dom.querySelector('d-appendix'); if (!appendix) { appendix = dom.createElement('d-appendix'); diff --git a/src/transforms/reorder.js b/src/transforms/reorder.js new file mode 100644 index 0000000..57d4f25 --- /dev/null +++ b/src/transforms/reorder.js @@ -0,0 +1,17 @@ +/* + Try to only reorder things that MAY be user defined. + Try to use templates etc to define the order of our own tags. +*/ + +export default function render(dom) { + const head = dom.head; + + const metaIE = head.querySelector('meta[http-equiv]'); + head.insertBefore(metaIE, head.firstChild); + + const metaViewport = head.querySelector('meta[name=viewport]'); + head.insertBefore(metaViewport, head.firstChild); + + const metaCharset = head.querySelector('meta[charset]'); + head.insertBefore(metaCharset, head.firstChild); +}