@awesome-fe/translate/exporter/html-exporter.js

Translation utils

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.restructureTable = exports.markAndSwap = exports.HtmlExporter = void 0;
const dom_models_1 = require("../dom/parse5/dom-models");
const common_1 = require("../dom/common");
const slugs = require("github-slugger");
const util_1 = require("util");
const exporter_1 = require("./exporter");
const markdown_1 = require("../dom/unified/markdown");
class HtmlExporter extends exporter_1.Exporter {
    selectors;
    constructor(selectors = dom_models_1.defaultSelectors) {
        super();
        this.selectors = selectors;
    }
    exportContent(content, options) {
        const doc = parseDoc(content);
        this.addIdForHeaders(doc);
        this.markAndSwapAll(doc);
        if (options.mono) {
            this.monochromatic(doc);
        }
        const html = doc.toHtml();
        switch (options.format) {
            case 'auto':
            case undefined:
            case 'html':
                return html;
            case 'markdown':
                return markdown_1.markdown.mdFromHtml(html);
            default:
                return;
        }
    }
    addIdForHeaders(body) {
        const headers = body.querySelectorAll(it => ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(it.nodeName));
        const slugger = slugs();
        headers.forEach(header => {
            if (!header.hasAttribute('id')) {
                header.setAttribute('id', toId(slugger, header.textContent));
            }
        });
    }
    markAndSwapAll(body) {
        restructureTable(body);
        this.selectors.forEach(selector => markAndSwap(body, selector));
    }
    monochromatic(parent) {
        parent.querySelectorAll(it => it.hasAttribute('translation-origin')).forEach(it => it.remove());
        parent.querySelectorAll(it => it.hasAttribute('translation-result')).forEach(it => it.removeAttribute('translation-result'));
        parent.querySelectorAll(it => it.hasAttribute('ng-should-translate')).forEach(it => it.removeAttribute('ng-should-translate'));
    }
}
exports.HtmlExporter = HtmlExporter;
function parseDoc(content) {
    if (content.includes('<html')) {
        return dom_models_1.DomDocument.parse(content);
    }
    else {
        return dom_models_1.DomDocumentFragment.parse(content);
    }
}
function toId(slugger, text) {
    return slugger.slug(text);
}
function isPaired(prev, element) {
    return prev && prev.nextElementSibling === element &&
        prev.isTagOf(element.tagName) && prev.className === element.className;
}
function markAndSwap(element, selector) {
    const elements = element.querySelectorAll(selector);
    elements.forEach(element => {
        if ((0, common_1.containsChinese)(element.innerHTML) && !element.hasAttribute('no-translate') && element.getAttribute('translate') !== 'no') {
            const prev = element.previousElementSibling;
            if (isPaired(prev, element) && !(0, common_1.containsChinese)(prev.innerHTML)) {
                element.setAttribute('translation-result', 'on');
                prev.setAttribute('translation-origin', 'off');
                element.parentNode.insertBefore(element, prev);
                // 交换 id，中文内容应该占用原文的 id
                const id = prev.getAttribute('id');
                if (id) {
                    prev.removeAttribute('id');
                    element.setAttribute('id', id);
                }
                const href = prev.getAttribute('href');
                if (href) {
                    element.setAttribute('href', href);
                }
                if (element.isTagOf('h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'li')) {
                    const prevAnchor = prev.querySelector(it => it.isTagOf('a') && it.hasAttribute('href'));
                    const thisAnchor = element.querySelector(it => it.isTagOf('a') && it.hasAttribute('href'));
                    if (prevAnchor && thisAnchor && (0, common_1.containsChinese)(decodeURIComponent(thisAnchor.getAttribute('href')))) {
                        thisAnchor.setAttribute('href', prevAnchor.getAttribute('href'));
                    }
                }
            }
        }
    });
}
exports.markAndSwap = markAndSwap;
function shouldMergeTable(element) {
    return element.getAttribute('translation-merge-rows') === 'no';
}
function shouldMergeRow(element) {
    if (element.getAttribute('translation-merge-rows') === 'no') {
        return false;
    }
    // 如果内部有 p 元素，则禁止自动合并
    for (let i = 0; i < element.cells.length; ++i) {
        if (element.cells[i].querySelector(it => it.isTagOf('p'))) {
            return false;
        }
    }
    return true;
}
// 重塑表格结构
function restructureTable(element) {
    const items = element.querySelectorAll(it => it.isTagOf('table'));
    items.forEach(table => {
        if (shouldMergeTable(table)) {
            return;
        }
        // 对出现在 thead 的行和出现在 tbody 的行进行统一处理
        const rows = table.querySelectorAll(it => it.isTagOf('tr'));
        const translationRows = [];
        for (let i = 0; i < rows.length - 1; ++i) {
            const thisRow = rows[i];
            const nextRow = rows[i + 1];
            if (shouldMergeRow(nextRow) && (0, common_1.containsChinese)(nextRow.innerHTML) && !(0, common_1.containsChinese)(thisRow.innerHTML)) {
                translationRows.push(nextRow);
                mergeRows(thisRow, nextRow);
            }
        }
        translationRows.forEach(row => row.remove());
    });
}
exports.restructureTable = restructureTable;
function mergeRows(originRow, translationRow) {
    if (originRow.cells.length !== translationRow.cells.length) {
        return;
    }
    for (let i = 0; i < originRow.cells.length; ++i) {
        const originCell = originRow.cells[i];
        const translationCell = translationRow.cells[i];
        if ((0, util_1.isDeepStrictEqual)(originCell.attrs, translationCell.attrs) && originCell.innerHTML !== translationCell.innerHTML) {
            originCell.innerHTML = `<nt-wrapper>${originCell.innerHTML}</nt-wrapper><nt-wrapper>${translationCell.innerHTML}</nt-wrapper>`;
        }
    }
}
//# sourceMappingURL=html-exporter.js.map