added an option to set the TOC depth directly inside the [toc] tag

Signed-off-by: Gereon Dusella <git@gereondusella.de>
This commit is contained in:
Gereon Dusella 2020-06-03 18:32:48 +02:00
parent 56e01fa76e
commit b15c59e15e
2 changed files with 17 additions and 3 deletions

View File

@ -1015,14 +1015,19 @@ export function renderTOC (view) {
target.html('')
/* eslint-disable no-unused-vars */
const specificDepth = parseInt(toc.data('toc-depth'))
var tocOptions = md.meta.toc || {}
var maxLevel = (typeof tocOptions.maxLevel === 'number' && tocOptions.maxLevel > 0) ? tocOptions.maxLevel : window.defaultTocDepth
var yamlMaxDepth = (typeof tocOptions.maxLevel === 'number' && tocOptions.maxLevel > 0) ? tocOptions.maxLevel : window.defaultTocDepth
var maxLevel = specificDepth || yamlMaxDepth
const TOC = new window.Toc('doc', {
level: maxLevel,
top: -1,
class: 'toc',
targetId: id,
data: { tocDepth: specificDepth },
process: getHeaderContent
})
/* eslint-enable no-unused-vars */
@ -1268,9 +1273,12 @@ const gistPlugin = new Plugin(
// TOC
const tocPlugin = new Plugin(
// regexp to match
/^\[TOC\]$/i,
/^\[TOC(|\s*maxLevel=\d+?)\]$/i,
(match, utils) => '<div class="toc"></div>'
(match, utils) => {
const tocDepth = match[1].split(/[?&=]+/)[1]
return `<div class="toc" data-toc-depth="${tocDepth}"></div>`
}
)
// slideshare
const slidesharePlugin = new Plugin(

View File

@ -2,6 +2,8 @@
/**
* md-toc.js v1.0.2
* https://github.com/yijian166/md-toc.js
*
* Adapted to accept data attributes
*/
(function (window) {
@ -15,6 +17,7 @@
this.tocTop = parseInt(options.top) || 0
this.elChilds = this.el.children
this.process = options['process']
this.data = options.data || {}
if (!this.elChilds.length) return
this._init()
}
@ -123,6 +126,9 @@
this.toc = document.createElement('div')
this.toc.innerHTML = this.tocContent
this.toc.setAttribute('class', this.tocClass)
if (this.data.tocDepth) {
this.toc.dataset.tocDepth = this.data.tocDepth
}
if (!this.options.targetId) {
this.el.appendChild(this.toc)
} else {