Scrapbox to Markdown

scrapdown.js

(function() {
  let result = ``
  result += `# ${document.querySelector('.lines .line-title').innerText}\n`

  let insideCode = false
  let afterBlankLine = false

  document.querySelectorAll('.lines .line:not(:first-child) .text > span:last-child').forEach((el, idx) => {
    let ht = el.innerHTML
      .replace(/<span class="c-(\d+)( empty-char-index)?"( style="")?>(.)<\/span>/g, '$4') // normal text

    let isBlankLine = !!/<span class="c-(\d+)(c-(\d+) )*"><br class="empty-char-index"><\/span>/.test(ht)

    ht = ht
      .replace(/<span class="c-(\d+)(c-(\d+) )*"><br class="empty-char-index"><\/span>/, '') // empty char
      .replace(/<a type="hashTag" class="page-link(?: empty-page-link)?" href="(.+?)" rel="route">(.+?)<\/a>/g, '$2') // disable #page-link
      .replace(/<a class="link" href="(.+)" rel="noopener noreferrer" target="_blank">(.+)<\/a>/g, '[$2]($1)') // normal link
      .replace(/<span class="quote"><span class="c-0"( style="")?>&gt;<\/span>(.+)<\/span>/g, '>$2') // quote
      .replace(/<code><span class="backquote"> <\/span><span><span>(.+?)<\/span><\/span><span class="backquote"> <\/span><\/code>/g, "`$1`") // `backquote`
      .replace(/<span class="deco">(?:<span class="(.+?)"> +<\/span>)?<strong class="level-(\d+)"><span class="deco-\*">(.+?)<\/span><\/strong> <\/span>/g, '**$3**') // [* deco]
      .replace(/<span class="deco">(?:<span class="(.+?)"> +<\/span>)?<strike><span class="deco--">(.+?)<\/span><\/strike> <\/span>/g, '~~$2~~') // [- deco]
      .replace(/<span class="modal-image"><a href="(.+?)"><img class="image" src="(.+?)"><\/a><\/span>/g, '![]($2)')
      .replace(/<span class="strong">(?:<span class="(.+?)"> +<\/span>)?<strong>(.+?)<\/strong><span class="(.+?)"> <\/span><\/span>/g, (all, g1, g2) => {
        if (afterBlankLine) {
          // if it is [[header]] of a new section
          return `## ${g2}`
        } else {
          return `**${g2}**`
        }
      }) // [[ strong ]] or h2
      .replace(/<span><span class="indent-mark" style="width: (.+?)em;">(?:<span class="c-(?:\d+)"(?: style="")?><span class="pad">\s<\/span><\/span>)+<span class="dot"><\/span><\/span><span class="indent" style="margin-left: (.+?)em;">(.+)<\/span><\/span>/, (all, g1, g2, g3) => {
        return new Array(g1 / 1.5).join('  ') + '- ' + g3
      })

    // end of code block
    if (insideCode && !(/<code><span><span>(.+)<\/span><\/span><\/code>/).test(ht)) {
      insideCode = false
      result += '```\n'
    }
    // start of code block
    ht = ht.replace(/<code><span class="code-block-start" title="(.+)">(?:<span>|<a href="(?:.+?)" target="_blank">)(.+)(?:<\/span>|<\/a>)<\/span><\/code>/, (all, g1) => {
      insideCode = true
      return '```' + g1
    })

    ht = ht
      .replace(/<span class="c-(\d+)( empty-char-index)?"( style="")?>(.+?)<\/span>/g, '$4')
      .replace(/<code><span><span>(.+)<\/span><\/span><\/code>/, '$1')
      .replace(/<span(.*?)>|<\/span>/g, '')

    afterBlankLine = isBlankLine

    result += ht
    result += insideCode ? "\n" : "  \n"
  })

  if (insideCode) {
    result += "```\n"
  }

  let escaped = result
    .replace(/&/g, '&amp;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#39;')

  let wi = window.open()
  wi.document.open()
  wi.document.write(`<pre>${escaped}</pre>`)
  wi.document.close()

})(document)