效果演示:
0.2更新富文本和图片导出支持
代码:
/**
* @title 导出为PDF0.2
* @author Innis
* @note 将当前页面导出为可编辑的PDF格式。
*/
// import "./print"
pluginManager.register('pdfExport', {
after_docmenu_run() {
plugin.menu.group.doc.sub.exportAs.sub.pdf = {
label: "PDF",
icon: "caret-right",
action() {
const ky = this.nv.ky;
const bullets = plugin.memory.get(ky, true);
let htmlPrintContent = plugin.pdfExport.html(bullets)
let pageTopic = bullets.text
htmlPrintContent = `<div id="printContent">${htmlPrintContent}</div>`;
htmlPrintContent = htmlPrintContent.replace("</li></ul></div>", "</div>").replace(`<ul><li>${pageTopic}`, "");
let regex1 = /<span ps='.'>(\S|\s)+?<\/span>/g;
let subst1 = ``;
let regex2 = /<span(\S|\s)+?>/g;
let subst2 = ``;
let regex3 = /<s ps='.'>(\S|\s)+?<\/s>/g;
let subst3 = ``;
htmlPrintContent = htmlPrintContent.replace(regex1, subst1)
.replace(regex2, subst2)
.replace(regex3, subst3)
.replace('data/user-data', 'https://roamedit.com/edit/data/user-data');
$("body").append(htmlPrintContent);
printJS({
printable: 'printContent',
type: 'html', header: pageTopic,
scanStyles: false,
documentTitle: pageTopic,
onLoadingEnd: function () { $("#printContent").remove(); },
style: "li::marker {color:silver;content:'• ';} b[color=red]{color:#d9534f} b[color=green]{color:#5cb85c} b[color=blue]{color:#337ab7} b[color=yellow]{color:#f2b968} highlight{background-color:#fbe9cf;mso-highlight:yellow;color-adjust:exact;-webkit-print-color-adjust: exact;}"
});
}
}
},
html(node) {
let wrapTag = 'ul'
function item2li(itemJson) {
if (isEmpty(itemJson)) {
return '';
}
let html = '';
if (!isEmpty(itemJson.child)) {
html += list2ul(itemJson.child);
}
return `<li>${itemJson.text || itemJson.ori}${html}</li>`;
}
function list2ul(listJson) {
let html = '';
for (const item of listJson) {
html += item2li(item);
}
return `<ul>${html}</ul>`;
}
let html = item2li(node);
if (!isEmpty(wrapTag)) {
html = `<${wrapTag}>${html}</${wrapTag}>`;
}
return html;
},
run() {
loadScript("https://unpkg.com/print-js@1.6.0/dist/print.js")
}
});
注意事项:
打印的时候目标打印机请选择“另存为PDF”,这样打印出的PDF就是可以编辑了。
路线图(接下来准备实现的功能):
1.增加对导出代码的支持
2.增加对导出图片的支持 ✅
3. 增加对自定义css的支持(分选择类和代码类)
4. 增加辅助线
5. 增加对多级标题的支持
6. 导出前检测当前的样式
7. 依赖检测机制