CrowiRenderer.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. import marked from 'marked';
  2. import hljs from 'highlight.js';
  3. import MarkdownFixer from './PreProcessor/MarkdownFixer';
  4. import Linker from './PreProcessor/Linker';
  5. import ImageExpander from './PreProcessor/ImageExpander';
  6. import Emoji from './PreProcessor/Emoji';
  7. import Tsv2Table from './LangProcessor/Tsv2Table';
  8. import Template from './LangProcessor/Template';
  9. export default class CrowiRenderer {
  10. constructor(plugins) {
  11. this.preProcessors = [
  12. new MarkdownFixer(),
  13. new Linker(),
  14. new ImageExpander(),
  15. new Emoji(),
  16. ];
  17. this.langProcessors = {
  18. 'tsv': new Tsv2Table(),
  19. 'tsv-h': new Tsv2Table({header: true}),
  20. 'template': new Template(),
  21. };
  22. this.parseMarkdown = this.parseMarkdown.bind(this);
  23. this.codeRenderer = this.codeRenderer.bind(this);
  24. }
  25. preProcess(markdown) {
  26. for (let i = 0; i < this.preProcessors.length; i++) {
  27. if (!this.preProcessors[i].process) {
  28. continue;
  29. }
  30. markdown = this.preProcessors[i].process(markdown);
  31. }
  32. return markdown;
  33. }
  34. codeRenderer(code, lang, escaped) {
  35. let result = '', hl;
  36. if (lang) {
  37. const langPattern = lang.split(':')[0];
  38. if (this.langProcessors[langPattern]) {
  39. return this.langProcessors[langPattern].process(code, lang);
  40. }
  41. try {
  42. hl = hljs.highlight(lang, code);
  43. result = hl.value;
  44. escaped = true;
  45. } catch (e) {
  46. result = code;
  47. }
  48. result = (escape ? result : Crowi.escape(result, true));
  49. return `<pre><code class="lang-${lang}">${result}\n</code></pre>\n`;
  50. }
  51. // no lang specified
  52. return `<pre><code>${Crowi.escape(code, true)}\n</code></pre>`;
  53. }
  54. parseMarkdown(markdown) {
  55. let parsed = '';
  56. const markedRenderer = new marked.Renderer();
  57. markedRenderer.code = this.codeRenderer;
  58. try {
  59. // TODO
  60. marked.setOptions({
  61. gfm: true,
  62. tables: true,
  63. breaks: true,
  64. pedantic: false,
  65. sanitize: false,
  66. smartLists: true,
  67. smartypants: false,
  68. renderer: markedRenderer,
  69. });
  70. parsed = marked(markdown);
  71. } catch (e) { console.log(e, e.stack); }
  72. return parsed;
  73. }
  74. render(markdown) {
  75. let html = '';
  76. markdown = this.preProcess(markdown);
  77. html = this.parseMarkdown(markdown);
  78. return html;
  79. }
  80. }