Skip to content

Instantly share code, notes, and snippets.

@kenmazaika kenmazaika/README.md
Last active Apr 19, 2019

Embed
What would you like to do?
Showdown Markdown extension

Markdown Extensions for Wells and PrismJS

Hello

foo
```javascript:4,5-7
hello
```

---*
This is in a well
---*

Yolo

Will map to:

<p>Hello</p>
<p>foo</p>
<pre data-line="4,5-7"><code class="language-javascript">
hello
</code></pre>
<div class='well'>
This is in a well
</div>
<p>Yolo</p>

TODO

Make

**[red]Stuff**

Map to:

<strong style="color:red">Stuff</strong>
"use strict";
var showdown = require('showdown');
/*
// Supports syntax in the following:
```javascript:1,3-4
console.log("hi");
console.log("hi");
console.log("hi");
console.log("hi");
```
// To map to:
<pre data-line="1,3-4"><code class="language-javascript">
console.log("hi");
console.log("hi");
console.log("hi");
console.log("hi");
</code></pre>
// This conforms to the PrismJS Standard.
*/
showdown.extension('showdown-extension-prism-js', function() {
'use strict';
var pattern = /```/g;
return {
type: 'lang',
filter: function (text, converter, options) {
var lines = text.split(/\r?\n/);
var starting = true;
let newLines = [];
lines.forEach( (line) => {
if( line.substr(0, 3) === '```' ) {
if(starting) {
const codeInfo = line.substring(3, line.length);
const split = codeInfo.split(":");
const language = split[0];
const lines = split[1];
let lineClass = "";
if( lines ) {
lineClass = ' data-line="' +lines + "\"";
}
newLines.push("<pre" + lineClass + "><code class=\"language-" + language + "\">");
starting = false;
} else {
newLines.push("</code></pre>");
starting = true;
}
} else {
newLines.push(line);
}
});
return newLines.join("\n");
},
regex: pattern,
replace: 'bar'
};
});
/*
// Support including a well of additional information. Example:
Hello
---*
Did you know?
---*
Goodbye
// To map to:
<p>Hello</p>
<div class="well">Did you know?</div>
<p>
Goodbye
</p>
*/
showdown.extension('showdown-extension-well', function() {
'use strict';
var pattern = /---*/g;
return {
type: 'lang',
filter: function (text, converter, options) {
var lines = text.split(/\r?\n/);
var starting = true;
let newLines = [];
lines.forEach((line) => {
if(line.substr(0, 4) === '---*') {
if(starting) {
starting = false;
newLines.push("<div class='well'>")
} else {
starting = true;
newLines.push("</div>")
}
} else {
newLines.push(line);
}
});
return newLines.join("\n");
}
}
});
const converter = new showdown.Converter({
extensions: ['showdown-extension-prism-js', 'showdown-extension-well']
});
const markdownSyntax = `
Hello
foo
\`\`\`javascript:4,5-7
hello
\`\`\`
---*
This is in a well
---*
Yolo`;
const html = converter.makeHtml(markdownSyntax);
console.log(html);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.