mirror of
https://github.com/docsifyjs/docsify.git
synced 2025-12-08 19:55:52 +00:00
fix: render name
This commit is contained in:
qingwei.li
cinwell.li
parent
168d8475d5
commit
12e2479014
@ -9,7 +9,7 @@ export function scrollActiveSidebar () {
|
||||
|
||||
let hoveredOverSidebar = false
|
||||
const anchors = document.querySelectorAll('.anchor')
|
||||
const sidebar = document.querySelector('aside.sidebar')
|
||||
const sidebar = document.querySelector('.sidebar>div')
|
||||
const sidebarHeight = sidebar.clientHeight
|
||||
|
||||
const nav = {}
|
||||
@ -126,7 +126,7 @@ export function bindToggle (dom) {
|
||||
dom.addEventListener('click', () => body.classList.toggle('close'))
|
||||
|
||||
if (isMobile()) {
|
||||
const sidebar = document.querySelector('aside.sidebar')
|
||||
const sidebar = document.querySelector('.sidebar div')
|
||||
sidebar.addEventListener('click', () => {
|
||||
body.classList.toggle('close')
|
||||
setTimeout(() => activeLink(sidebar, true), 0)
|
||||
|
||||
31
src/index.js
31
src/index.js
@ -1,8 +1,8 @@
|
||||
import { load, camel2kebab, isNil, getRoute, merge } from './util'
|
||||
import * as utils from './util'
|
||||
import { scrollIntoView, activeLink } from './event'
|
||||
import * as render from './render'
|
||||
|
||||
const OPTIONS = merge({
|
||||
const OPTIONS = utils.merge({
|
||||
el: '#app',
|
||||
repo: '',
|
||||
maxLevel: 6,
|
||||
@ -22,8 +22,8 @@ const script = document.currentScript || [].slice.call(document.getElementsByTag
|
||||
// load configuration for script attribute
|
||||
if (script) {
|
||||
for (const prop in OPTIONS) {
|
||||
const val = script.getAttribute('data-' + camel2kebab(prop))
|
||||
OPTIONS[prop] = isNil(val) ? OPTIONS[prop] : (val || true)
|
||||
const val = script.getAttribute('data-' + utils.camel2kebab(prop))
|
||||
OPTIONS[prop] = utils.isNil(val) ? OPTIONS[prop] : (val || true)
|
||||
}
|
||||
if (OPTIONS.loadSidebar === true) OPTIONS.loadSidebar = '_sidebar.md'
|
||||
if (OPTIONS.loadNavbar === true) OPTIONS.loadNavbar = '_navbar.md'
|
||||
@ -33,16 +33,20 @@ if (script) {
|
||||
}
|
||||
|
||||
// utils
|
||||
window.__docsify__ = OPTIONS
|
||||
window.$docsify = OPTIONS
|
||||
window.Docsify = {
|
||||
installed: true,
|
||||
utils: utils.merge({}, utils)
|
||||
}
|
||||
|
||||
// load options
|
||||
render.init(OPTIONS)
|
||||
render.init()
|
||||
|
||||
let cacheRoute = null
|
||||
let cacheXhr = null
|
||||
|
||||
const mainRender = function (cb) {
|
||||
const route = OPTIONS.basePath + getRoute()
|
||||
const route = OPTIONS.basePath + utils.getRoute()
|
||||
if (cacheRoute === route) return cb()
|
||||
|
||||
let basePath = cacheRoute = route
|
||||
@ -64,12 +68,12 @@ const mainRender = function (cb) {
|
||||
|
||||
// Render Cover page
|
||||
if (OPTIONS.coverpage && page === OPTIONS.homepage) {
|
||||
load(OPTIONS.coverpage).then(render.renderCover)
|
||||
utils.load(OPTIONS.coverpage).then(render.renderCover)
|
||||
}
|
||||
|
||||
cacheXhr && cacheXhr.abort && cacheXhr.abort()
|
||||
// Render markdown file
|
||||
cacheXhr = load(page, 'GET', render.renderLoading)
|
||||
cacheXhr = utils.load(page, 'GET', render.renderLoading)
|
||||
cacheXhr.then(result => {
|
||||
render.renderArticle(result)
|
||||
// clear cover
|
||||
@ -78,8 +82,8 @@ const mainRender = function (cb) {
|
||||
if (OPTIONS.loadSidebar) {
|
||||
const renderSidebar = result => { render.renderSidebar(result); cb() }
|
||||
|
||||
load(basePath + OPTIONS.loadSidebar).then(renderSidebar,
|
||||
_ => load(OPTIONS.loadSidebar).then(renderSidebar))
|
||||
utils.load(basePath + OPTIONS.loadSidebar).then(renderSidebar,
|
||||
_ => utils.load(OPTIONS.loadSidebar).then(renderSidebar))
|
||||
} else {
|
||||
cb()
|
||||
}
|
||||
@ -87,8 +91,8 @@ const mainRender = function (cb) {
|
||||
|
||||
// Render navbar
|
||||
if (OPTIONS.loadNavbar) {
|
||||
load(basePath + OPTIONS.loadNavbar).then(render.renderNavbar,
|
||||
_ => load(OPTIONS.loadNavbar).then(render.renderNavbar))
|
||||
utils.load(basePath + OPTIONS.loadNavbar).then(render.renderNavbar,
|
||||
_ => utils.load(OPTIONS.loadNavbar).then(render.renderNavbar))
|
||||
}
|
||||
}
|
||||
|
||||
@ -99,6 +103,7 @@ const Docsify = function () {
|
||||
mainRender(_ => {
|
||||
scrollIntoView()
|
||||
activeLink('nav')
|
||||
;[].concat(window.$docsify.plugins).forEach(fn => fn && fn())
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { load } from './util'
|
||||
|
||||
function replaceVar (block) {
|
||||
block.innerHTML = block.innerHTML.replace(/var\(\s*--theme-color.*?\)/g, __docsify__.themeColor)
|
||||
block.innerHTML = block.innerHTML.replace(/var\(\s*--theme-color.*?\)/g, $docsify.themeColor)
|
||||
}
|
||||
|
||||
export function cssVars () {
|
||||
|
||||
@ -57,16 +57,18 @@ export function init () {
|
||||
return `<p>${text}</p>`
|
||||
}
|
||||
|
||||
if (typeof __docsify__.markdown === 'function') {
|
||||
if (typeof $docsify.markdown === 'function') {
|
||||
markdown.setOptions({ renderer })
|
||||
markdown = __docsify__.markdown.call(this, markdown)
|
||||
markdown = $docsify.markdown.call(this, markdown)
|
||||
} else {
|
||||
markdown.setOptions(merge({ renderer }, __docsify__.markdown))
|
||||
markdown.setOptions(merge({ renderer }, $docsify.markdown))
|
||||
}
|
||||
|
||||
const md = markdown
|
||||
|
||||
markdown = text => emojify(md(text))
|
||||
|
||||
window.Docsify.utils.marked = markdown
|
||||
}
|
||||
|
||||
/**
|
||||
@ -75,23 +77,29 @@ export function init () {
|
||||
export function renderApp (dom, replace) {
|
||||
const nav = document.querySelector('nav') || document.createElement('nav')
|
||||
|
||||
if (!__docsify__.repo) nav.classList.add('no-badge')
|
||||
if (!$docsify.repo) nav.classList.add('no-badge')
|
||||
|
||||
dom[replace ? 'outerHTML' : 'innerHTML'] = tpl.corner(__docsify__.repo) +
|
||||
(__docsify__.coverpage ? tpl.cover() : '') +
|
||||
dom[replace ? 'outerHTML' : 'innerHTML'] = tpl.corner($docsify.repo) +
|
||||
($docsify.coverpage ? tpl.cover() : '') +
|
||||
tpl.main()
|
||||
document.body.insertBefore(nav, document.body.children[0])
|
||||
|
||||
// theme color
|
||||
if (__docsify__.themeColor) {
|
||||
document.head.innerHTML += tpl.theme(__docsify__.themeColor)
|
||||
if ($docsify.themeColor) {
|
||||
document.head.innerHTML += tpl.theme($docsify.themeColor)
|
||||
polyfill.cssVars()
|
||||
}
|
||||
|
||||
// render name
|
||||
if ($docsify.name) {
|
||||
const aside = document.querySelector('.sidebar')
|
||||
aside.innerHTML = `<h1><a href="${$docsify.nameLink}">${$docsify.name}</a></h1>` + aside.innerHTML
|
||||
}
|
||||
|
||||
// bind toggle
|
||||
event.bindToggle('button.sidebar-toggle')
|
||||
// bind sticky effect
|
||||
if (__docsify__.coverpage) {
|
||||
if ($docsify.coverpage) {
|
||||
!isMobile() && window.addEventListener('scroll', event.sticky)
|
||||
} else {
|
||||
document.body.classList.add('sticky')
|
||||
@ -103,7 +111,7 @@ export function renderApp (dom, replace) {
|
||||
*/
|
||||
export function renderArticle (content) {
|
||||
renderTo('article', content ? markdown(content) : 'not found')
|
||||
if (!__docsify__.loadSidebar) renderSidebar()
|
||||
if (!$docsify.loadSidebar) renderSidebar()
|
||||
|
||||
if (content && typeof Vue !== 'undefined') {
|
||||
CACHE.vm && CACHE.vm.$destroy()
|
||||
@ -120,7 +128,7 @@ export function renderArticle (content) {
|
||||
: new Vue({ el: 'main' }) // eslint-disable-line
|
||||
CACHE.vm && CACHE.vm.$nextTick(_ => event.scrollActiveSidebar())
|
||||
}
|
||||
if (__docsify__.auto2top) setTimeout(() => event.scroll2Top(__docsify__.auto2top), 0)
|
||||
if ($docsify.auto2top) setTimeout(() => event.scroll2Top($docsify.auto2top), 0)
|
||||
}
|
||||
|
||||
/**
|
||||
@ -145,12 +153,12 @@ export function renderSidebar (content) {
|
||||
// find url tag
|
||||
html = html.match(/<ul[^>]*>([\s\S]+)<\/ul>/g)[0]
|
||||
} else {
|
||||
html = tpl.tree(genTree(toc, __docsify__.maxLevel), '<ul>')
|
||||
html = tpl.tree(genTree(toc, $docsify.maxLevel), '<ul>')
|
||||
}
|
||||
|
||||
html = (__docsify__.name ? `<h1><a href="${__docsify__.nameLink}">${__docsify__.name}</a></h1>` : '') + html
|
||||
renderTo('aside.sidebar', html)
|
||||
const target = event.activeLink('aside.sidebar', true)
|
||||
console.log(html)
|
||||
renderTo('.sidebar>div', html)
|
||||
const target = event.activeLink('.sidebar>div', true)
|
||||
if (target) renderSubSidebar(target)
|
||||
toc = []
|
||||
|
||||
@ -158,8 +166,8 @@ export function renderSidebar (content) {
|
||||
}
|
||||
|
||||
export function renderSubSidebar (target) {
|
||||
if (!__docsify__.subMaxLevel) return
|
||||
target.parentNode.innerHTML += tpl.tree(genTree(toc, __docsify__.subMaxLevel), '<ul>')
|
||||
if (!$docsify.subMaxLevel) return
|
||||
target.parentNode.innerHTML += tpl.tree(genTree(toc, $docsify.subMaxLevel), '<ul>')
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -23,7 +23,7 @@ export function corner (data) {
|
||||
* Render main content
|
||||
*/
|
||||
export function main () {
|
||||
const aside = `${toggle()}<aside class="sidebar"></aside>`
|
||||
const aside = `${toggle()}<aside class="sidebar"><div></div></aside>`
|
||||
|
||||
return (isMobile() ? `${aside}<main>` : `<main>${aside}`) +
|
||||
`<section class="content">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user