Showing
2 changed files
with
23 additions
and
2 deletions
| ... | @@ -214,6 +214,19 @@ export default function (ngApp, events) { | ... | @@ -214,6 +214,19 @@ export default function (ngApp, events) { |
| 214 | } | 214 | } |
| 215 | }]); | 215 | }]); |
| 216 | 216 | ||
| 217 | + let renderer = new markdown.Renderer(); | ||
| 218 | + // Custom markdown checkbox list item | ||
| 219 | + // Attribution: https://github.com/chjj/marked/issues/107#issuecomment-44542001 | ||
| 220 | + renderer.listitem = function(text) { | ||
| 221 | + if (/^\s*\[[x ]\]\s*/.test(text)) { | ||
| 222 | + text = text | ||
| 223 | + .replace(/^\s*\[ \]\s*/, '<input type="checkbox"/>') | ||
| 224 | + .replace(/^\s*\[x\]\s*/, '<input type="checkbox" checked/>'); | ||
| 225 | + return `<li class="checkbox-item">${text}</li>`; | ||
| 226 | + } | ||
| 227 | + return `<li>${text}</li>`; | ||
| 228 | + }; | ||
| 229 | + | ||
| 217 | /** | 230 | /** |
| 218 | * Markdown input | 231 | * Markdown input |
| 219 | * Handles the logic for just the editor input field. | 232 | * Handles the logic for just the editor input field. |
| ... | @@ -231,13 +244,13 @@ export default function (ngApp, events) { | ... | @@ -231,13 +244,13 @@ export default function (ngApp, events) { |
| 231 | element = element.find('textarea').first(); | 244 | element = element.find('textarea').first(); |
| 232 | let content = element.val(); | 245 | let content = element.val(); |
| 233 | scope.mdModel = content; | 246 | scope.mdModel = content; |
| 234 | - scope.mdChange(markdown(content)); | 247 | + scope.mdChange(markdown(content, {renderer: renderer})); |
| 235 | 248 | ||
| 236 | element.on('change input', (event) => { | 249 | element.on('change input', (event) => { |
| 237 | content = element.val(); | 250 | content = element.val(); |
| 238 | $timeout(() => { | 251 | $timeout(() => { |
| 239 | scope.mdModel = content; | 252 | scope.mdModel = content; |
| 240 | - scope.mdChange(markdown(content)); | 253 | + scope.mdChange(markdown(content, {renderer: renderer})); |
| 241 | }); | 254 | }); |
| 242 | }); | 255 | }); |
| 243 | 256 | ... | ... |
| ... | @@ -281,6 +281,14 @@ ol { | ... | @@ -281,6 +281,14 @@ ol { |
| 281 | overflow: hidden; | 281 | overflow: hidden; |
| 282 | } | 282 | } |
| 283 | 283 | ||
| 284 | +li.checkbox-item { | ||
| 285 | + list-style: none; | ||
| 286 | + margin-left: - ($-m * 1.3); | ||
| 287 | + input[type="checkbox"] { | ||
| 288 | + margin-right: $-xs; | ||
| 289 | + } | ||
| 290 | +} | ||
| 291 | + | ||
| 284 | /* | 292 | /* |
| 285 | * Generic text styling classes | 293 | * Generic text styling classes |
| 286 | */ | 294 | */ | ... | ... |
-
Please register or sign in to post a comment