import fs from 'node:fs';
import mustache from 'mustache';
import {u} from 'unist-builder';
import {h} from 'hastscript';
import {select} from 'hast-util-select';
import {toString as hastToString} from 'mdast-util-to-string';
import cssesc from 'cssesc';

import {toHtmlRaw, toString, toMdRaw, mdToHtmlRaw} from './to-html.mjs';
import loadSVG from './load-svg.mjs';
import listArticles from './list-articles.mjs';
import getRSS from './rss.mjs';
import toml from '@ltd/j-toml';

const loadMD = (listFile, suffix) => {
  const listContent = [];
  for (const file of listFile) {
    console.log(`Working on ${file}`);
    const content = fs.readFileSync(`${suffix}/${file}`, 'utf8');
    const mdRaw = toMdRaw(content);
    const tomlStringValue = mdRaw.children[0].value;
    const metaData = toml.parse(tomlStringValue);
    const newHTML = mdToHtmlRaw(mdRaw);

    const htmlContent = newHTML;
    const htmlRender = toString(htmlContent);

    const titleHtml = select('h1', htmlContent);
    const intro = select('p', htmlContent);
    intro.children = intro.children.filter(child => child.tagName !== 'br');

    const logo = select('img', intro);
    logo.properties.src = `${suffix}/${logo.properties.src}`;
    logo.properties.height = '150px';
    logo.properties.width = '150px';
    titleHtml.children[0].properties.href = `${suffix}/${file.slice(0, -3)}.html`;

    const title = hastToString(titleHtml);
    const domTitle = cssesc(title.replace(/\s+/g, '-').replace(/['"#@]/, '').toLowerCase()); // Maybe encodeURI

    const readMore = h('a', 'Lire plus...');

    readMore.properties.href = `${suffix}/${file.slice(0, -3)}.html`;
    readMore.properties.role = 'expend';
    readMore.properties.for = domTitle;

    listContent.push({
      name: file.slice(0, -3),
      content: htmlRender,
      intro: toString(u('root', [titleHtml, intro, readMore])),
      introDesc: hastToString(intro),
      imageUrl: logo.properties.src,
      metaData,
      title,
      domTitle,
    });
  }

  return listContent;
};

const leftPanelTmpl = fs.readFileSync('src/templates/left.tmpl', 'utf8');
const headerTmpl = fs.readFileSync('src/templates/header.tmpl', 'utf8');
const articleTmpl = fs.readFileSync('src/templates/article.tmpl', 'utf8');
const indexTmpl = fs.readFileSync('src/templates/index.tmpl', 'utf8');

const partials = {
  header: headerTmpl,
  leftPanel: leftPanelTmpl,
};

const svg = loadSVG();

const articles = loadMD(listArticles, 'articles');

for (const article of articles) {
  const context = {
    svg,
    title: `${article.title} - ache`,
    content: article.content,
    domTitle: article.domTitle,
  };
  const output = mustache.render(articleTmpl, context, partials);

  console.log(`Create : ${article.title}`);
  fs.writeFileSync(`articles/${article.name}.html`, output);
}

console.log('Create : rss.xml');
const xmlFeed = getRSS(articles);
fs.writeFileSync('rss.xml', xmlFeed);

{
  const context = {
    title: 'ache: Blog personnel',
    svg,
    articles,
  };

  console.log('Create : Home page');
  const output = mustache.render(indexTmpl, context, partials);
  fs.writeFileSync('index.html', output);
}