/
index.js
62 lines (52 loc) · 1.83 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
import state from '@canopycanopycanopy/b-ber-lib/State'
import createRenderer from '@canopycanopycanopy/b-ber-grammar-renderer'
import {
htmlId,
attributesObject,
attributesString,
} from '@canopycanopycanopy/b-ber-grammar-attributes'
import plugin from '@canopycanopycanopy/b-ber-parser-gallery'
// define our open and closing markers, used by the `validateOpen` and
// `validateClose` methods in the `createRenderer`
const MARKER_OPEN_RE = /^(spread)(?::([^\s]+)(\s.*)?)?$/
const MARKER_CLOSE_RE = /^(exit)(?::([^\s]+))?/
// a simple `render` function that gets passed into our `createRenderer` is
// responsible for the HTML output.
const render = (tokens, index) => {
const token = tokens[index].info.trim().match(MARKER_OPEN_RE)
if (tokens[index].nesting !== 1 || !token) return ''
const [, type, id, attrs] = token
const attrsObject = attributesObject(attrs, type)
const attrsString = attributesString(attrsObject)
// spread directive is handled differentenly based on build:
// web: drop all assets (images, videos, etc) into a `fullscreen`
// container so that they can be positioned using custom CSS
// epub, mobi: drop all assets into a section.spread container
// that is initialized as a slider via JS if available.
// defaults to a simple sequence of images
// pdf: sequence of images
switch (state.build) {
case 'web':
case 'reader':
return `
<div class="spread">
<div id="${htmlId(id)}" class="spread__content">`
case 'epub':
case 'mobi':
case 'pdf':
case 'sample':
default:
return `<section id="${htmlId(id)}" ${attrsString}>`
}
}
export default {
plugin,
name: 'spread',
renderer: args =>
createRenderer({
...args,
markerOpen: MARKER_OPEN_RE,
markerClose: MARKER_CLOSE_RE,
render,
}),
}