generate-site.js

/**
 * # How to generate site
 * npm i handlebars
 * # host on github.io
 * HOSTNAME=https://rapee.github.io/election-map node generate-site.js
 * # production build
 * HOSTNAME=https://elect.in.th/election-map node generate-site.js
 */

const hbs = require('handlebars');
const fs = require('fs');

const template = {
  index: hbs.compile(fs.readFileSync('./templates/index.html', 'utf8')),
  share: hbs.compile(fs.readFileSync('./templates/share.html', 'utf8'))
};

const partySource = fs.readFileSync('./dist/data/party.json', 'utf8');
const partyList = JSON.parse(partySource);
const HOSTNAME = process.env.ENV === 'production'
  ? 'https://elect.in.th/election-map'
  : (process.env.HOSTNAME || 'http://127.0.0.1:8080');
const MAP_HOSTNAME = process.env.MAP_HOSTNAME || HOSTNAME;

const meta = {
  fb_app_id: '171048360504115',
  fb_pixel_id: '1867967129974391',
  ga_id: 'UA-43653558-19',
  mapbox_token: 'pk.eyJ1IjoibGJ1ZCIsImEiOiJCVTZFMlRRIn0.0ZQ4d9-WZrekVy7ML89P4A',
  title: 'พรรคไหนส่งผู้สมัครเขตไหนบ้าง?',
  description: 'เช็คข้อมูลกันได้ที่นี่ เปรียบเทียบพรรคชนพรรค',
  keywords: 'การเมือง, เลือกตั้ง, ประชาธิปไตย, การเมืองไทย, election, politics, democracy, thai politics, visualization, infographic, interactive, data journalism',
  hostname: HOSTNAME,
  map_hostname: MAP_HOSTNAME
};

let output
// index page
output = template.index(meta);
fs.writeFileSync(`./dist/index.html`, output, 'utf8');

// share pages
partyList.forEach(party => {
  const data = Object.assign({}, meta, {
    title: `${meta.title}: ${party.name} (${party.count} เขต)`,
    party: party.name
  });
  output = template.share(data);
  fs.writeFileSync(`./dist/${party.name}.html`, output, 'utf8');
});