Added checkbox sytax parsing to markdown lists

Closes #319
This commit is contained in:
Dan Brown 2017-02-25 13:16:26 +00:00
parent af3c0e43a5
commit b0e849f413
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
2 changed files with 23 additions and 2 deletions

View File

@ -214,6 +214,19 @@ export default function (ngApp, events) {
}
}]);
let renderer = new markdown.Renderer();
// Custom markdown checkbox list item
// Attribution: https://github.com/chjj/marked/issues/107#issuecomment-44542001
renderer.listitem = function(text) {
if (/^\s*\[[x ]\]\s*/.test(text)) {
text = text
.replace(/^\s*\[ \]\s*/, '<input type="checkbox"/>')
.replace(/^\s*\[x\]\s*/, '<input type="checkbox" checked/>');
return `<li class="checkbox-item">${text}</li>`;
}
return `<li>${text}</li>`;
};
/**
* Markdown input
* Handles the logic for just the editor input field.
@ -231,13 +244,13 @@ export default function (ngApp, events) {
element = element.find('textarea').first();
let content = element.val();
scope.mdModel = content;
scope.mdChange(markdown(content));
scope.mdChange(markdown(content, {renderer: renderer}));
element.on('change input', (event) => {
content = element.val();
$timeout(() => {
scope.mdModel = content;
scope.mdChange(markdown(content));
scope.mdChange(markdown(content, {renderer: renderer}));
});
});

View File

@ -281,6 +281,14 @@ ol {
overflow: hidden;
}
li.checkbox-item {
list-style: none;
margin-left: - ($-m * 1.3);
input[type="checkbox"] {
margin-right: $-xs;
}
}
/*
* Generic text styling classes
*/