Stackedit/res/extensions/toc.js

139 lines
4.5 KiB
JavaScript
Raw Normal View History

2013-05-27 19:45:33 +00:00
define([
"jquery",
"underscore",
2013-06-10 21:22:32 +00:00
"utils",
2013-06-22 23:48:57 +00:00
"classes/Extension",
2013-06-24 19:47:27 +00:00
"text!html/buttonToc.html",
2013-06-22 23:48:57 +00:00
"text!html/tocSettingsBlock.html",
2013-06-24 19:47:27 +00:00
], function($, _, utils, Extension, buttonTocHTML, tocSettingsBlockHTML) {
2013-05-29 19:55:23 +00:00
2013-06-24 19:47:27 +00:00
var toc = new Extension("toc", "Table of Contents", true);
2013-06-22 23:48:57 +00:00
toc.settingsBlock = tocSettingsBlockHTML;
toc.defaultConfig = {
2013-06-24 19:47:27 +00:00
marker: "\\[(TOC|toc)\\]",
button: true,
2013-05-29 19:55:23 +00:00
};
2013-05-30 22:16:12 +00:00
toc.onLoadSettings = function() {
utils.setInputValue("#input-toc-marker", toc.config.marker);
2013-06-24 19:47:27 +00:00
utils.setInputChecked("#input-toc-button", toc.config.button);
2013-05-30 22:16:12 +00:00
};
toc.onSaveSettings = function(newConfig, event) {
newConfig.marker = utils.getInputRegExpValue("#input-toc-marker", event);
2013-06-24 19:47:27 +00:00
newConfig.button = utils.getInputChecked("#input-toc-button");
};
toc.onCreatePreviewButton = function() {
if(toc.config.button) {
2013-07-30 08:46:36 +00:00
return buttonTocHTML;
2013-06-24 19:47:27 +00:00
}
2013-06-22 23:48:57 +00:00
};
2013-05-30 22:16:12 +00:00
2013-05-29 19:55:23 +00:00
// TOC element description
function TocElement(tagName, anchor, text) {
this.tagName = tagName;
this.anchor = anchor;
this.text = text;
this.children = [];
}
TocElement.prototype.childrenToString = function() {
if(this.children.length === 0) {
return "";
}
2013-06-24 19:47:27 +00:00
var result = "<ul>\n";
2013-05-29 19:55:23 +00:00
_.each(this.children, function(child) {
result += child.toString();
});
2013-06-24 19:47:27 +00:00
result += "</ul>\n";
2013-05-29 19:55:23 +00:00
return result;
};
TocElement.prototype.toString = function() {
var result = "<li>";
if(this.anchor && this.text) {
result += '<a href="#' + this.anchor + '">' + this.text + '</a>';
}
2013-06-24 19:47:27 +00:00
result += this.childrenToString() + "</li>\n";
2013-05-29 19:55:23 +00:00
return result;
};
// Transform flat list of TocElement into a tree
function groupTags(array, level) {
level = level || 1;
var tagName = "H" + level;
var result = [];
var currentElement = undefined;
function pushCurrentElement() {
if(currentElement !== undefined) {
if(currentElement.children.length > 0) {
currentElement.children = groupTags(currentElement.children, level + 1);
}
result.push(currentElement);
}
}
_.each(array, function(element, index) {
if(element.tagName != tagName) {
if(currentElement === undefined) {
currentElement = new TocElement();
}
currentElement.children.push(element);
}
else {
pushCurrentElement();
currentElement = element;
}
});
pushCurrentElement();
return result;
}
// Build the TOC
2013-07-28 17:14:42 +00:00
var previewContentsElt = undefined;
2013-05-29 19:55:23 +00:00
function buildToc() {
var anchorList = {};
function createAnchor(element) {
2013-07-28 17:14:42 +00:00
var id = element.id || utils.slugify(element.textContent);
2013-05-29 19:55:23 +00:00
var anchor = id;
var index = 0;
while (_.has(anchorList, anchor)) {
anchor = id + "-" + (++index);
}
anchorList[anchor] = true;
// Update the id of the element
2013-07-28 17:14:42 +00:00
element.id = anchor;
2013-05-29 19:55:23 +00:00
return anchor;
}
var elementList = [];
2013-07-28 17:14:42 +00:00
_.each(previewContentsElt.querySelectorAll('.preview-content > .wmd-title'), function(elt) {
elementList.push(new TocElement(elt.tagName, createAnchor(elt), elt.textContent));
2013-05-29 19:55:23 +00:00
});
elementList = groupTags(elementList);
2013-06-24 19:47:27 +00:00
return '<div class="toc">\n<ul>\n' + elementList.join("") + '</ul>\n</div>\n';
2013-05-29 19:55:23 +00:00
}
toc.onEditorConfigure = function(editor) {
2013-07-28 17:14:42 +00:00
previewContentsElt = document.getElementById('preview-contents');
var tocEltList = document.querySelectorAll('.table-of-contents');
var tocExp = new RegExp("^" + toc.config.marker + "$", "g");
2013-05-29 19:55:23 +00:00
// Run TOC generation when conversion is finished directly on HTML
editor.hooks.chain("onPreviewRefresh", function() {
2013-05-30 22:16:12 +00:00
var htmlToc = buildToc();
2013-07-28 10:35:04 +00:00
// Replace toc paragraphs
2013-07-28 17:14:42 +00:00
_.each(previewContentsElt.getElementsByTagName('p'), function(elt) {
if(tocExp.test(elt.innerHTML)) {
elt.innerHTML = htmlToc;
2013-07-28 10:35:04 +00:00
}
2013-07-24 23:20:56 +00:00
});
2013-07-28 10:35:04 +00:00
// Add toc in the TOC button
2013-07-28 17:14:42 +00:00
_.each(tocEltList, function(elt) {
elt.innerHTML = htmlToc;
});
2013-05-29 19:55:23 +00:00
});
};
return toc;
2013-05-26 01:10:58 +00:00
});