janishutz-legacy/impress.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve markdown support. (#817)

Browse Source 
1. Support `marked`, you can using it instead. #811
2. Auto trim the indentation, so it can be indent like regular HTML.
   #812
This commit is contained in:
thawk
2022-08-19 16:57:48 +08:00
committed by GitHub
parent dc3cf69747
commit f8dd0e92b4
3 changed files with 161 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
examples/markdown/index.html
View File

@@ -182,6 +182,7 @@ toggle the CSS style:</p>
<script type="text/javascript" src="../../extras/highlight/highlight.pack.js"></script> <script type="text/javascript" src="../../extras/highlight/highlight.pack.js"></script>
<script type="text/javascript" src="../../extras/mermaid/mermaid.min.js"></script> <script type="text/javascript" src="../../extras/mermaid/mermaid.min.js"></script>
<script type="text/javascript" src="../../extras/markdown/markdown.js"></script> <script type="text/javascript" src="../../extras/markdown/markdown.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> -->
<!-- <!--
To make all described above really work, you need to include impress.js in the page. To make all described above really work, you need to include impress.js in the page.

117
js/impress.js
View File

@@ -2023,48 +2023,95 @@
* Copyright 2016 Henrik Ingo (@henrikingo) * Copyright 2016 Henrik Ingo (@henrikingo)
* Released under the MIT license. * Released under the MIT license.
*/ */
/* global markdown, hljs, mermaid, impress, document, window */ /* global markdown, marked, hljs, mermaid, impress */
( function( document, window ) { ( function( document, window ) {
"use strict"; "use strict";
var preInit = function() { const SLIDE_SEPARATOR = /^-----$/m;
if ( window.markdown ) {
// Unlike the other extras, Markdown.js doesn't by default do anything in const getMarkdownParser = function( ) {
// particular. We do it ourselves here. if ( window.hasOwnProperty( "marked" ) ) {
// In addition, we use "-----" as a delimiter for new slide.
// Using marked
return function( elem, src ) {
return marked.parse( src );
};
} else if ( window.hasOwnProperty( "markdown" ) ) {
// Using builtin markdown engine
return function( elem, src ) {
var dialect = elem.dataset.markdownDialect;
return markdown.toHTML( src, dialect );
};
}
return null;
};
const getMarkdownSlides = function( elem ) {
var text = elem.textContent;
// Using first not blank line to detect leading whitespaces.
// can't properly handle the mixing of space and tabs
var m = text.match( /^([ \t]*)\S/m );
if ( m !== null ) {
text = text.replace( new RegExp( "^" + m[ 1 ], "mg" ), "" );
}
return text.split( SLIDE_SEPARATOR );
};
const convertMarkdowns = function( selector ) {
// Detect markdown engine
var parseMarkdown = getMarkdownParser();
if ( !parseMarkdown ) {
return;
}
for ( var elem of document.querySelectorAll( selector ) ) {
var id = null;
if ( elem.id ) {
id = elem.id;
elem.id = "";
}
var origTitle = null;
if ( elem.title ) {
origTitle = elem.title;
elem.title = "";
}
var slides = getMarkdownSlides( elem );
var slideElems = [ elem ];
for ( var j = 1; j < slides.length; ++j ) {
var newElem = elem.cloneNode( false );
newElem.id = "";
elem.parentNode.insertBefore( newElem, slideElems[ 0 ] );
slideElems.splice( 0, 0, newElem );
}
if ( id ) {
slideElems[ 0 ].id = id;
}
for ( var i = 0; i < slides.length; ++i ) {
slideElems[ i ].innerHTML =
parseMarkdown( slideElems[ i ], slides[ i ] );
if ( origTitle && ( i === 0 ) ) {
slideElems[ i ].title = origTitle;
}
}
}
};
var preInit = function() {
// Query all .markdown elements and translate to HTML // Query all .markdown elements and translate to HTML
var markdownDivs = document.querySelectorAll( ".markdown" ); convertMarkdowns( ".markdown" );
for ( var idx = 0; idx < markdownDivs.length; idx++ ) {
var element = markdownDivs[ idx ];
var dialect = element.dataset.markdownDialect;
var slides = element.textContent.split( /^-----$/m );
var i = slides.length - 1;
element.innerHTML = markdown.toHTML( slides[ i ], dialect );
// If there's an id, unset it for last, and all other, elements,
// and then set it for the first.
var id = null;
if ( element.id ) {
id = element.id;
element.id = "";
}
i--;
while ( i >= 0 ) {
var newElement = element.cloneNode( false );
newElement.innerHTML = markdown.toHTML( slides[ i ], dialect );
element.parentNode.insertBefore( newElement, element );
element = newElement;
i--;
}
if ( id !== null ) {
element.id = id;
}
}
} // Markdown
if ( window.hljs ) { if ( window.hljs ) {
hljs.initHighlightingOnLoad(); hljs.initHighlightingOnLoad();

117
src/plugins/extras/extras.js
View File

@@ -9,48 +9,95 @@
* Copyright 2016 Henrik Ingo (@henrikingo) * Copyright 2016 Henrik Ingo (@henrikingo)
* Released under the MIT license. * Released under the MIT license.
*/ */
/* global markdown, hljs, mermaid, impress, document, window */ /* global markdown, marked, hljs, mermaid, impress */
( function( document, window ) { ( function( document, window ) {
"use strict"; "use strict";
var preInit = function() { const SLIDE_SEPARATOR = /^-----$/m;
if ( window.markdown ) {
// Unlike the other extras, Markdown.js doesn't by default do anything in const getMarkdownParser = function( ) {
// particular. We do it ourselves here. if ( window.hasOwnProperty( "marked" ) ) {
// In addition, we use "-----" as a delimiter for new slide.
// Using marked
return function( elem, src ) {
return marked.parse( src );
};
} else if ( window.hasOwnProperty( "markdown" ) ) {
// Using builtin markdown engine
return function( elem, src ) {
var dialect = elem.dataset.markdownDialect;
return markdown.toHTML( src, dialect );
};
}
return null;
};
const getMarkdownSlides = function( elem ) {
var text = elem.textContent;
// Using first not blank line to detect leading whitespaces.
// can't properly handle the mixing of space and tabs
var m = text.match( /^([ \t]*)\S/m );
if ( m !== null ) {
text = text.replace( new RegExp( "^" + m[ 1 ], "mg" ), "" );
}
return text.split( SLIDE_SEPARATOR );
};
const convertMarkdowns = function( selector ) {
// Detect markdown engine
var parseMarkdown = getMarkdownParser();
if ( !parseMarkdown ) {
return;
}
for ( var elem of document.querySelectorAll( selector ) ) {
var id = null;
if ( elem.id ) {
id = elem.id;
elem.id = "";
}
var origTitle = null;
if ( elem.title ) {
origTitle = elem.title;
elem.title = "";
}
var slides = getMarkdownSlides( elem );
var slideElems = [ elem ];
for ( var j = 1; j < slides.length; ++j ) {
var newElem = elem.cloneNode( false );
newElem.id = "";
elem.parentNode.insertBefore( newElem, slideElems[ 0 ] );
slideElems.splice( 0, 0, newElem );
}
if ( id ) {
slideElems[ 0 ].id = id;
}
for ( var i = 0; i < slides.length; ++i ) {
slideElems[ i ].innerHTML =
parseMarkdown( slideElems[ i ], slides[ i ] );
if ( origTitle && ( i === 0 ) ) {
slideElems[ i ].title = origTitle;
}
}
}
};
var preInit = function() {
// Query all .markdown elements and translate to HTML // Query all .markdown elements and translate to HTML
var markdownDivs = document.querySelectorAll( ".markdown" ); convertMarkdowns( ".markdown" );
for ( var idx = 0; idx < markdownDivs.length; idx++ ) {
var element = markdownDivs[ idx ];
var dialect = element.dataset.markdownDialect;
var slides = element.textContent.split( /^-----$/m );
var i = slides.length - 1;
element.innerHTML = markdown.toHTML( slides[ i ], dialect );
// If there's an id, unset it for last, and all other, elements,
// and then set it for the first.
var id = null;
if ( element.id ) {
id = element.id;
element.id = "";
}
i--;
while ( i >= 0 ) {
var newElement = element.cloneNode( false );
newElement.innerHTML = markdown.toHTML( slides[ i ], dialect );
element.parentNode.insertBefore( newElement, element );
element = newElement;
i--;
}
if ( id !== null ) {
element.id = id;
}
}
} // Markdown
if ( window.hljs ) { if ( window.hljs ) {
hljs.initHighlightingOnLoad(); hljs.initHighlightingOnLoad();