From 7d6f6317e569056166486e979f56c83e50473a1e Mon Sep 17 00:00:00 2001 From: "qingwei.li" Date: Wed, 8 Feb 2017 22:00:44 +0800 Subject: [PATCH] fix: render name --- src/event.js | 4 ++-- src/index.js | 31 ++++++++++++++++++------------- src/polyfill.js | 2 +- src/render.js | 42 +++++++++++++++++++++++++----------------- src/tpl.js | 2 +- 5 files changed, 47 insertions(+), 34 deletions(-) diff --git a/src/event.js b/src/event.js index 23a7467eb..6fb35cf03 100644 --- a/src/event.js +++ b/src/event.js @@ -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) diff --git a/src/index.js b/src/index.js index e38317590..ce0338aab 100644 --- a/src/index.js +++ b/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()) }) } diff --git a/src/polyfill.js b/src/polyfill.js index 165fba2ee..f3a032b70 100644 --- a/src/polyfill.js +++ b/src/polyfill.js @@ -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 () { diff --git a/src/render.js b/src/render.js index a01fc9604..3decfaf08 100644 --- a/src/render.js +++ b/src/render.js @@ -57,16 +57,18 @@ export function init () { return `

${text}

` } - 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 = `

${$docsify.name}

` + 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(/]*>([\s\S]+)<\/ul>/g)[0] } else { - html = tpl.tree(genTree(toc, __docsify__.maxLevel), '