|
1 | 1 | const _ = require('lodash'); |
2 | 2 | const chalk = require('chalk'); |
3 | | -const crypto = require('crypto'); |
4 | | -const fm = require('json-front-matter'); |
5 | 3 | const fs = require('fs'); |
6 | | -const glob = require('glob'); |
7 | 4 | const mkdirp = require('mkdirp'); |
8 | 5 | const path = require('path'); |
9 | 6 | const prettyHrtime = require('pretty-hrtime'); |
10 | | -const rmHtmlExt = require('remove-html-extension'); |
11 | | -const titleize = require('titleize'); |
12 | 7 |
|
13 | 8 | const defaults = require('./components-build-defaults'); |
14 | | - |
15 | | -const getTitle = (component) => { |
16 | | - const title = rmHtmlExt(component).replace('src/components/', '').replace(/(\/|_|-)/g, ' '); |
17 | | - return titleize(title); |
18 | | -}; |
19 | | - |
20 | | -const getName = component => titleize(getTitle(component.split('/')[3])); |
| 9 | +const createSections = require('./components-build-sections'); |
21 | 10 |
|
22 | 11 | module.exports = _options => new Promise((resolve, reject) => { |
23 | 12 | const options = _.merge({}, defaults, _options); |
24 | 13 | const startTime = process.hrtime(); |
25 | | - glob(options.components.globPattern, {}, (err, components) => { |
26 | | - console.log(chalk.magenta('Working on components index...')); |
27 | | - if (err) { |
28 | | - reject(err); |
29 | | - return; |
30 | | - } |
31 | | - |
32 | | - const npmPackage = JSON.parse(fs.readFileSync('package.json', 'utf8')); |
33 | | - |
34 | | - const componentsForNav = {}; |
35 | | - components.forEach((component) => { |
36 | | - const componentTokens = component.replace('src/components/', '').split('/'); |
37 | | - const category = componentTokens[0]; |
38 | | - |
39 | | - const componentHtml = fs.readFileSync(component, 'utf8'); |
40 | | - const fmParsed = fm.parse(componentHtml); |
41 | | - const srcFrontMatter = fmParsed.attributes || {}; |
42 | | - const frontMatter = _.merge({}, options.components.frontMatter, srcFrontMatter); |
43 | | - const dir = component.replace('src/', '').replace('.html', ''); |
44 | | - |
45 | | - // Compute component signature based on the Tachyons version and the contents of the |
46 | | - // component itself. This can be used to bust the browser cache of screenshots. |
47 | | - const md5sum = crypto.createHash('md5'); |
48 | | - md5sum.update(npmPackage.version); |
49 | | - md5sum.update(componentHtml); |
50 | | - const signature = md5sum.digest('hex'); |
51 | | - |
52 | | - componentsForNav[category] = componentsForNav[category] || []; |
53 | | - componentsForNav[category].push({ |
54 | | - name: frontMatter.name || getName(component), |
55 | | - title: frontMatter.title || getTitle(component), |
56 | | - src: component, |
57 | | - path: `${dir}/index.html`, |
58 | | - href: `/${dir}/index.html`, |
59 | | - screenshot: { |
60 | | - path: `${dir}/${options.screenshot.basename}`, |
61 | | - href: `/${dir}/${options.screenshot.basename}?version=${signature}`, |
62 | | - }, |
63 | | - signature, |
64 | | - // This is the raw front matter, as found in the component source, NOT merged |
65 | | - // with any defaults, so that it is easier to spot the overrides. |
66 | | - // It is up to build scripts to merge with options.components.frontMatter down the road. |
67 | | - frontMatter: srcFrontMatter, |
68 | | - }); |
69 | | - }); |
70 | | - |
71 | | - const categories = Object.keys(componentsForNav); |
72 | | - console.log( |
73 | | - '- Found', components.length, components.length > 1 ? 'components' : 'component', |
74 | | - 'in', categories.length, categories.length > 1 ? 'categories' : 'category' |
75 | | - ); |
76 | | - |
77 | | - mkdirp.sync(path.dirname(options.components.forNavPath)); |
78 | | - fs.writeFileSync(options.components.forNavPath, JSON.stringify(componentsForNav, undefined, 2)); |
79 | | - console.log('- Created navigation JSON:', options.components.forNavPath); |
80 | | - |
81 | | - const analytics = fs.readFileSync(options.templates.analyticsPath, 'utf8'); |
82 | | - const footer = fs.readFileSync(options.templates.footerPath, 'utf8'); |
83 | | - const head = fs.readFileSync(options.templates.headPath, 'utf8'); |
84 | | - const header = fs.readFileSync(options.templates.headerPath, 'utf8'); |
85 | | - const componentsIndexTemplate = fs.readFileSync(options.templates.componentsIndexPath, 'utf8'); |
86 | | - const lazysizesTemplate = fs.readFileSync(options.templates.lazysizesPath, 'utf8'); |
87 | | - |
88 | | - const compiledPage = _.template(componentsIndexTemplate)({ |
89 | | - componentsForNav, |
90 | | - title: 'Components', |
91 | | - analytics, |
92 | | - footer, |
93 | | - head, |
94 | | - header, |
95 | | - lazysizesTemplate, |
| 14 | + console.log(chalk.magenta('Working on components index...')); |
| 15 | + if (options.components.tempListPath === undefined || |
| 16 | + !fs.existsSync(options.components.tempListPath)) { |
| 17 | + reject('Can not find components list (JSON)'); |
| 18 | + return; |
| 19 | + } |
| 20 | + |
| 21 | + const components = JSON.parse(fs.readFileSync(options.components.tempListPath, 'utf8')); |
| 22 | + |
| 23 | + const templates = { |
| 24 | + analytics: fs.readFileSync(options.templates.analyticsPath, 'utf8'), |
| 25 | + footer: fs.readFileSync(options.templates.footerPath, 'utf8'), |
| 26 | + head: fs.readFileSync(options.templates.headPath, 'utf8'), |
| 27 | + header: fs.readFileSync(options.templates.headerPath, 'utf8'), |
| 28 | + componentsIndex: fs.readFileSync(options.templates.componentsIndexPath, 'utf8'), |
| 29 | + lazysizes: fs.readFileSync(options.templates.lazysizesPath, 'utf8'), |
| 30 | + }; |
| 31 | + |
| 32 | + Object.keys(options.components.index).forEach((key) => { |
| 33 | + const index = options.components.index[key]; |
| 34 | + const componentsBySections = createSections(components, index, options); |
| 35 | + const compiledIndexPage = _.template(templates.componentsIndex)({ |
| 36 | + index, |
| 37 | + componentsBySections, |
| 38 | + templates, |
96 | 39 | options, |
97 | 40 | }); |
98 | | - mkdirp.sync(path.dirname(options.components.indexPath)); |
99 | | - fs.writeFileSync(options.components.indexPath, compiledPage); |
100 | | - console.log('- Created index:', options.components.indexPath); |
101 | | - |
102 | | - const elapsed = process.hrtime(startTime); |
103 | | - console.log(chalk.magenta('Done with components index!'), chalk.dim(prettyHrtime(elapsed))); |
104 | | - resolve(); |
105 | | - }); // glob |
| 41 | + mkdirp.sync(path.dirname(index.path)); |
| 42 | + fs.writeFileSync(index.path, compiledIndexPage); |
| 43 | + console.log(`- Created index "${index.title}":`, index.path); |
| 44 | + }); |
| 45 | + |
| 46 | + const elapsed = process.hrtime(startTime); |
| 47 | + console.log(chalk.magenta('Done with components index!'), chalk.dim(prettyHrtime(elapsed))); |
| 48 | + resolve(); |
106 | 49 | }); // return promise |
0 commit comments