Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/userGuide/usingPlugins.md
Original file line numberDiff line numberDiff line change
Expand Up@@ -146,6 +146,29 @@ This will add the following link and script elements to the page:
- `<script src="SCRIPT_LINK"></script>`
- `<script>alert("hello")</script>`

### Advanced: Default plugins

MarkBind has a set of default plugins that it uses to carry out some of its features. These are enabled by default for every project and should be left alone.

Default Plugin | Functionality
--- | ---
`anchors` | Attaches anchor links to the side of headings.

Although not advised, you can disable these by passing `"off": true` in the `pluginsContext`.

Disabling the `anchors` plugin:

```js
{
...
"pluginsContext": {
"anchors": {
"off": true
}
}
}
```

### Built-in plugins

MarkBind has a set of built-in plugins that can be used immediately without installation.
Expand Down
44 changes: 17 additions & 27 deletions src/Page.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -38,7 +38,6 @@ const PAGE_NAV_CONENT_WRAPPER_ID = 'page-nav-content-wrapper';
const SITE_NAV_ID = 'site-nav';
const TITLE_PREFIX_SEPARATOR = ' - ';

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';
const DROPDOWN_BUTTON_ICON_HTML = '<i class="dropdown-btn-icon">\n'
+ '<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>\n'
+ '</i>';
Expand DownExpand Up@@ -457,29 +456,6 @@ Page.prototype.concatenateHeadingsAndKeywords = function () {
});
};

/**
* Adds anchor links to headings in the page
* @param content of the page
*/
Page.prototype.addAnchors = function (content) {
const $ = cheerio.load(content, { xmlMode: false });
if (this.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(this.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
};

/**
* Records the dynamic or static included files into this.includedFiles
* @param dependencies array of maps of the external dependency and where it is included
Expand DownExpand Up@@ -793,7 +769,6 @@ Page.prototype.generate = function (builtFiles) {
.then(result => markbinder.resolveBaseUrl(result, fileConfig))
.then(result => fs.outputFileAsync(this.tempPath, result))
.then(() => markbinder.renderFile(this.tempPath, fileConfig))
.then(result => this.addAnchors(result))
.then(result => this.postRender(result))
.then(result => this.collectPluginsAssets(result))
.then((result) => {
Expand DownExpand Up@@ -829,6 +804,19 @@ Page.prototype.generate = function (builtFiles) {
});
};

/**
* Retrieves page config for plugins
*/
Page.prototype.getPluginConfig = function () {
return {
headingIndexingLevel: this.headingIndexingLevel,
enableSearch: this.enableSearch,
searchable: this.searchable,
rootPath: this.rootPath,
sourcePath: this.sourcePath,
};
};

/**
* Entry point for plugin pre-render
*/
Expand All@@ -837,7 +825,8 @@ Page.prototype.preRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.preRender) {
preRenderedContent
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.preRender(preRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
Comment thread
jamos-tay marked this conversation as resolved.
});
return preRenderedContent;
Expand All@@ -851,7 +840,8 @@ Page.prototype.postRender = function (content) {
Object.entries(this.plugins).forEach(([pluginName, plugin]) => {
if (plugin.postRender) {
postRenderedContent
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {}, this.frontMatter);
= plugin.postRender(postRenderedContent, this.pluginsContext[pluginName] || {},
this.frontMatter, this.getPluginConfig());
}
});
return postRenderedContent;
Expand Down
77 changes: 65 additions & 12 deletions src/Site.js
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,7 +11,9 @@ const walkSync = require('walk-sync');

const _ = {};
_.difference = require('lodash/difference');
_.get = require('lodash/get');
_.has = require('lodash/has');
_.includes = require('lodash/includes');
_.isBoolean = require('lodash/isBoolean');
_.isUndefined = require('lodash/isUndefined');
_.noop = require('lodash/noop');
Expand All@@ -37,12 +39,14 @@ const TEMPLATE_ROOT_FOLDER_NAME = 'template';
const TEMPLATE_SITE_ASSET_FOLDER_NAME = 'markbind';

const BUILT_IN_PLUGIN_FOLDER_NAME = 'plugins';
const BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME = 'plugins/default';
const FAVICON_DEFAULT_PATH = 'favicon.ico';
const FONT_AWESOME_PATH = 'asset/font-awesome.csv';
const FOOTER_PATH = '_markbind/footers/footer.md';
const GLYPHICONS_PATH = 'asset/glyphicons.csv';
const HEAD_FOLDER_PATH = '_markbind/head';
const INDEX_MARKDOWN_FILE = 'index.md';
const MARKBIND_PLUGIN_PREFIX = 'markbind-plugin-';
const PAGE_TEMPLATE_NAME = 'page.ejs';
const PROJECT_PLUGIN_FOLDER_NAME = '_markbind/plugins';
const SITE_CONFIG_NAME = 'site.json';
Expand DownExpand Up@@ -682,7 +686,8 @@ Site.prototype.buildAssets = function () {

/**
* Retrieves the correct plugin path for a plugin name, if not in node_modules
* @param pluginName name of the plugin
* @param rootPath root of the project
* @param plugin name of the plugin
*/
function getPluginPath(rootPath, plugin) {
// Check in project folder
Expand All@@ -692,32 +697,80 @@ function getPluginPath(rootPath, plugin) {
}

// Check in src folder
const defaultPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
const srcPath = path.join(__dirname, BUILT_IN_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(srcPath)) {
return srcPath;
}

// Check in default folder
const defaultPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME, `${plugin}.js`);
if (fs.existsSync(defaultPath)) {
return defaultPath;
}

return '';
}

/**
* Finds plugins in the site's default plugin folder
*/
function findDefaultPlugins() {
const globPath = path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME);
if (!fs.existsSync(globPath)) {
return [];
}
return walkSync(globPath, {
directories: false,
globs: [`${MARKBIND_PLUGIN_PREFIX}*.js`],
}).map(file => path.parse(file).name);
}

/**
* Loads a plugin
* @param plugin name of the plugin
* @param isDefault whether the plugin is a default plugin
*/
Site.prototype.loadPlugin = function (plugin, isDefault) {
try {
// Check if already loaded
if (this.plugins[plugin]) {
return;
}

const pluginPath = getPluginPath(this.rootPath, plugin);
if (isDefault && !pluginPath.startsWith(path.join(__dirname, BUILT_IN_DEFAULT_PLUGIN_FOLDER_NAME))) {
logger.warn(`Default plugin ${plugin} will be overridden`);
}

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
};

/**
* Load all plugins of the site
*/
Site.prototype.collectPlugins = function () {
if (!this.siteConfig.plugins) {
return;
this.siteConfig.plugins = [];
}

module.paths.push(path.join(this.rootPath, 'node_modules'));
this.siteConfig.plugins.forEach((plugin) => {
try {
const pluginPath = getPluginPath(this.rootPath, plugin);

// eslint-disable-next-line global-require, import/no-dynamic-require
this.plugins[plugin] = require(pluginPath || plugin);
} catch (e) {
logger.warn(`Unable to load plugin ${plugin}, skipping`);
}
});
const defaultPlugins = findDefaultPlugins();

this.siteConfig.plugins
.filter(plugin => !_.includes(defaultPlugins, plugin))
.forEach(plugin => this.loadPlugin(plugin, false));

const markbindPrefixRegex = new RegExp(`^${MARKBIND_PLUGIN_PREFIX}`);
defaultPlugins
.filter(plugin => !_.get(this.siteConfig,
['pluginsContext', plugin.replace(markbindPrefixRegex, ''), 'off'],
false))
.forEach(plugin => this.loadPlugin(plugin, true));
};

/**
Expand Down
40 changes: 40 additions & 0 deletions src/plugins/default/markbind-plugin-anchors.js
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
const cheerio = module.parent.require('cheerio');
const md = require('./../../lib/markbind/src/lib/markdown-it');

const ANCHOR_HTML = '<a class="fa fa-anchor" href="#"></a>';

/**
* Generates a heading selector based on the indexing level
* @param headingIndexingLevel to generate
*/
function generateHeadingSelector(headingIndexingLevel) {
let headingsSelector = 'h1';
for (let i = 2; i <= headingIndexingLevel; i += 1) {
headingsSelector += `, h${i}`;
}
return headingsSelector;
}

/**
* Adds anchor links to headers
*/
module.exports = {
postRender: (content, pluginContext, frontMatter, pageConfig) => {
Comment thread
jamos-tay marked this conversation as resolved.
const $ = cheerio.load(content, { xmlMode: false });
if (pageConfig.headingIndexingLevel > 0) {
const headingsSelector = generateHeadingSelector(pageConfig.headingIndexingLevel);
$(headingsSelector).each((i, heading) => {
$(heading).append(ANCHOR_HTML.replace('#', `#${$(heading).attr('id')}`));
});
$('panel[header]').each((i, panel) => {
const panelHeading = cheerio.load(md.render(panel.attribs.header), { xmlMode: false });
if (panelHeading(headingsSelector).length >= 1) {
const headingId = $(panelHeading(headingsSelector)[0]).attr('id');
const anchorIcon = ANCHOR_HTML.replace(/"/g, "'").replace('#', `#${headingId}`);
$(panel).attr('header', `${$(panel).attr('header')}${anchorIcon}`);
}
});
}
return $.html();
},
};
4 changes: 2 additions & 2 deletions test/functional/test_site/expected/index.html
Original file line numberDiff line numberDiff line change
Expand Up@@ -572,8 +572,8 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
<p>Node Modules Plugin Post-render</p>
</div>
<h1 id="test-search-indexing">Test search indexing<a class="fa fa-anchor" href="#test-search-indexing"></a></h1>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed</h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
<h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
<h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed</h6>
</div>
</div>
</div>
Expand Down