Support for notes within markdown

This commit is contained in:
Adam Hepton
2013-06-25 12:15:22 +01:00
parent 235c78a5c8
commit 245efee894
2 changed files with 41 additions and 15 deletions

View File

@ -28,7 +28,9 @@
};
var twrap = function(el) {
return '<script type="text/template">' + el + '</script>';
var cnt = el.content || el;
cnt += el.asideContent ? ('<aside class="notes" data-markdown>' + el.asideContent + '</aside>') : '';
return '<script type="text/template">' + cnt + '</script>';
};
var getForwardedAttributes = function(section) {
@ -40,7 +42,7 @@
value = attributes[i].value;
// disregard attributes that are used for markdown loading/parsing
if( /data\-(markdown|separator|vertical)/gi.test( name ) ) continue;
if( /data\-(markdown|separator|vertical|notes)/gi.test( name ) ) continue;
if( value ) {
result.push( name + '=' + value );
@ -53,22 +55,27 @@
return result.join( ' ' );
}
var slidifyMarkdown = function(markdown, separator, vertical, attributes) {
var slidifyMarkdown = function(markdown, separator, vertical, notes, attributes) {
separator = separator || '^\n---\n$';
var reSeparator = new RegExp(separator + (vertical ? '|' + vertical : ''), 'mg'),
reHorSeparator = new RegExp(separator),
notesSeparator = new RegExp(notes, 'mg'),
matches,
noteMatch,
lastIndex = 0,
isHorizontal,
wasHorizontal = true,
content,
asideContent,
slide,
sectionStack = [],
markdownSections = '';
// iterate until all blocks between separators are stacked up
while( matches = reSeparator.exec(markdown) ) {
asideContent = null;
// determine direction (horizontal by default)
isHorizontal = reHorSeparator.test(matches[0]);
@ -80,18 +87,28 @@
// pluck slide content from markdown input
content = markdown.substring(lastIndex, matches.index);
noteMatch = content.split(notesSeparator);
if(noteMatch.length === 2) {
content = noteMatch[0];
asideContent = noteMatch[1].trim();
}
slide = {
content: content,
asideContent: asideContent || ""
};
if( isHorizontal && wasHorizontal ) {
// add to horizontal stack
sectionStack.push(content);
sectionStack.push(slide);
} else {
// add to vertical stack
sectionStack[sectionStack.length-1].push(content);
sectionStack[sectionStack.length-1].push(slide);
}
lastIndex = reSeparator.lastIndex;
wasHorizontal = isHorizontal;
}
// add the remaining slide
@ -99,15 +116,13 @@
// flatten the hierarchical stack, and insert <section data-markdown> tags
for( var k = 0, klen = sectionStack.length; k < klen; k++ ) {
// horizontal
if( typeof sectionStack[k] === 'string' ) {
markdownSections += '<section '+ attributes +' data-markdown>' + twrap( sectionStack[k] ) + '</section>';
}
// vertical
else {
if(sectionStack[k].propertyIsEnumerable(length) && typeof sectionStack[k].splice === "function") {
markdownSections += '<section '+ attributes +'>' +
'<section data-markdown>' + sectionStack[k].map(twrap).join('</section><section data-markdown>') + '</section>' +
'</section>';
} else {
markdownSections += '<section '+ attributes +' data-markdown>' + twrap( sectionStack[k] ) + '</section>';
}
}
@ -131,7 +146,7 @@
xhr.onreadystatechange = function () {
if( xhr.readyState === 4 ) {
if (xhr.status >= 200 && xhr.status < 300) {
section.outerHTML = slidifyMarkdown( xhr.responseText, section.getAttribute('data-separator'), section.getAttribute('data-vertical'), getForwardedAttributes(section) );
section.outerHTML = slidifyMarkdown( xhr.responseText, section.getAttribute('data-separator'), section.getAttribute('data-vertical'), section.getAttribute('data-notes'), getForwardedAttributes(section) );
} else {
section.outerHTML = '<section data-state="alert">ERROR: The attempt to fetch ' + url + ' failed with the HTTP status ' + xhr.status +
'. Check your browser\'s JavaScript console for more details.' +
@ -150,7 +165,7 @@
} else if( section.getAttribute('data-separator') ) {
var markdown = stripLeadingWhitespace(section);
section.outerHTML = slidifyMarkdown( markdown, section.getAttribute('data-separator'), section.getAttribute('data-vertical'), getForwardedAttributes(section) );
section.outerHTML = slidifyMarkdown( markdown, section.getAttribute('data-separator'), section.getAttribute('data-vertical'), section.getAttribute('data-notes'), getForwardedAttributes(section) );
}
}